title: HTML5: camera access
body: <p>I am quite new to <code>HTML5</code>. I try the following <code>HTML5</code> code to access camera on my mobile phone. It always display <em>"Native web camera not supported"</em>. It seems that my mobile browser (safari and android 2.1 web browser) does not support the camera. </p>
  
  <p>Could you please tell me which browser should I use to access to camera? </p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta name="viewport" content="width=device-width, maximum-scale=1.0"&gt;
      &lt;style&gt;
          body {width: 100%;}
          canvas {display: none;}
      &lt;/style&gt;
      &lt;script&gt;
          var video, canvas, msg;
          var load = function () {
              video  = document.getElementById('video');
              canvas = document.getElementById('canvas');
              msg    = document.getElementById('error');
              if( navigator.getUserMedia ) {
                  video.onclick = function () {
                      var context = canvas.getContext("2d");
                      context.drawImage(video, 0, 0, 240, 320);
                      var image = {"demo" : {
                          "type"  : "device",
                          "image" : canvas.toDataURL("image/png")
                      }};
                  };
  
                  var success = function ( stream ) {
                      video.src = stream;
                  };
  
                  var error = function ( err ) {
                      msg.innerHTML = "Error: " + err.code;
                  };
  
                  navigator.getUserMedia('video', success, error);
  
              } else {
                  msg.innerHTML = "Native web camera not supported :(";
              }
  
          };
  
          window.addEventListener('DOMContentLoaded', load, false);
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;video  id="video" width="240" height="320" autoplay&gt; &lt;/video&gt;
      &lt;p      id="error"&gt;Click on the video to send a snapshot to the receiving screen&lt;/p&gt;
      &lt;canvas id="canvas" width="240" height="320"&gt; &lt;/canvas&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>