Introduction: HTML to Python

I thought I would make this instructable on how to make a html webpage communicate with a python script because there is no where else on how to do it, So I made my own.

Step 1: Things You Will Need

You will only need one thing in this instructable.

  • A computer with a web server running on it or a Raspberry Pi (I will be using a Raspberry Pi)

Step 2: Raspberry Pi Software

Install Python

sudo apt-get install python

INSTALL APACHE

First install the apache2 package by typing the following command in to the Terminal:

sudo apt-get install apache2 -y

TEST THE WEB SERVER

By default, Apache puts a test HTML file in the web folder. This default web page is served when you browse to http://localhost/ on the Pi itself, or http://localhost/ (whatever the Pi's IP address is) from another computer on the network. To find the Pi's IP address, type hostname -I at the command line (or read more about finding your IP address). Browse to the default web page either on the Pi or from another computer on the network and you should see the web page like the one above. This means you have Apache working!

Change Permissions

This default web page is just a HTML file on the filesystem. It is located at /var/www/index.html. navigate to this directory in the Terminal and have a look at what's inside:

cd /var/www
ls

You should see the file index.html.

Now lets change the permissions:

cd /var
sudo chown pi: www

This will make everything in the www folder usable by the pi user (or whatever username you are using).

INSTALL PHP

To allow your Apache server to process PHP files, you'll need to install PHP5 and the PHP5 module for Apache. Type the following command to install these:

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

Now we are finished installing all the software. Now for the fun part :)

Step 3: The Code

Ok, Now remove the file index.html and make a file in the /var/www directory and call it index.php.

In it we will put in this:

<html>
	<head>
	</head>

	<body>
		
		<iframe name="hidden_iframe" width="0" height="0" style="border:none"></iframe>
		<form method="post" action="out.php" target="hidden_iframe">
			
	        <input type="submit" name="foo" value="A" />
			<input type="submit" name="foo" value="B" />
			<input type="submit" name="foo" value="C" />
			<input type="submit" name="foo" value="D" />
			<input type="submit" name="foo" value="E" />
			<input type="submit" name="foo" value="F" />
			<input type="submit" name="foo" value="G" />
		
		</form>
		
		<?php
		$name = $_POST['foo'];
		$fp = fopen("formdata.txt", "w");
		fwrite($fp, "");
		$savestring = $name;
		fwrite($fp, $savestring);
		fclose($fp);
		?>
		
	</body>
</html>

Ok, Now open up you browser and head to http://localhost/ or http://localhost/ and you should see 6 buttons.

Now make a python script in the same directory called htmlread.py and put this in it:

from time import sleep

def read():
	inlist = ['A','B','C','D','E','F','G']
	while True:
		file=open("formdata.txt","r")
		data = file.read()
		for i in range(len(inlist)):
			if data == inlist[i]:
				print(data)
				file=open("formdata.txt","w")
				file.write("")
		file.close()
		sleep(0.01)
		
		
read()

Now run the python script and head to http://localhost/ or http://localhost/ and start pressing buttons you should see the input on the python script.

You can also make it control the Raspberry Pi GPIO and a bunch of other stuff too.