How do I access navigator.getUserMedia()?
I am currently running Chrome 11 and trying to access getUserMedia
for H开发者_如何转开发TML5 native audio and video stream support but I am getting an error saying that navigator.getUserMedia
is undefined. If it's not supported, how do I access it or do I need to wait until Chrome incorporates it?
This is the the code I was using to test getUserMedia
which I found
<h1>Snapshot Kiosk</h1>
<section id="splash">
<p id="errorMessage">Loading...</p>
</section>
<section id="app" hidden>
<p><video id="monitor" autoplay></video> <canvas id="photo"></canvas>
<p><input type=button value="📷" onclick="snapshot()">
</section>
<script>
navigator.getUserMedia('video user', gotStream, noStream);
var video = document.getElementById('monitor');
var canvas = document.getElementById('photo');
function gotStream(stream) {
video.src = URL.getObjectURL(stream);
video.onerror = function () {
stream.stop();
noStream();
}
video.onloadedmetadata = function () {
canvas.width = video.videoWidth;
canvas.height = video.videoHeight;
document.getElementById('splash').hidden = true;
document.getElementById('app').hidden = false;
}
}
function noStream() {
document.getElementById('errorMessage').textContent = 'No camera available.';
}
function snapshot() {
canvas.getContext('2d').drawImage(video, 0, 0);
}
</script>
The latest opera desktop build has support for getUserMedia() See here: http://labs.opera.com/news/2011/10/19/
It's just a waiting game for other browsers to implement this. Now that opera has support, the other should soon follow.
Since last night (3 May 2012) getUserMedia() in Chrome Canary takes an object not a string.
To try it out, you can run the following code from the console on any page (like this one) with a video element:
navigator.webkitGetUserMedia(
{"video": true, "audio": true},
function(s){
document.querySelector('video').src =
window.webkitURL.createObjectURL(s);
},
function(e){console.log(e);}
);
I think there is a stub method in the latest chrome dev (12.0.742.16 dev) but i can't get it to do anything on Mac OSX. At least I thought I saw it. I just checked and the method doesn't seem to be there anymore. Here is the webkit bug report for implementing getUserMedia: https://bugs.webkit.org/show_bug.cgi?id=56586
I think the only working implementation at the moment is in Opera for Android. http://my.opera.com/core/blog/2011/03/23/webcam-orientation-preview
The chrome/webkit method is webkitGetUserMedia but it isn't implemented yet.
Chrome Dev Channel JUST added WebRTC support, so NOW what you're asking here actually becomes plausible. See: https://groups.google.com/forum/#!topic/discuss-webrtc/LuY7zYLA8sA
Basically, you must use the webkit prefixe: webkitGetUserMedia() although documentation on this method is scarce, I'm currently trying to piece together a working demo of it.
精彩评论