J’arrive à la fin !
Plus qu’à créer une interface web pour contrôler ma PiCar
Pour contrôler la PiCar à partir d’une page web j’ai découvert le projet WebIOPi qui est spécialement conçu pour contrôler les ports GPIO du raspberry Pi grâce à python / javascript / html
Mise à jour 2018 : Webiopi a était arrêté en 2015 pour faire un dérivé commercial. Heuresement quelqu’un à reprit le projet et continue de le maintenir. On peut donc encore l’utiliser en 2018 et avec Debian Stretch. Merci à Thortex
Installation de WebIOPi
#On clone le dépot git
git clone https://github.com/thortex/rpi3-webiopi.git
cd rpi3-webiopi
#Ensuite on se déplace dans le répertoire dev pour installer les prérequis
cd dev
./01_setup-required-packages.sh
./03_install_python_dev.sh
./10_make_deb.sh
#Une fois les paquets crées on peut passez à l'installation
sudo dpkg -i ~/build.webiopi/python2-webiopi*.deb
sudo webiopi-select-python 2
sudo systemctl daemon-reload
sudo systemctl restart webiopi
Découverte de WebIOPi
Une fois installé, on peut tester les possibilités via la page d’exemple :
pi@raspberrypi ~ $ sudo webiopi
On se rend sur l’adresse IP du Pi : http://ADD.IP.DU.PI:8000
Le login et mot de passe par défaut sont : webiopi / raspberry
Rendez vous dans « GPIO Header »
- Un clique sur OUT/IN permet de paramétrer un GPIO en mode entrée ou sortie
- Un clique sur le GPIO permet de changer l’état ( 0 ou 1 )
Essayons donc de faire tourner un moteur comme ça, c’est assez simple.
Créer le projet PiCar avec WebIOPi
Créer 2 répertoires, un pour le code python et un autre pour les pages web dans le dossier picar ( /home/pi/picar ) :
>pi@raspberrypi ~ $ mkdir html python
Dans le répertoire python, créer un fichier web.py
Je ne détaillerais pas le code, mes commentaires parlent d’eux mêmes
#!/usr/bin/env python
#coding=utf-8
# Ce programme permet de contrôler la voiture robot grasse à WebIOPi à travers une page web
# GeoHolz : https://blog.jolos.fr
#Déclaration
from time import sleep
import webiopi
import RPi.GPIO as GPIO
from select import select
import serial
import ossaudiodev
import wave
from threading import Thread
#Déclaration des GPIOs
#Moteur A Gauche
EnA = 4
Out1 = 17
Out2 = 22
#Moteur B Droite
EnB = 18
Out3 = 23
Out4 = 27
#Il existe 2 mode pour déclarer les GPIO, soit GPIO.BOARD soit GPIO.BCM
GPIO.setmode(GPIO.BCM)
@webiopi.macro
def Forward():
GPIO.output(Out1,True)
GPIO.output(Out3,True)
GPIO.output(Out2,False)
GPIO.output(Out4,False)
GPIO.output(EnA,True)
GPIO.output(EnB,True)
@webiopi.macro
def Stop():
GPIO.output(Out1,False)
GPIO.output(Out3,False)
GPIO.output(Out2,False)
GPIO.output(Out4,False)
GPIO.output(EnA,True)
GPIO.output(EnB,True)
@webiopi.macro
def Standby():
GPIO.output(Out1,False)
GPIO.output(Out3,False)
GPIO.output(Out2,False)
GPIO.output(Out4,False)
GPIO.output(EnA,False)
GPIO.output(EnB,False)
@webiopi.macro
def Reverse():
GPIO.output(Out2,True)
GPIO.output(Out4,True)
GPIO.output(Out1,False)
GPIO.output(Out3,False)
GPIO.output(EnA,True)
GPIO.output(EnB,True)
@webiopi.macro
def TurnRight():
GPIO.output(Out1,True)
GPIO.output(Out3,False)
GPIO.output(Out2,False)
GPIO.output(Out4,True)
GPIO.output(EnA,True)
GPIO.output(EnB,True)
@webiopi.macro
def TurnLeft():
GPIO.output(Out1,False)
GPIO.output(Out3,True)
GPIO.output(Out2,True)
GPIO.output(Out4,False)
GPIO.output(EnA,True)
GPIO.output(EnB,True)
# Called by WebIOPi at script loading
def setup():
# Setup GPIOs
GPIO.setup(EnA, GPIO.OUT)
GPIO.setup(EnB, GPIO.OUT)
GPIO.setup(Out1, GPIO.OUT)
GPIO.setup(Out2, GPIO.OUT)
GPIO.setup(Out3, GPIO.OUT)
GPIO.setup(Out4, GPIO.OUT)
# Called by WebIOPi at server shutdown
def destroy():
# Reset GPIO functions
GPIO.cleanup()
Puis dans le répertoire html, créer un fichier index.html :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content = "height = device-height, width = 420, user-scalable = no" />
<title>PiCar</title>
<script type="text/javascript" src="/webiopi.js"></script>
<script type="text/javascript">
function init() {
}
function Stop() {
webiopi().callMacro("Stop");
}
function Forward() {
webiopi().callMacro("Forward");
}
function Reverse() {
webiopi().callMacro("Reverse");
}
function TurnLeft() {
webiopi().callMacro("TurnLeft");
}
function TurnRight() {
webiopi().callMacro("TurnRight");
}
webiopi().ready(init);
</script>
<style type="text/css">
button.small {
margin: 1px 1px 1px 1px;
width: 24px;
height: 24px;
font-size: 12pt;
font-weight: bold;
color: black;
}
button {
margin: 1px 1px 1px 1px;
width: 90px;
height: 24px;
font-size: 12pt;
font-weight: bold;
color: black;
}
</style>
</head>
<body>
<div id="content" align="center">
<img width="800" height="450" src="http://192.168.0.1:9000/?action=stream"><br/>
<table width="800" border=2>
<tr height="10px" margin=0><center><td><center> Moteur</center></td></tr>
<tr><td>
<center>
<table>
<tr><td colspan=3 align="center"><button class="long" type="button" onmousedown="Reverse()" onmouseup="Stop()">Avancer</button></td></tr>
<tr><td><button type="button" onmousedown="TurnRight()" onmouseup="Stop()">Gauche</button></td>
<td><button type="button" onclick="Stop()">Stop</button></td>
<td><button type="button" onmousedown="TurnLeft()" onmouseup="Stop()">Droite</button></td></tr>
<tr><td colspan=3 align="center"><button type="button" onmousedown="Forward()" onmouseup="Stop()">Reculer</button></td></tr>
</table>
</center>
</td>
</table>
</div>
</body>
</html>
Puis éditer le fichier /etc/webiopi/config pour configurer notre projet
- Localiser la section [SCRIPTS], et ajouter la ligne pour charger notre script python
...
[SCRIPTS]
myscript = /home/pi/picar/python/web.py
...
- Localiser la section [HTTP], et ajouter la ligne pour dire à WebIOPi ou trouver les pages webs
...
[HTTP]
doc-root = /home/pi/picar/html
...
Et voila !
Pour tester, il faut d’abord lancer le stream de la caméra ( via le script Live par exemple )
Puis le serveur WebIOPi avec :
pi@raspberrypi ~ $ sudo webiopi -c /etc/webiopi/config
Rendez vous maintenant sur http://ADD:IP:DU:PI:9000
WebRobot
Sur tablette ou smartphone, les fonctions html onmouseup et onmousedown ne fonctionne pas.
Supprimer les et utiliser plutôt le bouton Stop
tu as une erreur :
tar xvzf WebIOPi-x.y.z.tar.gz
c’est xzvf !!!
On peut même enlever le z en mode décompression 🙂
Merci 🙂
Il faut créer les deux sous répertoires python et html dans /home/pi ou
alors dans /home comme tu l’indiques au début du tuto ???
Dans ton code, ça pointe vers /home/pi non ?
Je viens de terminer l’installation et chez moi ça ne fonctionne pas.
Je tourne sous wheezy 2014-12-24 et j’ai suivi ton tuto d’installation à la lettre.
(je debute sous raspberry/python et ça ne doit pas être grand chose mais je suis bloqué)
(mon
serveur webiopi fonctionne parfaitemement et il est paramétré pour
démarrer au démarage du raspberry. Je l’ai donc stoppé avec un « sudo
/etc/init.d/webiopi stop » avant de lancer la commande ci dessous)
>>> pi@raspberrypi ~ $ sudo webiopi -c /etc/webiopi/config
J’obtiens cette erreur au lancement:
2015-01-16 09:38:43 – WebIOPi – INFO – Starting WebIOPi/0.6.0/Python3.2
2015-01-16 09:38:43 – WebIOPi – INFO – GPIO – Native mapped to REST API /GPIO
2015-01-16 09:38:43 – WebIOPi – INFO – Loading configuration from /etc/webiopi/config
2015-01-16 09:38:43 – WebIOPi – INFO – Loading myproject from /home/pi/PiCar/python/WebPiCar.py
2015-01-16 09:38:43 – WebIOPi – ERROR – [Errno 2] No such file or directory
Traceback (most recent call last):
File
« /usr/local/lib/python3.2/dist-packages/WebIOPi-0.6.0-py3.2-linux-armv6l.egg/webiopi/__main__.py »,
line 73, in
main(sys.argv)
File « /usr/local/lib/python3.2/dist-packages/WebIOPi-0.6.0-py3.2-linux-armv6l.egg/webiopi/__main__.py », line 67, in main
server = Server(port=port, configfile=configfile)
File « /usr/local/lib/python3.2/dist-packages/WebIOPi-0.6.0-py3.2-linux-armv6l.egg/webiopi/server.py », line 86, in __init__
loadScript(name, source, self.restHandler)
File « /usr/local/lib/python3.2/dist-packages/WebIOPi-0.6.0-py3.2-linux-armv6l.egg/webiopi/utils.py », line 164, in loadScript
script = imp.load_source(name, source)
IOError: [Errno 2] No such file or directory
Python 3.2 est pourtant apparemment bien installé, je ne sais pas d’où vient cette erreur.
Un peu d’aide sera la bienvenue.
Pascalou
J’ai suivi le tuto mais au lancement j’obtiens la page habituelle de webiopi sur mon navigateur web.
On dirait que le fichier de config n’est pas pris en compte…
Quand je le stoppe par ctrl-c j’ai pas mal de trucs dans le terminal:
pi@raspberrypi ~/PiCar/python $ sudo webiopi -c /etc/webiopi/config
2015-01-16 10:22:32 – WebIOPi – INFO – Starting WebIOPi/0.6.0/Python3.2
2015-01-16 10:22:32 – WebIOPi – INFO – GPIO – Native mapped to REST API /GPIO
2015-01-16 10:22:32 – WebIOPi – INFO – Loading configuration from /etc/webiopi/config
2015-01-16 10:22:32 – WebIOPi – INFO – Loading myproject from /home/pi/PiCar/python/WebPiCar.py
2015-01-16 10:22:32 – WebIOPi – INFO – GPIO – Native mapped to REST API /GPIO
2015-01-16 10:22:32 – WebIOPi – INFO – Access protected using login/password
2015-01-16 10:22:32 – WebIOPi – INFO – HTTP Server binded on http://192.168.0.49:8000/
2015-01-16 10:22:32 – WebIOPi – INFO – CoAP Server binded on coap://224.0.1.123:5683/ (MULTICAST)
2015-01-16 10:22:32 – WebIOPi – INFO – CoAP Server binded on coap://192.168.0.49:5683/
^C2015-01-16 10:24:40 – WebIOPi – INFO – Stopping…
2015-01-16 10:24:41 – WebIOPi – INFO – Access protected using /etc/webiopi/passwd
2015-01-16 10:24:41 – WebIOPi – ERROR – [Errno 98] Address already in use
Traceback (most recent call last):
File « /usr/local/lib/python3.2/dist-packages/WebIOPi-0.6.0-py3.2-linux-armv6l.egg/webiopi/__main__.py », line 73, in
main(sys.argv)
File « /usr/local/lib/python3.2/dist-packages/WebIOPi-0.6.0-py3.2-linux-armv6l.egg/webiopi/__main__.py », line 67, in main
server = Server(port=port, configfile=configfile)
File « /usr/local/lib/python3.2/dist-packages/WebIOPi-0.6.0-py3.2-linux-armv6l.egg/webiopi/server.py », line 146, in __init__
self.http_server = http.HTTPServer(self.host, http_port, self.restHandler, context, docroot, index, auth)
File « /usr/local/lib/python3.2/dist-packages/WebIOPi-0.6.0-py3.2-linux-armv6l.egg/webiopi/protocols/http.py », line 38, in __init__
BaseHTTPServer.HTTPServer.__init__(self, (« », port), HTTPHandler)
File « /usr/lib/python3.2/socketserver.py », line 419, in __init__
self.server_bind()
File « /usr/lib/python3.2/http/server.py », line 132, in server_bind
socketserver.TCPServer.server_bind(self)
File « /usr/lib/python3.2/socketserver.py », line 430, in server_bind
self.socket.bind(self.server_address)
socket.error: [Errno 98] Address already in use
2015-01-16 10:24:41 – WebIOPi – INFO – HTTP Server stopped
2015-01-16 10:24:41 – WebIOPi – INFO – CoAP Server stopped
Je ne connais pas grand chose à raspbian, un peu d’aide serait la bienvenue 🙂
Pascalou