html5打包成app不能拍照,vue项目打包成app无法使用input调用相机

问题描述：打包成app后使用input上传图片只能做到在文件夹中选取，不能实现拍照上传图片

解决方案：

1.利用HTML5 Plus的Camera调用相机

2.利用HTML5 Plus的IO来实现读取拍照所得的图片文件

3.使用base64上传图片

clickInputLoader() {

let _this = this

if (~navigator.userAgent.indexOf("Html5Plus")) {

let plusReady = function(callback) {

if (window.plus) {

callback();

} else {

document.addEventListener("plusready", callback);

}

};

plusReady(function() {

let camera = plus.camera.getCamera(); // 调用相机

camera.captureImage(

function(filePath) {

plus.io.resolveLocalFileSystemURL( // 通过URL参数获取目录对象或文件对象

filePath,

function(entry) {

_this.lodingShow = true;

let reader = null

entry.file(function(file) {

let sizeJudge = false;

sizeJudge = _this.checkSize(file.size);

if (sizeJudge === false) {

return;

}

reader = new plus.io.FileReader(); // 文件系统中的读取文件对象，用于获取文件的内容

reader.onload = function(e) {

}

reader.readAsDataURL(file);

reader.onloadend = function(e) {

let dataBase = e.target.result; // 获取Base64，FileReader()返回

uploadImgBase64({ //调用上传接口

file:dataBase

})

.then(res => {

if (res.data.code === 200) {

_this.lodingShow = false;

_this.alertVal = "图片上传成功";

_this.showPluginAuto();

} else {

_this.lodingShow = false;

_this.alertVal = res.data.msg;

_this.showPluginAuto();

}

})

.catch(() => {

_this.lodingShow = false;

_this.alertVal = "图片上传失败！";

_this.showPluginAuto();

});

},function (e) {

alert( e.message );

} ;

});

reader.abort();

},

function(e) {

plus.nativeUI.toast("读取拍照文件错误：" + e.message);

}

);

},

function() {

alert("拍照失败");

}

);

});

}

},