我只想知道如何在 Js 中打开网络摄像头，但 我不想要任何指向 API 或其他库的链接，因为我总是自己编写代码但找不到方法.我只想要一两行代码关于如何用js打开网络摄像头，并想要一些描述它是如何工作的，它在哪个浏览器中工作。
【问题讨论】：
标签： javascript jquery webcam
我推荐你使用像ScriptCam这样的第三方库，但是由于你声明要编写自己的代码，所以我将解释使用新的用户媒体API。
它是在 W3C 工作草案 HTML Media Capture 和 getUserMedia() 中引入的。以下浏览器实验性地支持它：
在 Chrome 18 或更高版本中，可以访问 about:flags 站点启用 API。
在 Opera 中，您必须下载一个实验性的 Android or desktop builds。
在 HTML 中，您需要使用 video 元素
<video id="basic-stream" class="videostream" autoplay=""></video>
首先你需要设置权限：
navigator.getUserMedia({video: true, audio: true}, function(localMediaStream) {
var video = document.querySelector('video');
video.src = window.URL.createObjectURL(localMediaStream);
// Note: onloadedmetadata doesn't fire in Chrome when using it with getUserMedia.
// See crbug.com/110938.
video.onloadedmetadata = function(e) {
// Ready to go. Do some stuff.
};
}, onFailSoHard);
如果您想要在 Chrome 和 Opera 中运行的代码，以下代码示例应该可以完成工作：
navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia;
var video = document.querySelector('video');
if (navigator.getUserMedia) {
navigator.getUserMedia({audio: true, video: true}, function(stream) {
if (navigator.webkitGetUserMedia) {
video.src = window.webkitURL.createObjectURL(stream);
} else {
video.src = stream; // Opera
}
}, onFailSoHard);
} else {
video.src = 'somevideo.webm'; // fallback.
}
可以通过以下方式检查 API 是否可用：
function hasGetUserMedia() {
// Note: Opera builds are unprefixed.
return !!(navigator.getUserMedia || navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia || navigator.msGetUserMedia);
}
更多信息可以参考教程Capturing Audio & Video in HTML
供应商前缀可能会导致语法问题，因此请注意它们。
【讨论】：
需要 Opera Mobile 12。如果您添加 webkit 前缀，它应该也可以在 Chrome 21 中使用。
if(navigator.getUserMedia) {
navigator.getUserMedia('video', successCallback, errorCallback);
}
【讨论】：
这就是所谓的HTML5 Media Capture API。您将找到适用于某些移动浏览器的示例代码 here。
【讨论】：