Question

我们有一个带文件输入的HTML5页面：

<input accept="image/*" type="file">

现在，在Chrome，Safari，Firefox（包括Android或iOS）和Facebook iOS的网页浏览中，这将允许从相机胶卷或相机中选择图像。

然而，当在Facebook Webview内的Android上使用它时，它只会提供像Images / Recent / Google Drive / Photos这样的选项，但没有相机。

这是一个错误还是Facebook有意识的选择？有没有办法在Facebook Android的webview中使用手机摄像头作为图像来源？

Answer 1

最后，我针对此问题的解决方案是使用localstream创建视频元素：

var videoCamera = document.createElement('video');
videoCamera.setAttribute("id", "video");
videoCamera.setAttribute("height", 320);
videoCamera.setAttribute("width", 480);
videoCamera.setAttribute("video", true);
videoCamera.autoPlay = true;
$('#video-container').prepend(videoCamera);


if(navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
  navigator.mediaDevices.getUserMedia({ video: true }).then(function(stream) {
     video.src = window.URL.createObjectURL(stream);
     video.play();
     localStream = stream;
  });
}

然后我将有一个按钮，该按钮将基本上获取当前帧并将其放在画布上：

 var canv = document.createElement('canvas');
 canv.width = $('#video').width();
 canv.height = $('#video').height();

 var ctx=canv.getContext("2d");

 ctx.drawImage(video, 0, 0,$('#video').width(), $('#video').height());
 ctx.restore();
 localStream.getVideoTracks()[0].stop();

一旦您可以在画布上获取快照，就可以将其导出到Base64：

canv.toDataURL();

Answer 2

不确定但尝试添加capture="camera"

<input type="file" accept="image/*" capture="camera">

如何使用相机作为Facebook Android Webview内文件输入的来源

2 个答案: