Raspberry Pi Web GPIO With Live Streaming

About: We are a team of IoT & Embedded Systems developers. We are working in Raspberry Pi and Arduino.

Intro: Raspberry Pi Web GPIO With Live Streaming

In this project I'm going to tell you about how we can get the gpio pin Button and live streaming from our raspberry pi camera in a single web page so we can control our appliances from anywhere by simply clicking the button on a web page. And also we can able to see that in our live steaming.

Step 1: Software Used

a) Raspbian OS: This is the recommended os for raspberry pi. You can also installed other OS from third party. Raspbian OS is debian based OS. We can install it from noobs installer. you can Download here

b) Python idle: This is the software we get in raspbian os. For this project we have used python script.

c) Putty: we are using putty for remote access of Raspberry Pi.you can Download here

d) Win32DiskImager: This software is used to burn Raspbian Os on SD Card. you can Download here

e) SDFormatter: This software is used to format memory card. you can Download here

Step 2: Hardware Used

1) Raspberry Pi

2) Raspberry Pi Camera

3) Power Supply

Raspberry Pi: This is the latest version of raspberry pi. In this we have inbuilt Bluetooth and wi-fi, unlike previously we have to use Wi-Fi dongle in one of its usb port. There are total 40 pins in RPI3. Of the 40 pins, 26 are GPIO pins and the others are power or ground pins (plus two ID EEPROM pins.) There are 4 USB Port and 1 Ethernet slot, one HDMI port, 1 audio output port and 1 micro usb port and also many other things you can see the diagram on right side. And also we have one micro sd card slot wherein we have to installed the recommended Operating system on micro sd card. There are two ways to interact with your raspberry pi. Either you can interact directly through HDMI port by connecting HDMI to VGA cable, and keyboard and mouse or else you can interact from any system through SSH.

2. Raspberry Pi Camera: The Raspberry Pi camera module can be used to take high-definition video, as well as stills photographs. It’s easy to use for beginners, but has plenty to offer advanced users if you’re looking to expand your knowledge. There are lots of examples online of people using it for time-lapse, slow-motion and other video cleverness. You can also use the libraries we bundle with the camera to create effects.

Step 3: Working Principle

First you need to update and upgrade your raspberry pi in latest version

So for that you need to run these two commands in your raspberry pi Linux terminal

sudo apt-get update
sudo apt-get upgrade

Now you will have to install apache and php on your system

So for that run these commands below

sudo apt-get install apache2 -y
sudo apt-get install php5 libapache2-mod-php5 -y

After successful installation of all these things now you need to clone one repository in your terminal and that repository is WiringPi

So install that by giving these commands

git clone https://github.com/WiringPi/WiringPi

cd WiringPi


Now for getting the live streaming from your pi camera you need to clone one repository from github

git clone https://github.com/DeligenceTechnologies/Raspberr...

Now after cloning this just give these commands

cd Raspberry-pi-based-HD-surveillance-camera/
chmod u+x RPi_Cam_Web_Interface_Installer.sh


So when you will successfully execute these commands. go to any browser and type the IP of your raspberry pi and hit enter you can able to see the live streaming of your raspberry pi

Here you go now you need to clone one more repository to get the GPIO pin button of your raspberry pi in that page along with live streaming

So here is the command

git clone https://github.com/DeligenceTechnologies/RPi-web-...

Now copy the content of this repository on the same location where your camera streaming files are there i.e. /var/www/html

sudo cp -R RPi-web-gpio-with-live-streaming/* /var/www/html

After that go to your browser and type IP of your pi

so you will get the web page where on the left you will get the GPIO Buttons and on the right you can able to see the live streaming as you can see in the above image

Step 4: Video

Here you can see the video of the project

Congratulations you have successfully finished your project
If you have any doubt regarding this project feel free to comment us below or you can mail us on info@deligence.com. And if you want to learn more about these type of project then feel free to visit our youtube channel

Thanks & Regards,

Deligence Technologies



    • Optics Contest

      Optics Contest
    • Audio Contest 2018

      Audio Contest 2018
    • Plastics Contest

      Plastics Contest