title: Capture Image through Camera in the Website and Store the Path of Image in PGAdmin using Django
body: <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset='utf-8'&gt;
      &lt;meta http-equiv='X-UA-Compatible' content='IE=edge'&gt;
      &lt;title&gt;Capture Image From Camera&lt;/title&gt;
      &lt;meta name='viewport' content='width=device-width, initial-scale=1'&gt;
     &lt;/head&gt;
  &lt;body&gt;
      &lt;video id=&quot;video&quot; width=&quot;100&quot; height=&quot;100&quot; autoplay&gt;&lt;/video&gt;
  &lt;button id=&quot;snap&quot;&gt;Snap Photo&lt;/button&gt;
  &lt;canvas id=&quot;canvas&quot; width=&quot;100&quot; height=&quot;100&quot;&gt;&lt;/canvas&gt;
  &lt;/body&gt;
  &lt;script&gt;
  // Grab elements, create settings, etc.
  var video = document.getElementById('video');
  
  // Get access to the camera!
  if (navigator.mediaDevices &amp;&amp; navigator.mediaDevices.getUserMedia) {
      navigator.mediaDevices.getUserMedia({
          video: true
      }).then(function(stream) {
          //video.src = window.URL.createObjectURL(stream);
          video.srcObject = stream;
          video.play();
      });
  }
   
  // Elements for taking the snapshot
  var canvas = document.getElementById('canvas');
  var context = canvas.getContext('2d');
  var video = document.getElementById('video');
  
  // Trigger photo take
  document.getElementById(&quot;snap&quot;).addEventListener(&quot;click&quot;, function() {
      context.drawImage(video, 0, 0, 100, 100);
  });
  
  &lt;/script&gt;
  &lt;/html&gt;
  </code></pre>
  <p>'''I have used this code to add a button which will open camera to take a snap.I have to store the path of the image in Pg-admin using Django.I am not able to do this.Please Help Me...'''</p>