Zefes
Posts: 6
Joined: Thu Apr 30, 2015 8:36 am
Location: Italy

Control GPIO through HTML page

Thu Apr 30, 2015 8:51 am

What I have right now is 2 python files. One turns pin 7 on, the other turns it off. I can execute them through the terminal like this: "sudo python Pin7_On.py" and "sudo python Pin7_Off.py" .
What I wanted to know is, how do I make a button on an HTML page trigger the command in the terminal, so that when I press the button from a client, the server (raspberry) turns the pin on and off using my Python script via its terminal.
In other words I want to convert "sudo python Pin7_On.py" to a button on a webpage, so that when I click it, it executes the command automatically.

ghans
Posts: 7854
Joined: Mon Dec 12, 2011 8:30 pm
Location: Germany

Re: Control GPIO through HTML page

Thu Apr 30, 2015 9:41 am

• Don't like the board ? Missing features ? Change to the prosilver theme ! You can find it in your settings.
• Don't like to search the forum BEFORE posting 'cos it's useless ? Try googling : yoursearchtermshere site:raspberrypi.org

User avatar
joan
Posts: 13916
Joined: Thu Jul 05, 2012 5:09 pm
Location: UK

Re: Control GPIO through HTML page

Thu Apr 30, 2015 10:19 am

There are much simpler ways than using webiopi.

You can produce a web server in Python from a few lines of script and have the script handle button presses.

I have an example at http://abyz.co.uk/rpi/pigpio/examples.html#Misc_code Easy As Pi Server. If you instantiate the code with port 80 it will act as the default web server (binding with low numbered ports requires that the code is run with sudo).

Zefes
Posts: 6
Joined: Thu Apr 30, 2015 8:36 am
Location: Italy

Re: Control GPIO through HTML page

Thu Apr 30, 2015 5:17 pm

Can someone please write an easier step by step guide. I tried to read both links you sent me but I can't follow. Do I need to write a cgi or something? I already have a page on the Apache directory, do I have to modify it?

User avatar
joan
Posts: 13916
Joined: Thu Jul 05, 2012 5:09 pm
Location: UK

Re: Control GPIO through HTML page

Thu Apr 30, 2015 5:56 pm

Zefes wrote:Can someone please write an easier step by step guide. I tried to read both links you sent me but I can't follow. Do I need to write a cgi or something? I already have a page on the Apache directory, do I have to modify it?
If you are using Apache2 as a web-server on your Pi you could do the following.

1. Enable CGI with the command

sudo a2enmod cgid

2. Copy the following two scripts to /usr/lib/cgi-bin on the Pi

gpio4_on.py

Code: Select all

#!/usr/bin/env python

import pigpio

print("Content-type:text/html\r\n\r\n")

print("<html><head><title>gpio4 on</title></head><body>")

pi=pigpio.pi()
pi.write(4, 1)
pi.stop()

print"</body></html>"
gpio4_off.py

Code: Select all

#!/usr/bin/env python

import pigpio

print("Content-type:text/html\r\n\r\n")

print("<html><head><title>gpio4 on</title></head><body>")

pi=pigpio.pi()
pi.write(4, 0)
pi.stop()

print"</body></html>"
3. Make each script executable

In /usr/lib/cgi-bin

chmod +x gpio4_on.py
chmod +x gpio4_off.py

4. Add the following code to your web-page

Code: Select all

<form action="http://localhost/cgi-bin/gpio4_on.py">
<input type="submit" value="gpio4 On">
</form> 

<form action="http://localhost/cgi-bin/gpio4_off.py">
<input type="submit" value="gpio4 Off">
</form> 
Or if you want a new page just add a page called cgi.html

Code: Select all

<html><body>

<form action="http://localhost/cgi-bin/gpio4_on.py">
<input type="submit" value="gpio4 On">
</form> 

<form action="http://localhost/cgi-bin/gpio4_off.py">
<input type="submit" value="gpio4 Off">
</form> 

