reprage
A photo of a Raspberry Pi NOIR camera module, v1.3 attached to a Raspberry Pi V3.

First run raspi-config and enable the Pi to work with the camera module:

	$ sudo raspi-config

Select ‘5 - Interfacing Options’ and then ‘P1 Camera’. Enable the camera by highlighting ‘’ and pressing enter.

No enable a module option to improve the camera modules picture quality.

	$ echo 'options bcm2835-v4l2 gst_v4l2src_is_broken=1' | sudo tee -a /etc/modprobe.d/bcm2835-v4l2.conf
	$ echo 'bcm2835-v4l2' | sudo tee -a /etc/modules-load.d/modules.conf

Reboot, and your Raspbery Pi Camera will be available within the browser:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>ASCII Mirror</title>
  <style>body {margin: 0;}</style>
</head>
<body>
  <video id="player" autoplay="true"></video>
  <script>
    "use strict";

    (function(){
      // Canvas and video HTML elements.
      var eVideo = document.querySelector("#player");

      // Work out the dimensions of our canvas.
      var iVideoWidth = 640;
      var iVideoHeight = 480;

      var oVideoOptions = {
        mandatory: {
          maxWidth: iVideoWidth,
          maxHeight: iVideoHeight
        },
        optional: []
      };

      var oMediaOptions = { audio: false, video: oVideoOptions};

      if (!navigator.getUserMedia) {
          navigator.getUserMedia = navigator.getUserMedia ||
                                   navigator.webkitGetUserMedia ||
                                   navigator.mozGetUserMedia ||
                                   navigator.msGetUserMedia;
      }

      if (!navigator.getUserMedia){
        return alert('getUserMedia not supported in this browser.');
      }

      navigator.getUserMedia(oMediaOptions, success, function(e) {
        console.log(e);
      });

      function success(stream){
        eVideo.src = window.URL.createObjectURL(stream);
        setTimeout(function(){window.location.reload(true)}, 300000);
      }
    })();
  </script>
</body>
</html>

Comments:

You can join the conversation on Twitter or Instagram

Become a Patreon to get early and behind-the-scenes access along with email notifications for each new post.