开发者

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="&#x1F4F7;" 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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