码迷,mamicode.com
首页 > 其他好文 > 详细

影像采集-拍照 (用自己的插件 )简单逻辑

时间:2018-07-20 16:45:11      阅读:203      评论:0      收藏:0      [点我收藏+]

标签:查找   标签   font   embed   time   div   记录   cap   class   

 

1. 加载插件
camera.js    加载的插件是摄像头插件
image.js    加载的是图像插件
???????????????
2.把插件的el 加载到要插入的dom元素中, 一般用 embed 标签可设置器宽高
3.在调用摄像头插件  that.cameraPlugin.open()方法打开插件
4.调用图像插件  that.cameraPlugin.capture() 截图 并且会把当前截图的路径返回
5.调用图像插件   显示图片 that.imgEditerPlugin.showImage(URL, 0, that.width, that.height);????????????
6 使用(把图片上传服务器,再把图片信息保存到表里 如task_img 及img_info),再把显示图片的地址改成服务器的地址显示
 
a.二进制上传图片:
 
 var dataURItoBlob = function (dataURI) {
        var byteString = atob(dataURI.split(‘,‘)[1]);
        var mimeString = dataURI.split(‘,‘)[0].split(‘:‘)[1].split(‘;‘)[0];
????      var ab = new ArrayBuffer(byteString.length);
        var ia = new Uint8Array(ab);
        for (var i = 0; i < byteString.length; i++) {
            ia[i] = byteString.charCodeAt(i);
        }
        return new Blob([ab], {type: mimeString});
    },
    fd = new FormData(),
    fname = (new Date().getTime()) + parseInt(Math.random() * 1000, 10) + ".jpg",
    blob = dataURItoBlob("data:image/jpg;base64," + that.imgEditerPlugin.encodeBase64());

fd.append("file", blob, fname);
ajax.ajax({
    contentType: false,
    cache: false,
    url: uploadUrl,
    type: "POST",
    processData: false,
    data: fd
}).then(function (result) {});
7.图片共享:
a.先根据客户号、影像类别查找已经已经上传的图片帧、先获取到以前的url并显示图片;
b.点击使用的时候,服务端拷贝一份相同的图片,并且保存数据到表里,再返回对应当前帧的服务器图片地址,替换对应帧记录显示。

影像采集-拍照 (用自己的插件 )简单逻辑

标签:查找   标签   font   embed   time   div   记录   cap   class   

原文地址:https://www.cnblogs.com/ouycx/p/9342022.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!