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
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.
I can't use tag '< video >'
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.
Well, in case you don't know, HTML5 introduced the such called WebRTC which 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 WebCam and Microphone devices.
As you can see, the whole show is embedded in the HTML5 rollout / spec, so we cannot really separate the Javascript from the HTML5 here.
Further reading:
- https://developer.mozilla.org/en-US/docs/WebRTC
https://developer.mozilla.org/en-US/docs/WebRTC/navigator.getUserMedia
- https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
Here is a js library that uses flash only in a HTML5 fallback situation:
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>
There's this great tutorial from HTML5rocks.
Basically, getUserMedia lets the browsers ask for the permission and then lets you use the camera.
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.
There are a few javascript libraries for doing this now.
- Script Cam: http://www.scriptcam.com/
- jQuery Webcam: http://www.xarg.org/project/jquery-webcam-plugin/