I spent the week tinkering with a Raspberry Pi Camera and exploring ways to get it to stream images to a web browser. In this article, we'll explore the simplest and most effective way I found to stream images into client side JavaScript. In the end, we'll stream those images into the Virtual Reality viewer built in my earlier article on Filtering Reality with JavaScript and Google Cardboard.
What You'll Need
For this demo, you'll currently need a Raspberry Pi (I used the Raspberry Pi 2 Model B) with Raspbian installed (NOOBS has you covered here), an Internet connection for it (I recommend getting a Wi-Fi adaptor so your Pi can be relatively portable) and a Camera module.
If your Pi is brand new and not currently set up, follow the instructions on the Raspberry Pi NOOBS setup page to get your Pi ready to go.
If you've got a bunch of stuff on your Pi already, please make sure you back everything up as the installation process replaces various files. Hopefully everything should play nicely but it's always important to be on the safe side!
The Code
Our demo code that uses the camera data is accessible on GitHub for those eager to download and have a go.
Attaching Your Pi Camera
If you are new to the Raspberry Pi and attaching a camera, I'll cover it quickly here. Basically, there is a plastic container (called the flex cable connector) around the opening which you'll want to gently open. To do so, pull the tabs on the top of the connector upwards and towards the Ethernet port. Once you've got it loosened, you'll be able to slot in your camera's flex cable. The cable has a blue strip on it on one side, connect it so that side is facing the ethernet port. Be careful to keep the cable straight (don't place it into the slot at an angle, it should fit straight in). Here's a photo of my camera flex cable connected correctly to show what we're looking for here:
RPi Cam Web Interface
The easiest way I've found to stream images from the Pi camera was to use the RPi Cam Web Interface. You run a few basic terminal commands to install it and then it sets up your camera on an Apache server ready to use.
If you've installed Raspbian from scratch already, you may have also already enabled the camera in the config screen that appeared afterwards. If not, you can get to it by typing in the following command:
[bash]sudo raspi-config[/bash]
On that screen, you'll be able to select "Enable Camera", click that option and and choose "Enable" from the screen that appears.
Next up, make sure your Raspberry Pi is up to date (before doing this, I want to reiterate - back things up to be safe). We start by downloading the latest repository package lists:
[bash]sudo apt-get update[/bash]
We then make any updates to existing repositories on our Pi that we might have found:
[bash]sudo apt-get dist-upgrade[/bash]
Finally, we update our Raspberry Pi software itself too:
[bash]sudo rpi-update[/bash]
Then, we install the RPi Cam Web Interface itself from its GitHub repo. Go to the location on your Pi that you'd like to clone the repo to and run the git clone command:
[bash]git clone http://ift.tt/1RuxXWz]
This will create a RPi_Cam_Web_Interface folder ready with a bash installer. Firstly, go to that directory:
[bash]cd RPi_Cam_Web_Interface[/bash]
Update the permissions on the bash file so you can run it:
[bash]chmod u+x RPi_Cam_Web_Interface_Installer.sh[/bash]
Then run the bash install program:
[bash]./RPi_Cam_Web_Interface_Installer.sh install[/bash]
The install program has slightly more of a visual interface. I personally installed it via the Apache server option (the first option), so the following will all focus on that method. If you prefer to use an Nginx server, you can. I'd imagine much of the process is relatively similar though.
You'll then specify where you'd like to place the RPi Cam Web Interface on your server's /var/www directory. If you don't list anything, it will install in the root /var/www folder. I installed it in a folder called picam to keep it separate.
On the next screen, I selected "yes" to whether I wanted the camera to auto start on boot time.
Continue reading %Streaming a Raspberry Pi Camera Into VR With JavaScript%
by Patrick Catanzariti via SitePoint
No comments:
Post a Comment