我的代码在这里
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
</head>
<body>
<div >
<video autoplay="true" id="videoElement" src=""></video>
</div>
<script>
navigator.getUserMedia = navigator.getUserMedia ||
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia ||
navigator.msGetUserMedia ||
navigator.oGetUserMedia;
if (navigator.getUserMedia) {
console.log("Browser supports getUserMedia");
navigator.getUserMedia({ video: 'true' },
function(stream) {
console.log("on succes call back");
var video = document.getElementById("videoElement");
video.src = window.URL.createObjectURL(stream);
video.onloadedmetadata = function(e) {
video.play();
};
},
function(err) {
console.log("The following error occured: " + err.name);
}
);
} else {
console.log("getUserMedia not supported");
}
</script>
</body>
</html>
我已将上述代码保存到 sample.html 文件中。当我在 firefox 中打开文件时,我可以看到来自网络摄像头的视频。
这里的问题是,当我使用 google chrome 或 opera(Crome 和 opera 的工作方式类似)浏览器打开文件时,我无法看到视频。
我的浏览器版本
Chrome:版本 41.0.2272.89(64 位)
来自 chrome 的控制台日志在这里:
Browser supports getUserMedia
Navigated to file:///home/xyz/sample.html
任何人都可以解释导致 chrome 或 opera 问题的原因吗?
提前致谢!
最佳答案
Chrome 不允许来自 file:///
url 的 getUserMedia()
,而 Firefox 允许。
要解决此问题,请运行本地 Web 服务器并改用 localhost/
,并将您的文件放在那里。如果您使用的是 Linux 或 OSX,请运行类似 python -m SimpleHTTPServer
的程序。对于 Windows see this answer .
或者使用 Firefox。 ;)
关于javascript - 为什么 GetUserMedia 无法在 Google Chrome 中显示视频?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31209113/