我正在尝试将相机输入打印到HTML5中的Canvas元素。在桌面上它工作正常,但使用cordova为Android设备构建它,我无法访问相机,我真的不知道我做错了什么。我也尝试过Crosswalk,在那里我没有错误,但是相机也没有显示。但我想用Cordova做,因为我必须使用一些Cordova插件。
这是我的代码:
navigator.getUserMedia = (navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia);
navigator.getUserMedia(options, onSuccess, onFail);
var options = {
audio: false,
video: {
mandatory: {
maxWidth: window.innerWidth,
maxHeight: window.innerHeight
},
optional: [{ facingMode: "user" }]
}
}
var onFail = function(e) {
alert('Failed to get camera');
};
var onSuccess = function(stream) {
var video = document.getElementById('my-webcam');
if(navigator.mozGetUserMedia) {
video.mozSrcObject = stream;
console.log("videoWidth" + video.width);
} else {
var url = window.URL || window.webkitURL;
video.src = url.createObjectURL(stream);
}
// Wait 1000 ms before starting the loop otherwise the videosize aren´t set, so the Canvas can´t get values from the video
setTimeout(function(){
setInterval(updateCanvas,30); //manipulating the canvas here
// Make sure the canvas is the same size as the video
var video = document.getElementById('my-webcam'); //invisible
var canvas = document.getElementById('my-canvas'); //where the camera input should be shown
canvas.width = video.videoWidth;
canvas.height = video.videoHeight; //- $('#mainPage_ButtonPhoto').height();
},1000);
};
但是,如果我构建这个,我总是得到onfail警告“无法获取相机”。
我发现它是一个“errorPermissionDeniedError”。我用xdk构建它。但是使用这个android.json,或用于构建android的应用程序清单,它仍然无法正常工作。
{
"prepare_queue": {
"installed": [],
"uninstalled": []
},
"config_munge": {
"files": {}
},
"installed_plugins": {},
"dependent_plugins": {},
"permissions": {
"audio-capture": {
"description": "Required to capture audio using getUserMedia()",
access: "readwrite"
},
"video-capture": {
"description": "Required to capture video using getUserMedia()",
access: "readwrite"
}
}
}