基于mui开发webApp，用户头像拍照上传，相册选取上传

基于mui开发webApp，用户头像拍照上传，相册选取上传

js关键代码片段：

   /*点击头像触发*/ ElementById('headImage').addEventListener('tap', function() { if (mui.os.plus) { var a = [{ title: "拍照" }, { title: "从手机相册选择" }]; plus.nativeUI.actionSheet({ title: "修改用户头像", cancel: "取消", buttons: a }, function(b) { /*actionSheet 按钮点击事件*/ switch (b.index) { case 0: break; case 1: getImage(); /*拍照*/ break; case 2: galleryImg();/*打开相册*/ break; default: break; } }) } }, false); //拍照 function getImage() { var c = Camera(); c.captureImage(function(e) { solveLocalFileSystemURL(e, function(entry) { var s = LocalURL() + "?version=" + new Date().getTime(); uploadHead(s); /*上传图片*/ }, function(e) { console.log("读取拍照文件错误：" + e.message); }); }, function(s) { console.log("error" + s); }, { filename: "_doc/head.png" }) } //本地相册选择 function galleryImg() { plus.gallery.pick(function(a) { solveLocalFileSystemURL(a, function(entry) { solveLocalFileSystemURL("_doc/", function(root) { File("head.png", {}, function(file) { //文件已存在 ve(function() { console.log("file remove success"); pyTo(root, 'head.png', function(e) { var e = e.fullPath + "?version=" + new Date().getTime(); uploadHead(e); /*上传图片*/ //变更大图预览的src //目前仅有一张图片，暂时如此处理，后续需要通过标准组件实现 }, function(e) { console.log('copy image fail:' + e.message); }); }, function() { console.log("delete image fail:" + e.message); }); }, function() { //文件不存在 pyTo(root, 'head.png', function(e) { var path = e.fullPath + "?version=" + new Date().getTime(); uploadHead(path); /*上传图片*/ }, function(e) { console.log('copy image fail:' + e.message); }); }); }, function(e) { console.log("get _www folder fail"); }) }, function(e) { console.log("读取拍照文件错误：" + e.message); }); }, function(a) {}, { filter: "image" }) }; //上传头像图片 function uploadHead(imgPath) { var mainImage = ElementById("headImage");console.log("imgPath = " + imgPath); mainImage.src = imgPath; mainImage.style.width = "90px"; mainImage.style.height = "90px"; var image = new Image(); image.src = imgPath; load = function() { var imgData = getBase64Image(image); /*在这里调用上传接口*/ var userId=Item('userId');mui.ajax(httpUrl+'appPath/appPath!ajaxUploadImg?userId='+userId,{data:{imgData:imgData},dataType:'json',//服务器返回json格式数据type:'post',//HTTP请求类型timeout:10000,//超时时间设置为10秒；success:function(data){console.log('上传成功'); },error:function(xhr,type,errorThrown){ast('网络异常，请稍后再试！'); }});} } //将图片压缩转成base64 function getBase64Image(img) { var canvas = ateElement("canvas"); var width = img.width; var height = img.height; // calculate the width and height, constraining the proportions if (width > height) { if (width > 100) { height = und(height *= 100 / width); width = 100; } } else { if (height > 100) { width = und(width *= 100 / height); height = 100; } } canvas.width = width;   /*设置新的图片的宽度*/ canvas.height = height; /*设置新的图片的长度*/ var ctx = Context("2d"); ctx.drawImage(img, 0, 0, width, height); /*绘图*/ var dataURL = DataURL("image/png", 0.8); place("data:image/png;base64,", ""); }    function photoerror(img){img.src="img/mryh.png";img.null;   //控制不要一直跳动}