Home/ Questions/Q 8551981
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-11T14:19:10+00:00

I’m trying to get a webcamera stream working on my page, and I want

  • 0

I’m trying to get a webcamera stream working on my page, and I want to do it using WebKitGetUserMedia. I’ve googled alot and it feels like i’ve tried all examples out there but noone works for me. I’m obviously doing something wrong but I have no idea what.

So my question is, what do I have to do in order to get WebKitGetUserMedia working in chrome? I’m using Chrome v21. If someone have some complete html, js code example I’d be really happy to see it!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Please elaborate on your point and as to what exactly, is the problem, what error is encountered, so that one can pin point your mistake easily.

    Though, I would suggest you an excellent read on Capturing Audio and Video from HTML5, http://www.html5rocks.com/en/tutorials/getusermedia/intro/.

    Though, after following this article, I came across a bug, which does not allow one to load resource from localhost or one’s machine on Google Chrome(which might also be the case with you) and which gets resolved once you host your HTML page on the net(try using Dropbox to upload your file publicly for free or get hosting for yourself).

    Here’s the code that you can refer to start with:

    <html>
  <head>
    <title>HTML5 Webcam Test</title> 
    <style type="text/css">
      body{
        max-width: 300px;
        max-height: 300px;
      }
      #live_video{
        top: 0px;
        height: 100%;
        width: 100%;
        left: 0px;
      }
    </style>
  </head>
  <body>
    <video id="live_video" autoplay controls></video>
    <script type="text/javascript">
      video = document.getElementById("live_video");
      navigator.webkitGetUserMedia({video:true, audio:true},
          function(stream) {
            video.src = window.webkitURL.createObjectURL(stream);
          }
      );
    </script>
  </body>
</html>
    • 0