2014-09-02 1857 views
2

我在我的网站上玩耍着javascript,并且有一个涉及网络摄像头的想法。我的首要任务是简单地从用户的网络摄像头获取数据并在网站上显示。Chrome浏览器 - 允许访问摄像头

我的网站是hheim.com。 这里的所有代码:

的index.html

<html> 
<head> 
<title>Selfie</title> 
</head> 
<body> 
<video></video> 
<script src="video.js"></script> 
</body> 
</html> 

的Video.js

(function() { 
navigator.getMedia = (navigator.getUserMedia || navigator.webkitGetUserMedia ||    navigator.mozGetUserMedia); 
navigator.getMedia(
{video:true, audio:false}, 
function (mediaStream) { 
var video = document.getElemtsByTagName('video')[0]; 
video.src = window.URL.createObjectURL(mediaStream); 
video.play(); 
}, 
function (error) { 
console.log(error); 
}) 
})(); 

当我加载页面,Chrome的说,它的阻止网络摄像头。好的,我预料到了。按预期工作。但是,当我点击相机图标来解锁我的网站时,只有两个选项是“询问”和“继续阻止”。它默认为“继续阻止”。

当我更改为“询问”时,工具栏下拉提示我重新加载页面。当我重新加载页面时,我没有被问到,仍然被阻止,并且它仍然默认为“继续阻止”。

我已经做了一些谷歌搜索,似乎无法找到解决方案。是否有更多的代码需要包含?我是一个有问题的人(饼干等)?或者这是Chrome的实际问题?

+0

'document.getElemtsByTagName('video')[0];'?,修改该语法。 – gab06 2014-09-02 23:54:33

+0

我想你正在HTTP上运行你的页面,对吧?当您使用HTTPS时,浏览器更加宽容。 Chrome甚至记得答案,然后不再问第二次... – 2014-09-04 08:04:22

回答

1

首先,您必须检查用户媒体是否可用并准备好被授予。要记住的eval是邪恶的:)

navigator.getUserMedia = (navigator.getUserMedia || 
         navigator.webkitGetUserMedia || 
         navigator.mozGetUserMedia || 
         navigator.msGetUserMedia); 

if (navigator.getUserMedia) { 
    navigator.getUserMedia (

     // constraints 
     { 
     video: true, 
     audio: true 
     }, 

     // successCallback 
     function(localMediaStream) { 
     var video = document.getElementById('stream'); 
     video.src = window.URL.createObjectURL(localMediaStream); 
     // Do something with the video here, e.g. video.play() 
     }, 

     // errorCallback 
     function(err) { 
     console.log("The following error occured: " + err); 
     } 
    ); 
} else { 
    console.log("getUserMedia not supported"); 
} 

https://developer.mozilla.org/en-US/docs/NavigatorUserMedia.getUserMedia

集ID为视频和自动播放属性;

<video id="stream" autoplay></video> 
0

最后,我不得不进入我的Chrome设置并将默认摄像头设置从“拒绝”更改为“问”。

有人会认为Chrome可以记住我的网页决定,当它要求我重新加载它,但我猜不是。

感谢您的回复!