Html 如何通过javascript访问网络摄像头
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15417036/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to access the webcam by javascript
提问by Leonardo Lacerda
I need to open the webcam via JavaScript
I know it is possible to access the html5 by <video>
but need access webcam with pure JavaScript
我需要通过 JavaScript 打开网络摄像头 我知道可以通过以下方式访问 html5,<video>
但需要使用纯 JavaScript 访问网络摄像头
Can someone help me or give me some ideas?
有人可以帮助我或给我一些想法吗?
I need only access the webcam with JavaScript and sorry for my English, I'm using Google translator.
我只需要使用 JavaScript 访问网络摄像头,抱歉我的英语,我正在使用 Google 翻译器。
I can't use tag '< video >'
我不能使用标签“<视频>”
回答by jAndy
As I stated as comment, I'm confused about your wording. You said, you know that "HTML5" can access the webcam, but you need it by pure Javascript.
正如我在评论中所说的那样,我对您的措辞感到困惑。您说,您知道“HTML5”可以访问网络摄像头,但是您需要通过纯 Javascript 来访问它。
Well, in case you don't know, HTML5introduced the such called WebRTCwhich is short for Real-Time Communications. Part of that, a new thing called navigator.getUserMedia()navigator.mediaDevices.getUserMedia(constraints)
was introduced as well. That is, an ECMAscript object, which allows you to get access to the users machine WebCamand Microphonedevices.
好吧,如果您不知道,HTML5引入了所谓的WebRTC,它是Real-Time Communications 的缩写。其中,还引入了一个名为navigator.getUserMedia()的新事物navigator.mediaDevices.getUserMedia(constraints)
。也就是说,一个 ECMAscript 对象,它允许您访问用户机器的网络摄像头和麦克风设备。
As you can see, the whole show is embedded in the HTML5rollout / spec, so we cannot really separate the Javascript from the HTML5 here.
如您所见,整个节目都嵌入在HTML5rollout/spec 中,因此我们无法真正将 Javascript 与 HTML5 分开。
Further reading:
进一步阅读:
回答by Luke Cummings
Here is a js library that uses flash only in a HTML5 fallback situation:
这是一个仅在 HTML5 回退情况下使用 flash 的 js 库:
https://github.com/jhuckaby/webcamjs
https://github.com/jhuckaby/webcamjs
From the code samples:
从代码示例:
<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>
回答by Denys Séguret
There's this great tutorial from HTML5rocks.
Basically, getUserMedialets the browsers ask for the permission and then lets you use the camera.
基本上,getUserMedia让浏览器请求许可,然后让您使用相机。
You must be aware that it's still badly supported and that the API might change again, especially if you want to send those streams over internet.
您必须意识到它仍然受到严重支持,并且 API 可能会再次更改,特别是如果您想通过 Internet 发送这些流。
回答by o2bjang
There are a few javascript libraries for doing this now.
现在有一些 javascript 库可以做到这一点。
- Script Cam: http://www.scriptcam.com/
- jQuery Webcam: http://www.xarg.org/project/jquery-webcam-plugin/
- 脚本凸轮:http: //www.scriptcam.com/
- jQuery 网络摄像头:http: //www.xarg.org/project/jquery-webcam-plugin/