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

 

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.点击使用的时候,服务端拷贝一份相同的图片,并且保存数据到表里,再返回对应当前帧的服务器图片地址,替换对应帧记录显示。

posted on 2018-07-20 16:07  ouycx  阅读(410)  评论(0编辑  收藏  举报

导航