如何通过javascript访问网络摄像头[关闭]答案

【问题标题】：How to access the webcam by javascript [closed]如何通过javascript访问网络摄像头[关闭]
【发布时间】：2013-03-03 06:14:51
【问题描述】：

我需要通过 JavaScript 打开网络摄像头我知道<video> 可以访问 html5，但需要使用纯 JavaScript 访问网络摄像头

有人可以帮助我或给我一些想法吗？

我只需要使用 JavaScript 访问网络摄像头，对不起我的英语，我正在使用谷歌翻译。

我不能使用标签“”

【问题讨论】：

您是否需要通过 javascript 或其他方式访问网络摄像头？
html5rocks.com/en/tutorials/getusermedia/intro
支持这个可选的 HTML5 模块是not universal
stackoverflow.com/a/12680547/638127
请参阅webrtc.org 了解更多信息。尝试一下，一旦你有一些不起作用的东西就回来

标签： javascript html webcam

【解决方案1】：

正如我在评论中所说，我对你的措辞感到困惑。您说，您知道“HTML5”可以访问网络摄像头，但您需要纯Javascript。

好吧，如果你不知道，HTML5 引入了 WebRTC，它是 Real-Time Communications 的缩写。其中，还引入了一个名为 ~~navigator.getUserMedia()~~ navigator.mediaDevices.getUserMedia(constraints) 的新东西。也就是说，一个 ECMAscript 对象，它允许您访问用户机器 WebCam 和 Microphone 设备。

如您所见，整个节目嵌入在 HTML5 发布/规范中，因此我们无法在此处真正将 Javascript 与 HTML5 分开。

进一步阅读：

【讨论】：

谢谢你，完美！

【解决方案2】：

这是一个仅在 HTML5 后备情况下使用 flash 的 js 库：

https://github.com/jhuckaby/webcamjs

来自代码示例：

<script src="webcam.js"></script>

<div id="my_camera" style="width:320px; height:240px;"></div>
<div id="my_result"></div>

<script language="JavaScript">
    Webcam.attach( '#my_camera' );

    function take_snapshot() {
        Webcam.snap( function(data_uri) {
            document.getElementById('my_result').innerHTML = '<img src="'+data_uri+'"/>';
        } );
    }
</script>

<a href="javascript:void(take_snapshot())">Take Snapshot</a>

【讨论】：

如此简单！（+1）。
但是不允许在服务器中使用带有http的摄像头
它给出了这个错误“Webcam.js 错误：找不到要附加的 DOM 元素。”任何进一步的解决方案？ @JoseManuelAbarcaRodríguez
@SudhirDehade，¿您是否添加了两个 <div>s“my_camera”和“my_result”？
@JoseManuelAbarcaRodríguez 是的。 stackoverflow.com/questions/58910224/…请查看此链接

【解决方案3】：

有this great tutorial from HTML5rocks。

基本上，getUserMedia 让浏览器请求权限，然后让您使用相机。

您必须意识到它仍然受到严重支持，并且 API 可能会再次更改，特别是如果您想通过 Internet 发送这些流。

【讨论】：

【解决方案4】：

现在有一些 JavaScript 库可以做到这一点。

~~脚本凸轮：http://www.scriptcam.com/~~（已死）
jQuery 网络摄像头：http://www.xarg.org/project/jquery-webcam-plugin/

【讨论】：

它们不是基于 HTML5 的。他们都需要 Flash。
@dystroy 是这样吗？ OP 没有指定答案应该只包括基于 HTML5 的解决方案。他有 HTML5 标记，但他的问题文本根本没有提到它是一项要求。
我正在精确地从简短的答案中看出一些可能并不明显的东西，我并不是说答案很糟糕。话虽这么说，即使问题远未明确，我也阅读了“访问 html5 但需要访问网络摄像头以 pure javascript”。