</body></html>
5. This example uses my pigpio library and need the pigpio daemon to be running on the Pi.

sudo pigpiod

6. Enter the web-page address in your browser, e.g. localhost/index.html or localhost/cgi.html

You can do similar with any libraries you want to use.

Edited to change hard coded web-server host from paul to localhost.
Last edited by joan on Thu Apr 30, 2015 7:56 pm, edited 1 time in total.

Zefes
Posts: 6
Joined: Thu Apr 30, 2015 8:36 am
Location: Italy

Re: Control GPIO through HTML page

Thu Apr 30, 2015 6:37 pm

I did what you said but when I clink the button on my page it gives me internal server error

User avatar
SteveDee
Posts: 343
Joined: Thu Dec 29, 2011 2:18 pm
Location: Sunny Southern England
Contact: Website

Re: Control GPIO through HTML page

Thu Apr 30, 2015 6:46 pm

Zefes wrote:Can someone please write an easier step by step guide....
If you are struggling to understand all this stuff, you may like to take a look at my notes here: http://captainbodgit.blogspot.co.uk/201 ... h-php.html

I think this may be about the most simple configuration, as it just uses PHP on a server install with wiringPi. The web page relies on HTML Form controls and PHP, all in about 35 lines of text.

I hope this helps.

User avatar
joan
Posts: 13916
Joined: Thu Jul 05, 2012 5:09 pm
Location: UK

Re: Control GPIO through HTML page

Thu Apr 30, 2015 7:02 pm

Zefes wrote:I did what you said but when I clink the button on my page it gives me internal server error
Could be lots of reasons.

Apache2 logs its actions in directory /var/log/apache2. You might as well have a look in /var/log/apache2/error.log and see if you can make sense of what it says.

It will be useful to know the sort of information that is logged if you want to develop your own web pages.

User avatar
joan
Posts: 13916
Joined: Thu Jul 05, 2012 5:09 pm
Location: UK

Re: Control GPIO through HTML page

Thu Apr 30, 2015 7:32 pm

I certainly made a mistake. In the html I gave you I hard coded the name of my web-server Pi as paul. You'd need to change that to the name or IP address of your Pi.

Zefes
Posts: 6
Joined: Thu Apr 30, 2015 8:36 am
Location: Italy

Re: Control GPIO through HTML page

Fri May 01, 2015 11:31 am

I think I have a problem with permissions. I've tried several tutorials but none of them seems to work. Do I have to log in as the user root? Or give permissions to specific folders?

User avatar
joan
Posts: 13916
Joined: Thu Jul 05, 2012 5:09 pm
Location: UK

Re: Control GPIO through HTML page

Fri May 01, 2015 12:05 pm

Zefes wrote:I think I have a problem with permissions. I've tried several tutorials but none of them seems to work. Do I have to log in as the user root? Or give permissions to specific folders?
The most likely problem is you are not following the instructions as closely as you should.

I'm fairly sure that the instructions I gave (with the caveat of the error I declared) are correct.

Zefes
Posts: 6
Joined: Thu Apr 30, 2015 8:36 am
Location: Italy

Re: Control GPIO through HTML page

Fri May 01, 2015 7:16 pm

I tried doing it all again from scratch and it works! YAY!! But is there a way to avoid it redirecting me to another page each time I press the button?

User avatar
joan
Posts: 13916
Joined: Thu Jul 05, 2012 5:09 pm
Location: UK

Re: Control GPIO through HTML page

Fri May 01, 2015 7:32 pm

Zefes wrote:I tried doing it all again from scratch and it works! YAY!! But is there a way to avoid it redirecting me to another page each time I press the button?
All sorts of ways but I'm pretty bad at network stuff so I'm not going to suggest one.

The method to use will depend on the web environment you plan to use (for instance I tend to use PHP/CSS/JavaScript).

I suggest you start a new post and ask for ideas on how to stay on the same page.

Return to “Beginners”