Publié le 5 janvier 2015 - par

Une interface web simple et intuitive pour le Raspberry Pi (1/2)

interface_web_250pxc’est sur Instructable que j’ai trouvé ces deux descriptions. La première signée TheFreeElectron concerne l’interface web qui permet de piloter facilement 8 sorties GPIO du Raspberry Pi.
La seconde est une application de cette interface, réalisée par rleddington. Elle permet de piloter facilement 8 prises secteur à partir de votre smartphone.

Je vous propose de commencer par la traduction de l’article de TheFreeElectron à qui je cède la parole…

Interface web simple et intuitive pour le Raspberry Pi

Le Raspberry Pi est un incroyable nano-ordinateur à 35€. Il vous permet de faire tout ce que vous pourriez faire avec un ordinateur ordinaire sous Linux (vous connecter à Internet, regarder des vidéos, lancer des applications, …) mais aussi d’interagir avec le monde qui l’entoure, comme un Arduino. C’est pourquoi je le considère plutôt comme un mélange entre un ordinateur et un micro-contrôleur.

connexion
C’est aussi pourquoi je l’ai choisi pour ce projet. Je vais vous montrer comment contrôler des LED avec votre Raspberry Pi. Tout d’abord directement à partir du Raspberry Pi lui-même, puis à partir de n’importe quel appareil  disponible chez vous, votre Smartphone ou votre tablette.

La deuxième partie de cet article décrira une superbe réalisation de rleddington, permettant de commander des prise secteur à partir de l’interface web…

L’électronique

La partie électronique n’a rien de spécial, elle ne comporte que 8 LED avec leur résistance de protection… La seule partie délicate est de bien relier chaque LED à la bonne broche sur le GPIO du Raspberry Pi. En effet, je vais utiliser par la suite, une bibliothèque appelée WiringPi crée par Gordon Henderson (Vous pouvez visiter son site Web sur : http://wiringpi.com/) et les numéros de broches utilisés par cette bibliothèque ne sont pas les mêmes que ceux qui figurent sur le Raspberry Pi.

interface_web_04

Schéma de câblage simplifié

Voyez cette page pour la correspondance : http://wiringpi.com/pins/ (faites juste très attention à la version de Raspberry Pi que vous utilisez, le brochage n’est pas exactement le même en fonction de la révision du circuit…). J’utilise les broches de 0 à 7.

interface_web_08
Pour ce qui est des résistances, elles devraient valoir 270Ω mais comme je n’avais pas cette valeur en stock, j’ai utilisé des résistances de 560Ω (les LED sont juste un peu moins lumineuses).

Leds
Enfin, vous voyez deux schémas ci-dessus. Le premier est une version simplifiée, il ne comporte que les broches utiles et leurs correspondance dans la bibliothèque WiringPi (numéro de GPIO / numéro de broche sur la carte). Le second (avec le brochage complet du Raspberry Pi) vous montre les noms véritables des broches tels qu’ils sont affichés sur la carte.

Installation et utilisation de la bibliothèque WiringPi

WiringPi est une bibliothèque qui simplifie beaucoup l’accès au GPIO du Raspberry Pi (une commande remplace un long processus). Cela signifie également que vous pouvez l’utiliser dans n’importe lequel de vos codes C. Ici nous n’allons pas compiler et utiliser un programme en C mais l’utilitaire GPIO. C’est un logiciel écrit par Gordon, qui fonctionne avec la bibliothèque. Il vous permet de contrôler les E/S GPIO depuis un script bash ou directement en ligne de commande. Cet utilitaire est cependant beaucoup plus lent qu’un programme écrit en C.

interface_web_05

Commençons par l’installation. Gordon explique très bien la procédure sur son site Internet : http://wiringpi.com/download-and-install/. Il faut juste télécharger le programme à partir de GIT, puis le construire en utilisant la commande ./build.

interface_web_07

Après ceci, vous devriez être en mesure d’utiliser l’utilitaire GPIO : Tapez la commande

gpio mode 0 out

pour le tester. Si rien de spécial ne se passe, tout va bien. Sinon, si vous lisez « command not found error » ou quelque chose d’approchant, vérifiez que vous avez correctement suivi le guide d’installation et de construction de la bibliothèque.

interface_web_09

Nous allons maintenant allumer et éteindre la première LED (broche 0). Vous devez d’abord définir la broche en question comme étant une sortie. Utilisez pour cela la commande :

gpio mode 0 out

« 0 » est le numéro de la broche et « out » signifie simplement qu’on la configure en sortie. Maintenant, allumez la LED avec la commande :

gpio write 0 1

« 0 » représente à nouveau le numéro de la broche et « 1 » est son état (1 pour ON/ALLUMÉE et 0 pour OFF/ÉTEINTE ). Si tout va bien, vous devriez voir briller la LED. Pour l’éteindre, il suffit d’utiliser la commande

gpio write 0 0

Juste un petit conseil : si vous souhaitez utiliser le numéro de broche réel (GPIO-17) à la place de celui de WiringPi (0 correspondant à GPIO-17), utiliser le drapeau -g dans votre commande. Exemple :

gpio -g write 17 1

au lieu de

gpio write 0 1

interface_web_01

Il existe aussi « gpio read » qui vous permet de lire l’état de la broche. Ça peut sembler inutile lorsque la broche a été définie comme étant une sortie, mais cette commande vous permet d’être sûr de l’état de la broche lorsque la LED ne s’allume pas… Son utilisation est aussi simple que précédemment, il suffit de taper

gpio read 0

Avec « 0 » indiquant le numéro de la broche. La commande retourne l’état de la broche (soit 1 pour ON et 0 pour OFF).

interface_web_02

Enfin la bibliothèque WiringPi autorise beaucoup d’autres commandes/fonctions mais je ne vais pas en parler ici car on ne s’en sert pas dans ce projet. Si vous êtes plus curieux visitez la page http://wiringpi.com/reference/ (descriptif des fonctions de la bibliothèque) et https://projects.drogon.net/raspberry-pi/wiringpi/the-gpio-utility/ ou exécutez la commande « man gpio« .

Maintenant que vous savez mettre en œuvre cet utilitaire, Jouons un peu avec lui. Vous pouvez d’abord, si ce ne est pas déjà le cas, contrôler votre Raspberry Pi à distance avec SSH. Vous pouvez utiliser Putty sous Windows ou ServerAuditor pour votre Smartphone. Alors amusez-vous avec les scripts bash comme celui-ci qui allume les 8 LED, attend 2 secondes, puis les éteint à nouveau:

#!/bin/bash
#set mode to output
for i in 0 1 2 3 4 5 6 7;
do gpio mode $i out;
done;

#turn on LEDs 0 to 7
for i in 0 1 2 3 4 5 6 7;
do gpio write $i 1;
done;

#wait 2 seconds
sleep 2;

#turn LEDs off
for i in 0 1 2 3 4 5 6 7;
do gpio write $i 0;
done;

Installation d’un serveur web et mise en place du site web

logo_apache
Contrôler des LED à distance avec SSH est plutôt cool mais l’interface (la console) n’est pas très conviviale et taper les commandes à chaque fois se révèle long et ennuyeux. C’est pourquoi nous avons besoin d’une interface graphique pour notre projet.

Programmer une application pour chaque système d’exploitation (IOS, Android, Windows Phone, Mac, Linux, Windows, …) serait trop long et exigerait de connaître quantité de langages différents pour produire… presque rien. Il faudrait aussi programmer une application qui s’exécuterait sur le Raspberry Pi. Procéder ainsi serait exagéré et se traduirait par un gaspillage de temps.

interface_web_03

C’est pourquoi un site web se révèle être la meilleure solution : il est compatible avec tous les périphériques et vous avez « seulement » besoin de connaître quatre langues : le HTML (pour le squelette de la page), le CSS (le style de la page), le PHP (pour gérer les interactions avec le serveur) et le JavaScript (pour gérer les interactions avec l’utilisateur).

Nous avons en effet besoin d’installer un serveur Web sur le Raspberry Pi. Dans notre cas, nous n’avons pas besoin d’une base de données MySQL, juste d’un serveur HTTP et de son extension PHP.

Après la mise à jour de votre Raspberry Pi avec l’habituelle commande « sudo apt-get update && sudo apt-get upgrade« , tapez

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

pour installer le serveur HTTP Apache et l’extension PHP5. Vous pouvez maintenant tester si votre serveur fonctionne en tapant l’adresse IP de votre Raspberry Pi dans votre navigateur. Vous devriez maintenant voir une page indiquant « It works ! » ainsi que deux autres lignes. Si vous n’obtenez pas ça, alors vérifiez l’adresse IP de votre carte, essayez de réinstaller Apache ou redémarrer votre Raspberry Pi. Cette page affiche que votre serveur Apache fonctionne correctement mais ne donne pas d’information sur son extension PHP. Pour vérifier cette dernière, accédez à votre répertoire « /var/www/ » en utilisant la commande

cd /var/www/

Si vous utilisez maintenant la commande « ls« , vous devriez avoir un seul fichier nommé « index.html« . Ce fichier correspond à la page qui affiche « It works !« . Vous pouvez maintenant le supprimer (« sudo rm index.html« ) et en créer un autre appelé « index.php » avec

sudo nano index.php

.

Ensuite, tapez le texte suivant:

<?php
phpinfo ();
?>

Après l’enregistrement à l’aide de ^ o (Ctrl + o), sortez de l’éditeur nano avec ^ x (Ctrl + x). Maintenant, si vous actualisez votre navigateur, vous devriez voir une page très longue,avec beaucoup d’informations sur votre serveur et sur PHP. Si vous ne la voyez pas, vérifiez votre fichier index.php, essayez de réinstaller PHP ou essayez de comprendre l’erreur affichée à la place de la page attendue (effectuez une recherche sur Google si nécessaire).

Si les deux pages s’affichent correctement, vous avez maintenant un serveur Apache/PHP entièrement fonctionnel mais créer des pages en utilisant à chaque fois nano est ennuyeux et pas très confortable. Nous aurons en effet besoin de transférer des fichiers de votre ordinateur à votre Raspberry Pi. Vous pensez peut-être installer un serveur FTP, mais ce n’est pas nécessaire, vous pouvez transférer des fichiers en utilisant le protocole SFTP. Tout ce dont vous avez besoin est un client SFTP sur votre ordinateur. Personnellement j’utilise WinSCP pour Windows mais il ya Cyberduck pour Mac et Filezilla pour Linux. Si vous essayez transférer des fichiers avant de lire ce qui suit, vous aurez probablement des problèmes comme « accès refusé » ou « écriture interdite ». C’est dû au fait que l’utilisateur propriétaire du répertoire www n’est pas pi. En effet, si vous essayez la commande « ls -l /var/www« , vous verrez que seul root (le super-utilisateur) est propriétaire le répertoire www. Vous pouvez (comme moi) utiliser la commande

sudo chown -R pi /var/www

pour modifier les droits ou créer un groupe nommé www-data dans lequel vous placerez l’utilisateur pi. Utilisez ensuite la commande

sudo chown -R www-data /var/www 

Le drapeau -R indique que la commande est récursive, cela signifie que l’utilisateur/groupe ne possède pas que le répertoire lui-même, mais aussi tout ce qu’il y a à l’intérieur (index.php par exemple).

Votre serveur est prêt à travailler et à recevoir des pages Web. Amusez-vous avec lui si vous connaissez HTML, CSS et PHP.

Contrôler les LED en PHP

logo_php

Maintenant que nous avons un serveur Web et une bibliothèque, mettons tout ça ensemble. PHP signifie « PHP: Hypertext Preprocessor », c’est un langage de script côté serveur. Cela signifie que le code PHP est exécuté par le serveur (à chaque fois que la page est demandée) et qu’il n’est pas visible par le client. J’ai utilisé ce langage parce que c’est la plus populaire (et c’est aussi le seul que je connaisse 😉 ), mais vous devez savoir qu’il y a d’autres langages côté serveur comme Python, Ruby, Lua, Perl,… Cependant, je ne sais pas si les fonctions que nous devons utiliser ont leurs équivalents dans ces langages.

Exécuter des applications avec un code PHP peut être fait avec deux fonctions différentes : exec (pour exécution) et le system. Commençons par la fonction system : elle prend deux paramètres: « system (string $command, int $return_var)« , comme vous l’aurez deviné, le premier paramètre est la commande à exécuter et le second est le résultat renvoyé par la commande exécutée. Le second paramètre n’est pas obligatoire. Vous pouvez utiliser cette fonction si vous n’attendez pas de réponse de la commande exécutée. Ainsi, vous pouvez l’utiliser si vous devez exécuter les commandes « gpio mode 0 out » ou « gpio write 0 1« . Par exemple :

<?php
system ( "gpio mode 0 out" );
system ( "gpio write 0 1" );
?>

Ensuite, la fonction « exec« . Cette fonction fait exactement la même chose que « system« , mais elle lit et stocke ce que la commande affiche. Elle prend trois paramètres : exec (string $command, array $output, int $return_var ), $command et $return_var sont les mêmes paramètres et la seule différence est le tableau $output. Comme son nom l’indique il va stocker la sortie de la commande dans un tableau. Ainsi, vous pouvez utiliser cette fonction si vous avez besoin de ce qu’affiche une commande comme avec le « gpio read 0 ». Par exemple :

<?php
exec ( "gpio read 0", $status );
print_r ( $status );
?>

Vous pouvez maintenant exécuter à peu près toutes les commandes que vous voulez, mais nous allons prendre un petit exemple pratique en PHP : Nous allons allumer les voyants 0 à 7, attendre deux secondes, puis les éteindre. C’est exactement ce que nous avions fait avec le script bash. Editez le fichier index.php et insérez y le code suivant :

<?php
$status = array ( 0 );
//set pins mode to output
for ($i = 0; $i <= 7; $i ) {
system ( "gpio mode ".$i." out" );
}
//turns on the LEDs
for ($i = 0; $i <= 7; $i ) {
system ( "gpio write ".$i." 1" );
}
//reads and prints the LEDs status
for ($i = 0; $i <= 7; $i ) {
exec ( "gpio read ".$i, $status );
echo ( $status[0] );
}
//waits 2 seconds
sleep ( 2 );
//turns off the LEDs
for ($i = 0; $i <= 7; $i ) {
system ( "gpio write ".$i." 0" );
}
?>

L’interface web

interface_web_06

Une interface web très simple !

Nous pouvons maintenant contrôler notre Raspberry Pi avec des scripts PHP simples mais il n’y a aucune interaction avec l’utilisateur et de ce fait nous ne pouvons pas choisir la LED à allumer/éteindre. Fabriquons l’interface!
Elle est composée de photos que je ai trouvé sur Google images (recherche sur « on/off button »). L’un était vert et l’autre rouge, j’ai juste ajouté le numéro en utilisant The Gimp. Chaque image d’une touche correspondant à une LED, donc si vous cliquez sur une de celles-ci, la LED correspondante sera allumée/éteinte et l’image sera modifiée, passant de vert à rouge. Le squelette de la page est fait en HTML, les interactions avec le serveur et la génération de page en PHP et JavaScript gère finalement les interactions avec l’utilisateur et l’animation de la page. Au cas où vous l’ignoreriez, JavaScript est un langage côté client et contrairement à PHP, il est exécuté non pas une fois, mais de façon continue par votre navigateur. C’est pourquoi vous pouvez changer le look de la page sans avoir à la recharger ou à accéder à une autre page. Si vous vous demandez pourquoi j’ai parlé de CSS avant, c’est juste parce que nous en avons besoin pour certains styles et mise en page comme le fond noir. Je ne ai pas créé un fichier CSS complet parce qu’il n’était pas nécessaire de le faire ici.

Nous avons d’abord besoin d’un fichier « index.php » (l’extension est .php est et non .html car nous allons utiliser du code PHP, elle permet au serveur de savoir qu’il y a du code PHP à exécuter avant d’envoyer la page générée. Cette page est la page principale contenant les 8 boutons. Ces boutons sont d’abord générés avec un « exec ( « gpio read « .$i, $output ); » dans une boucle. Ensuite, nous devons détecter le moment où l’utilisateur clique sur un de ces boutons. C’est là que le JavaScript est utile, je l’ai mis dans un fichier séparé appelé « script.js » mais il est toujours inclus dans index.php. Le script ajoute simplement un « écouteur d’événement » à chacun des huit boutons et chaque fois que l’un d’eux est pressé, il utilise une fonction qui appelle gpio.php, reçoit sa réponse, puis la renvoie. Enfin, en fonction de cela, le JavaScript change le bouton rouge (pour OFF) en vert (pour ON). Maintenant, la dernière page : gpio.php. Elle contient le code PHP pour allumer/éteindre les LED en fonction de ce que la fonction JavaScript a envoyé. L’utilisateur ne doit normalement pas appeler cette page directement, mais il y a une règle d’or lors de la création des sites Web et vous devez toujours vous rappeler ceci : « Ne faites jamais confiance l’utilisateur« . En d’autres termes, ne pensez jamais que l’utilisateur va toujours faire ce que vous pensez qu’il va faire. J’ai donc ajouté quelques sécurités au début du code PHP pour m’assurer que l’utilisateur passe une valeur correcte et pas une lettre par exemple. J’ai fait un petit diagramme pour résumer tout ce texte.

synoptique

Diagramme de fonctionnement

ZIPVous pouvez télécharger l’ensemble
du projet sur Web.zip (701 KB)

Conclusion et des idées d’améliorations

Ce petit projet était amusant à expliquer en détail et j’ai beaucoup appris en le réalisant. J’espère qu’il en sera de même pour vous. Toutefois, le contrôle de LED n’est pas très utile. C’est pourquoi ce que nous avons fait est plutôt un outil qu’un véritable projet. C’est bientôt Noël (dans environ un mois et demi de ce jour où j’écris le tutoriel) alors pourquoi ne pas remplacer les LED par des relais et contrôler les lumières autour de votre maison. Il y a quelques très bonnes cartes relais pour le Raspberry Pi sur Ebay et plus généralement sur Internet. Sinon, et si vous n’avez pas peur de travailler sur votre maison, vous pouvez même contrôler les lumières de la maison, les portes de garage, machine à café, système de chauffage, volets roulants… La seule limite est votre imagination.
Il y a aussi beaucoup d’améliorations possibles comme modifier l’interface, ajouter plusieurs voyants via un registre à décalage, en utilisant la reconnaissance vocale,… En outre, avec PHP, vous n’êtes pas limité à écrire ou lire le GPIO. Vous pouvez utiliser plus complètement l’utilitaire GPIO et donc interagir avec d’autres appareils équipés d’un UART ou de tout autre protocole. Vous pouvez également utiliser le PWM (Pulse Width Modification) pour contrôler des servos, …
La rédaction de ce tutoriel vise à partager mon peu de connaissance. Ce fut un grand plaisir pour moi et je espère que c’était agréable pour vous de le lire. J’ai essayé de garder les choses simples mais en même temps de vous apprendre le plus possible. Je ne voulais pas faire une simple description étape par étape, mais muette : « télécharger ce code, exécutez-le, vous avez terminé ». Je pense qu’il est inutile d’apprendre quelque chose si vous comprenez comment cela fonctionne ou pourquoi vous faites ceci et pas cela. Faites-moi savoir si vous pensez que c’est la bonne voie ou si je dois faire autrement.

Le prochain volet de cette description sera plus pratique puisqu’il décrira la réalisation de rleddington qui a utilisé cette interface pour commander 8 prises 220V.

Merci à TheFreeElectron qui a autorisé la reprise de cet Instructable et sa traduction en Français.

Sources

Share Button

À propos François MOCQ

Électronicien d'origine, devenu informaticien, et passionné de nouvelles technologies, formateur en maintenance informatique puis en Réseau et Télécommunications. Dès son arrivée sur le marché, le potentiel offert par Raspberry Pi m’a enthousiasmé j'ai rapidement créé un blog dédié à ce nano-ordinateur (www.framboise314.fr) pour partager cette passion. .

86 réflexions au sujet de « Une interface web simple et intuitive pour le Raspberry Pi (1/2) »

  1. Mathieu

    Ce tutoriel est vraiment bien fait et le programme facile à comprendre. Je l’ai d’ailleur utiliser il y a plusieurs mois comme base afin de créer une interface de commande pour un robot !

    Répondre
  2. Ping : Une interface web simple et intuitive pour le Raspberry Pi (2/2) | Framboise 314, le Raspberry Pi à la sauce française….

  3. lionel

    Bien qu’il ne soit pas question de lister toutes les commandes liées au GPIO, j’aimerais citer celle-ci:

    gpio readall

    Elle permet, à tous ceux qui, comme moi, ont du mal avec le foutoir des trois numérotations/appellations des broches, de s’y retrouver et d’avoir une vue d’ensemble de l’état e ce connecteur.

    Ca serait tout de même sacrément chouette de n’avoir qu’une seule nomenclature, vous ne trouvez pas ?

    Répondre
  4. lionel

    Je pense qu’il y a une toute petite erreur ici:

    1

    Il faut veiller à ne pas laisser d’espace dans la première ligne:

    sinon, rien ne s’affiche

    Répondre
  5. lionel

    Bonjour,

    en effet, il manque un truc dans mon post.

    Dans le fichier phpinfo, dans la première ligne, il y a un espace ( <? php ) alors qu'il n'en faut pas.

    Cependant, chapeau pour ce nouveau tuto qui me permet d'apprendre encore plein de choses sur cette petite merveille qu'est la raspi.

    Répondre
  6. fabien

    Bonjour,

    Un grand merci pour ton site web et ton travail sur le Raspberry Pi qui m’aide énormément.
    Je rencontre un problème je n’arrive pas à avoir les droits pour modifier /var/www en SFTP je voit le dossier mais pas de droit pour modifier.
    J’ai fait :
    « 1sudo chown -R pi /var/www
    pour modifier les droits ou créer un groupe nommé www-data dans lequel vous placerez l’utilisateur pi. Utilisez ensuite la commande

    1
    sudo chown -R www-data /var/www »

    A la commande ls -l /var/www
    -rw-r–r– 1 www-data root 21 février 7 08:57 index.php

    Merci pour votre aide .

    Répondre
  7. fabien

    Il faut modifier les droits ou créer un group en faite il faut faire :
    sudo chown -R pi /var/www
    Moi je faisais la commande pour modifier les droits puis je créai un groupe avec la commande : sudo chown -R www-data /var/www
    En faite j’ai juste modifié les droits

    Répondre
  8. Bimm

    Super tuto qui m’a bien aidé (je débute complétement dans l’électronique).

    J’ai juste une petite question supplémentaire (probablement idiote mais je prend le risque !) :
    Disons que je veuille contrôler 16 leds (avec une seule led allumé au même moment) avec 4 ports GPIO qui retourne 0 ou 1 je peux avoir 16 résultat différent.
    Comment réussir a allumer la diode 0 si tous les ports GPIO sont éteint, la diode 1 si seulement le port 4 est allumé … la diode 16 si tous les GPIO sont allumé?

    Merci d’avance 🙂

    Répondre
  9. bruno83

    bonjour,
    J’ai mis en œuvre ce projet mais en analysant programme (j’avais un peu le temps), il y a des erreurs fondamentales, ce programme semble marcher mais il ne fonctionne absolument pas.
    En réalité, lorsque l’on clique sur un bouton, il envoie bien une information logique sur une sortie sélectionnée mais n’analyse absolument pas la réponse renvoyée pour connaitre l’état logique de celle-ci.
    Voici les pistes pour ceux qui veulent le modifier
    la page gpio.php :
    Des commentaires ont été laissé on envoie une chaine de caractères, il absolument les éliminé et ne laisser aucun blanc pour avoir en retour « 0 » ou « 1 » :
    1

    Sur la page java-sricpt une erreur gra, on teste la variable de retour différent de « fail » au lieu de tester la variable de retour 0 ou 1 , le return renvoie une erreur mais pour le programme c’est différent de « fail » donc il modifie l’état du bouton.
    Il faut créer un callback, j’ai modifié ce programme visuellement, on ne voit pas la différence seulement là il fonctionne réellement comme le cahier des charges.
    A+bruno

    Répondre
      1. François MOCQ Auteur de l’article

        Bonjour Bruno et merci pour le boulot que tu as fait sur ce programme. Comme Domi te le dis dans le forum, cet article est une traduction publiée avec l’accord de l’auteur. Ça permet aux francophones de découvrir des réalisations décrites en anglais 😉
        Ton commentaire avait été rangé dans les indésirables et je viens de m’en apercevoir et de le publier.
        Bonne continuation
        Cordialement
        François

        Répondre
    1. yethidom

      Merci pour votre travail, j’ai testé les deux versions, et n’ai pas vu de différence dans le fonctionnement.
      Je n’ai pas encore eu la possibilité de valider si les variables de retour étaient bien réelles et regardé si les 8 GPIO utilisés étaient cour-circuitables (INPUT et OUTPUT)
      Seule petite remarque, la taille des boutons est trop grande, aussi avec Photoshop, j’ai changé la taille dans un rapport ¼.
      Bruno83 vous écrivez le Sam 16 Mai 2015 20:07
      « Je me suis permis ces modifications car ce programme est destiné à mes élèves de terminale STI2D SIN, je ne voulais aucune ambiguïté.»
      Je crois qu’il manque un point important dans ce projet pour vos élèves de terminale, c’est le fonctionnement avec coupures d’alimentation ou micro-coupures.
      En effet après une coupure d’alimentation de la carte, actuellemnt les sorties se retrouvent toutes à l’état OFF alors qu’elles devraient retrouver l’état d’avant coupure ou se placer dans un état de sécurité choisi par l’opérateur pour chacune des sorties.
      La mémoire ram n’étant pas sauvegardée par batterie, il serait bon d’utiliser un ou deux octets de la microSD pour garder la mémoire des états à placer au retour d’alimentation.
      Donc une rangée de 8 boutons supplémentaires indiquant l’état de sécurité pour chaque sortie au retour d’alimentation.
      Un 9 éme bouton pour demander une position identique à celles qu’elles avaient avant la coupure pour toutes les sorties. Ce 9 éme bouton étant prioritaire sur les 8 boutons ajoutés.
      Merci encore.

      Répondre
      1. bruno83

        Bonjour,
        Effectivement sur le visuel on ne voit pas la différence mais le code du projet initial a des erreurs, en php avec les commentaires en début et sur le code en ajax c’est faux, surtout ne pas prendre ce code comme exemple car vous allez vous embrouiller.
        Pour le deuxième point, je le fais faire par mes élèves mais en utilisant une base de donnée sur le serveur Mysql (voir mon tuto), c’est simple et efficace chaque modification est enregistrée sur la base de données.
        http://tsin.langevin-la-seyne.fr/SIN/dossiertelecharg/RASPBERRY_PI%20%282%29.pdf
        a+bruno

        Répondre
  10. Rem

    Bonjour peut-on faire la même chose sans utiliser java? Et si je n’utilise pas java, je ne vais pas avoir mon bouton qui changera de couleur, et c’est la seule chose qui changera?
    L’appuis sur un bouton allumera tout de même la led?
    Merci d’avance, cordialement

    Répondre
    1. bruno83

      Oui, en php c’est encore plus facile, il faut mettre des boutons html associés aux images et tu te passes totalement du javascript et ajax
      Avec un header(« Location: index.php ») dans la page retour
      A+ bruno

      Répondre
      1. patrick532

        bonjour,
        je pense que « dsl » est simplement l’abréviation de « désolé » ! (ah le style SMS et la non-ponctuation, c’est super).
        sinon je pense que sa demande de placement du fichier data, signifie qu’il ne sait pas où mettre les différents fichiers que l’on crée dans ce tuto. Il n’a pas du tout lire car c’est expliqué vers le haut du tuto , il faut placer les fichiers sur le raspberry dans le répertoire suivant :
        /var/www/

        Autrement j’ai noté une autre erreur dans le fichier qui permet de passer de 1 à 0 après une tempo de 2s : il faudrait $i++ au lieu de $i dans les boucles « for » car sinon le programme ne finit jamais.
        cordialement.
        patrick532

        Répondre
  11. rexty

    bonjour
    je suis déçu car la première action allumage d’une led avec write n’allume rien du tout.
    j’ai mis une del verte avec une resitance de 150 ohm en série sur la patte la plus courte (K) et j’ai bien
    relié l’anode à la pin 17 du gpio. La commande gpio read 0 0 et gpio read 0 1 me renvoie bien 0 et 1.
    Etrange entre la pin 17 et le gnd j’ai tension négative de – 1.16v.
    Je suis bloqué Help me !

    Répondre
  12. bruno Coffy

    Bonjour,
    Juste à titre d’indication je vous déconseille d’utiliser cette librairie mais plutôt un programme en python, c’est simple et ultra facile voici un bout programme exemple qui remplace une écriture sur le gpio.
    A+bruno

    Coté php

    < ?php

    unset($status); //je détruits la variable
    $pint=11; //broche n°11
    exec("sudo test ".$pint,$status); //Exécution du programme sudo test et j’envoie la variable $pint contenant « 11 »
    echo($status[0]); //Réception de l’état de la variable coté python print(A) et l’afficher
    echo ''; //mettre à la ligne
    echo($status[1]); //Réception de l’état de la variable coté python print(‘toto’) et l’afficher
    ?>

    Coté python (test.py) :
    #!/usr/bin/env python
    import sys """ librairie système """
    import RPi.GPIO as GPIO """ librairie GPIO """
    GPIO.setmode(GPIO.BOARD) """ choisir le connecteur GPIO """

    pintest = sys.argv[1] """ permet de récupérer la variable venant de php """
    B = int(pintest)""" convertir cette variable en entier """
    GPIO.setup(B,GPIO.OUT)""" mettre la broche 11 en sortie """
    GPIO.output(B,GPIO.LOW)""" mettre à 0 la sortie 11 du connecteur """
    A = GPIO.input(B)""" lire la sortie 11 du connecteur """
    print (A)""" afficher le contenu et l’envoyer dans $status[0] """
    print (‘toto’)"""afficher toto et l’envoyer dans $status[1]"""

    Répondre
  13. rexty

    Merci de vos réponses.
    Des claques je me donnerais, grâce à vous je me suis aperçu que j’avais monté une carte d’extension
    du gpio à l’envers, évidemment cela fonctionne moins bien au niveau du repérage des broches; mais
    je n’en ai pas pour autant fini. Maintenant que je sais allumer les leds manuellement avec write, le programme bash ???? qui suit sur l’article est très mystérieux pour moi, non dans la compréhension
    du programme mais concrètement je le mets sur le pc distant en SSH par PUTTY, comment faire ??
    un dossier? un fichier? quel nom ? (putty est déjà en marche )
    un petit tuto serait le bienvenu .
    merci d’avance.

    Répondre
    1. François MOCQ Auteur de l’article

      Bonjour
      bon, je mets ça dans ma liste de TODO 😉 mais elle est déjà longue, soyez patient !
      Expliquez moi le « comment faire ? »
      Si vous êtes connecté avec PUTTY c’est comme si vous étiez sur une console locale au Raspberry Pi…
      Vous intervenez directement « dans » le Raspberry Pi, vous vous déplacez dans son système de fichier…
      Créez un fichier avec nano. Donnez lui le nom que vous voulez. Collez-y le code, enregistrez (CTRL-X).
      Ensuite il faut rendre le code exécutable en changeant les droits et enfin vous pouvez exécuter le programme… OUF!
      C’est vrai que ce n’est pas évident si vous ne l avez jamais fait
      bon amusement avec la framboise
      Cordialement
      François
      ps : si vous voulez un coup de main pour les claques…. 😉

      Répondre
  14. rexty

    Super sympa ces réponses rapides, bon ! le fichier c’est fait !
    par contre pour le mystère de la chambre jaune …..
    « Ensuite il faut rendre le code exécutable en changeant les droits et enfin vous pouvez exécuter le programme… OUF » kékidi le monsieur

    PS : ça y est j’ai commencé à potasser l’univers linux, mais comme je perds 400000 neurones
    par jour ,je ne comprends toujours pas vite même en m’expliquant longtemps.
    Salutations cordiales.

    « 

    Répondre
    1. François MOCQ Auteur de l’article

      Bonsoir rexty
      oui je sais ça fait beaucoup de choses à voir/comprendre…
      mais vous êtes sur le bon chemin, celui de la connaissance !
      c’est le bon côté de la force…
      allez une piste 😉
      lisez cet article et vous en saurez plus !
      http://www.framboise314.fr/les-droits-linux-sur-le-raspberry-pi/
      bien entendu si ça coince encore n’hésitez pas à me solliciter
      mais dites vous bien que je ne ferai rien « à votre place »
      l’idée ici c’est de progresser en cherchant comment mener à bien un projet
      et… vous êtes en bonne voie
      cordialement
      François

      Répondre
  15. rexty

    Bonjour et excellente année 2016 pour tous.

    Ayant mangé tous les chocolats, je me suis remis sur mon raspberry.
    J’ai avancé depuis la dernière fois et les leds s’allument et s’éteignent
    j’ai même modifié le programme avec des répétitions.
    Le serveur apache est monté, tout à l’air d’être ok.
    Là où je bute c’est comment obtenir l’interface dans ma tablette ou
    mon téléphone android. là je suis complètement sec
    pouvez-vous m’aiguiller vers un apprentissage ?
    merci d’avance …je vais à la galette.

    Répondre
  16. rexty

    Bonjour
    J’ai mangé la galette et je n’ai pas eu la fève, ni satisfaction avec l’application des 8 inters.
    J’en suis au dernier stade , c’est à dire avec le fichier ZIP de l’application
    dont je ne sais que faire. J’ai bien essayé après décompression de le passer dans le
    répertoire var/www avec winscp, niet, refusé !!; pourtant sur ma tablette lorsque je tape
    l’adresse de mon raspberry, j’ai la page d’accueil d’apache, je pense donc que mon serveur fonctionne.
    De l’aide je veux bien, car je sens que je ne suis pas loin du résultat.
    merci d’avance

    Répondre
    1. François MOCQ Auteur de l’article

      Bonjour
      désolé pour la fève…
      niet refusé… mais encore ? access denied ?
      si c est le cas c est une question de droits
      si vous avez essayé de copier avec Pi vous n’avez sans doute pas les droits sur /var/www ?
      essayez de copier dans le répertoire /home/pi avec winscp
      puis sur le RasPi avec sudo copiez dans /var/www…
      difficile d’en dire plus avec le peu d’infos disponible
      cordialement
      François

      Répondre
  17. jean pierre

    bonjour Ce tutoriel et vraiment bien fait merci, je débute en programmation Php et java et python, je voudrais savoir comment faut-il faire pour temporiser les boutons de façon à ce qu’il reste 30s en vert quand on appuie et passe au rouge et remet la sortie à 0

    Répondre
      1. Richard

        bonjour,
        Je débute et je suis également intéressé par le fait que la sortie soit temporisée, le tuto fonctionne bien sauf que si on active 3 sorties, les 2 premières reviennent a l’état normale, mais la dernière reste bloqué ( il faut la désactiver manuellement ).
        pouvez vous m’aider?

        Répondre
        1. bruno83

          Normal j’utilise qu’une variable gestion, c’était juste un exemple pour une seule sortie à la fois , il faut que tu créées plusieurs variables( le plus bourrin une par sortie) ou encore mieux tu utilises « maintenant = new Date(); »que tu rafraichies toute les secondes et avec des tests tu choisies pour chaque sortie le temps d’allumage.

          Répondre
    1. bruno83

      Bonjour ,
      Vous pouvez aussi le faire en php avec un timeout mais vous occupez le serveur pour rien.
      Ou en python avec time.sleep(30) ,c’est dommage car lorsque vous exécutez le script python par l’instruction exec() en php, vous bloquez votre programme pendant 30 secondes ,le plus souple est ma solution qui s’exécute sur le client (chez vous) avec de l’ajax de façon asynchrone.

      http://tsin.langevin-la-seyne.fr/SIN/
      A+bruno

      Répondre
  18. jean pierre

    merci pour l’exemple j’ai encore beaucoup à apprendre mais ce n’est pas facile tout seul quand on n’a aucune notion du langage,

    Répondre
    1. bruno83

      Bonjour ,
      Aucun soucis, j’ai mis une tempo de 5 secondes pour éteindre la led pour le test lors d’un appui (voir fichier (script.js).
      Si non je me suis emporté ce n’est pas hyper simple car il faut maitriser plusieurs langages coté serveur PHP et python pour le gpio, coté client HTML5(css, html, javascript).
      A+Bruno

      Répondre
  19. Cerberus

    Bonjour,
    Étant élève de 2nde dans la zone B, je suis en vacance. J’ai donc décidé de re-re-reprendre goût à la prog. Ça fais quelques temps que je possède ma rasp (b+), mais ayant un arduino uno je m’en servait essentiellement pour la parti « micro-pc » plutôt que « micro-contrôleur ».
    L’envie de piloter le monde qui m’entoure, sans avoir besoin de re-loader à chaque fois un code pour pouvoir contrôler quelque chose, m’à poussé à me servir de mon wi-fi. Il me fallait donc un schield pour mon arduino… ce tutoriel sur la rasp m’a tenté, et les perspectives d’évolution enthousiasmé. (Les leds pouvant être remplacées pas des relais…)
    Or j’ai eu de multiples problèmes (parfois corrigés) mais là, quand je tente d’accéder à mon index depuis un périphérique connecté au même réseau que la rasp, j’ai l’erreur404…
    J’ai pourtant bien dezzip tout les fichiers dans www (j’ai vérifié s’ils y étaient tous avec ls et c’est bon)
    Cordialement,
    Cerberus

    Répondre
    1. François MOCQ Auteur de l’article

      Bonjour Cerberus
      on en revient aux basiques :
      une fois que vous avez installé Apache, est-ce que vous avez testé l’accès au site web et est-ce que ça fonctionnait ?
      sinon ça ne sert à rien de continuer… et de déziper l’archive
      erreur 404 c est une page non trouvée… y a t il une indication sur cette page manquante ? (chemin, nom…)
      cordialement
      François

      Répondre
      1. Cerberus

        Bonjour,
        Merci pour cette réponse rapide. Oui, la page d’apache s’affichait avant de la remplacer par la votre. La page ne donne aucune info mises à par que la rasp ne trouve pas la requête URL . J’ai supprimé tout ce qui se trouvait dans /www/
        et y ai créé un nouvel index en .html (en html pour savoir si c’était juste le pluggin ou tout le logiciel). j’ai toujours la même erreur et j’en ai déduit que ça vient de la rasp ou apache. J’ai donc re-telechargé apache, refait les mises à jour de la rasp et toujours bloqué au même endroit. Merci pour votre aide.
        Cordialement,
        Cerberus

        Répondre
      1. yan

        Peux ton faire le même projet avec 32 leds en sortie et un programme pour allumer les leds de façon aléatoire ?
        Merci de votre réponse

        Répondre
        1. Bruno

          Pour 29 led aucun soucis ,32 il faut que tu multiplexes si-non tu modifies le programme python et mettre une fonction aléatoire
          Qui choisit ton gpio
          #python
          import random
          r = random.randint(0,29)

          idem en javascript
          R =getRandomInt(0,29);//aléatoire entre 0 et 29
          /******************************/
          function getRandomInt(min, max) {
          return Math.floor(Math.random() * (max – min)) + min;}
          /******************************************/

          Répondre
  20. Marcoux Michael

    Bonjour Bruno,
    Merci pour votre dévouement envers ceux qui veulent apprendre comme moi.
    Sur le site de votre école, il y a un projet avec la gestion de store somfy.
    Dans le but d’apprendre encore plus et aussi de l’adapter au projet de mon hobby de radio-amateur, pourrais-je obtenir le lien de téléchargement du pdf ou des fichiers sources de ce projet ?
    En vous remerciant d’avance.
    Michaël Marcoux

    Répondre
    1. Bruno

      Bonjour Mickaël,
      merci
      Voici Le même exemple sur framboise 314 mais en python
      http://www.framboise314.fr/une-interface-web-simple-pour-piloter-des-led-avec-html5-et-python-sur-le-raspberry-pi/
      pour le Somfy , pas avant juin car c’est un projet d’élèves, ils avancent rapidement mais ils sont loin d’avoir terminés , nous utilisons de plus en plus le langage python car les profs de math l’utilisent aussi en ISN et en classe préparatoire.
      A + BRUNO

      Répondre
  21. Fernando

    Bonsoir François,
    tout d’abord un grand merci pour ce tuto très bien expliqué. pour un débutant comme moi. Je viens d’acheter la Raspberry 2 B.
    J’arrive bien à piloter mes LEDs via commandes wiringPI et serveur Apache, en local et via mon smartphone par le Web selon vos explications, mais j’ai un souci matériel avec la carte 8 relais (Module de relais à 8 canaux de bas actif 5V pour Arduino PIC AVR MCU DSP ARM) achetée sur AMAZON (http://www.amazon.fr/Module-relais-canaux-actif-Arduino/dp/B00EDHX4Z4?ie=UTF8&ref_=pe_386181_37038081_TE_3p_dp_i1) pour tester les relais avec en Sorties (relais): 1 LED et 1 Résistance pour simuler la commande de relais de puissance 230V. Le Pb rencontré étant que les relais ont un fonctionnement contraire à la logique, soit, que je suis obligé d’écrire 0 dans le code (wiringPi ou Python) pour allumer la petite LED rouge associée à la broche INx, pour activer le relais associé à cette broche INx et voir allumé la LED en Sortie de relais.
    En sortie de relais je suis bien câblé entre C et NO (soit vis du milieu et vis de gauche). et donc, pour désactiver ces relais, je suis obligé d’écrire un 1 dans le code (wiringPi ou Python). Ce dysfonctionnement pour ce type de carte relais vous a-t-il été remonté ?
    Merci de votre réponse.

    Répondre
    1. François MOCQ Auteur de l’article

      Bonjour Fernando
      ce n’est pas vraiment un dysfonctionnement…
      certaines cartes fonctionnent en logique positive, d’autres en logique négative…
      par exemple
      logique positive et négative

      Votre carte possède des optocoupleurs en entrée :
      optocoupleur

      et donc selon la façon dont la LED est branchée, il faut un 1 ou un 0 pour l’allumer…
      Rassurez vous ça n’a rien d’exceptionnel et ce n est pas du tout un problème.
      Il faut juste modifier le programme en fonction de la carte 🙂
      donc si la LED de la carte s’allume et que le relais colle quand vous envoyez un 0 eh bin…. c’est comme ça on n’y peut rien 😉
      cordialement
      François

      Répondre
  22. Fernando

    Bonsoir François et Bruno,
    bon pas de bol avec cette carte relais. j’y perdais mon latin…
    jamais vu cette techno qui fonctionne en logique négative.
    Merci beaucoup à vous deux pour vos schémas d’autant plus utiles que j’ai
    à présent le schéma de cette platine relais de SONGLE.
    Bruno, j’ai bien testé le mode C – NC, mais je me trouvais avec les mini LEDs d’état des relais allumées au repos est éteinte au travail. Donc, pour avoir un état « normal » de ces mini LEDs, je suis passé en C – NO, mais avec la logique du 0 et 1 inversée. Avez-vous une Réf de carte 8 relais avec fonctionnement en logique positive ? Mais je ne comprends pas pourquoi cette carte est vendue pour Arduino, si elle fonctionne à l’envers :-). Merci encore.

    Répondre
    1. François MOCQ Auteur de l’article

      bonsoir Fernando
      en Arduino c’est pareil :si on sait qu’il faut sortir un zéro pour allumer une LED ou coller un relais ce n’est pas un problème 🙂
      cordialement
      François

      Répondre
    2. bruno83

      Voici un lien pour une autre carte pas chère :
      http://www.robotshop.com/eu/fr/relais-5v-8-canaux.html#pageTop

      Ça marche comme tu veux, le seul truc qui peux te poser problème c’est la saturation des transistors comme aucune référence n’est indiqué (ces produits chinois !!!),il faut espérer que le courant ib soit supérieure au courant de juste saturation pour 3.3v ( ib>>ic/hfemini)
      Calcul de ib= (vs-vbe)/1000 avec vbe=0,6 v
      Ib= 2 ,7mA (3,3v) moitié qu’avec 5v donc difficile d’être catégorique ?
      Ib= 4,4mA (5v)
      La sortie (3,3v) doit aussi alimenter la mail de la diode led là aussi aucune réf donc impossible de savoir si cette carte peux fonctionner avec ton raspberry il faut envoyer un mail et leur demander une doc plus complète ou la réf. des transistors.
      A+ BRUNO

      Répondre
  23. Fernando

    Merci de vos retours rapides, vraiment synpa !

    Est-il possible de passer par un buffer inverseur, genre SN7406 en interface entre Pins GPIO et Pins Entrées de la carte 8 relais ?
    Si oui, en terme de câblage ce serait:
    GPIO >> Input du SN7406 et
    Output SN7406 >> Input carte Relais ?
    Faut-il ajouter des Résistances avant et ou après le SN7406 ?

    Voici la doc technique du SN7406:
    https://drive.google.com/file/d/0BxlOg52nJwSRa2ZyMGU2eWxwejA/view

    Merci pour vos retours.
    Fernando.

    Répondre
    1. bruno83

      Bonjour,
      Ton choix est le bon c’est moi qui était endormi donc tu mets directement en sortie du sn7406 de ta carte avec VIH min 2 v donc ça devrai fonctionner sans problème.
      A+bruno

      Répondre
    2. bruno83

      Bonjour,
      Ça devrai marcher car VIH min 2 v mais pour être sûr il vaut mieux le 74hc05 alimenté en 3.3v avec collecteur ouvert niveau d’entrée 0-3.3v
      A+ BRUNO

      Répondre
    1. bruno83

      Bonjour,
      Juste un truc comme ImAx par circuit 50mA et (25mA par sortie ) équilibre tes 8 sorties sur deux circuits voir sur 3 circuits, et là aucun risque de surchauffe.
      En regardant la doc :
      (Load currents should not exceed 25 mA per output and 50 mA total for the part.).
      Car un opto classique généralement if entre 1 à 10mA taux transfert 600%
      A+bruno

      Répondre
  24. Fernando

    Bonjour Bruno,
    Oui, c’était prévu que j’utilise 4 circuits sur les 6 par CI, donc 2 CI au total pour ma carte relais.
    Je verrais si ça tient, sinon je n’utiliserais que 3 circuits sur 6 et je rajouterais un 3è CI par sécurité.
    Merci de cette alerte.
    Cordialement,
    Fernando.

    Répondre
  25. 8minuteschrono

    ah tiens il faut ecrire en moins 8 minutes ou nos merveilleuse réponses sont perdues!
    5-1.2=3.8V
    3.8V=270ohm*0.014A
    8*0.014A= des raspberry cramés

    Répondre
    1. François MOCQ Auteur de l’article

      Bonjour
      L’anti-spam fixait ce délai à 2mn 🙁
      je l’ai poussé à 8mn…
      Les sorties du RasPi sont en 3,3v
      3,3 – 1,2 = 2,1V
      2,1V = 270ohm * 0.0077A
      8 * 0,077A = 0,062 A bah… c’est déjà mieux 🙂

      Répondre
      1. bruno83

        Il vaut mieux acheter des led avec un if =1mA et augmenter la résistance R=(3.3-vf)/If
        Pour les 8 minutes c’est rapide c’est pour ça que je fais des fautes d’orthographe pas le temps de me relire. lol

        Répondre
  26. Fernando

    Bonsoir,
    je reviens sur le sujet de ma carte 8 relais qui fonctionne « en logique inversée ». Je viens de finaliser un petit module avec 2 CI de type « sn74hc05 » et ça fonctionne correctement, pour le moment avec un seul CI et 4 Relais. Le CI ne chauffe pas… donc, c’est nickel.
    Il ne me reste plus qu’a câbler le 2è CI sur les 4 autres relais.
    Donc, avec ce module inverseur les commandes des relais sont à présent en logique normale, soit HIGH = relais ON et LOW = relais OFF.
    Merci beaucoup Bruno de ton aide 🙂

    Répondre
  27. ELIE

    Bonjour,
    Merci pour cet article. Mais j’ai un probleme quand je met gpio write 0 0 le led sur le board relai s’allume tandis que 1 eteint.
    Merci d’avance

    Répondre
  28. maxime

    bonsoir
    help
    j’aurais une petit question le dossier que vous avez créer pour l’interface web avec les bouton rouge et vert (celui que l’on peut telecharger) ou doit-je le placer ? si c’est dans le dossier /var/www j’ai un probleme mon raspberry ne m’autorise pas le faite de copier ou de modifier des fichier a cet endroit. comment puis-je faire ?

    Répondre
      1. François MOCQ Auteur de l’article

        Bonsoir Maxime
        vous ne devez pas avoir les droits pour écrire dans ce dossier
        utilisez sudo avant votre commande pour devenir root le temps de la commande.
        Si je peux me permettre une remarque, ne vous lancez pas dans un gros projet avant d’avoir un minimum de connaissances de base
        je sais bien qu’on apprend en faisant mais si vous bloquez pour quelque chose d’aussi basique vous risquez de tout envoyer balader « parce que Linux ça marche pas » alors qu’en fait vous voulez griller les étapes et aller beaucoup plus loin que vos connaissances le permettent
        il y a un peu de tout dans ce projet du matériel mais aussi du web, du php, du javascript… ça fait peut être beaucoup pour commencer ?
        prenez votre temps, découvrez le système, son environnement, root, sudo, su, les droits Linux… après ça ira beaucoup mieux 🙂
        cordialement
        François

        Répondre
  29. hanakin

    Bonjours

    extra le tuto sur la domotique
    tout fonctionne parfaitement , je vroudrais si possible qu’a chaque fois que l’on appui sur le bouton (rouge ou vert) cela produise un son (clic par exemple) comme je suis une bille en javascript et malgres avoir fouiller pas mal de forum la dessus je n’arrive pas a rajouter un son .

    Merci d’avance

    PS: aucun pb pour jouer un son en html

    Répondre
    1. bruno83

      C’est hyper simple tu crées en html5
      < audio id="sonGenerique" preload="auto">< source src="son.mp3" type="audio/mp3">< /audio>
      dans index.php
      puis dans ta fonction javascript
      document.getElementById('sonGenerique').volume=.2;
      document.getElementById('sonGenerique').play();

      c'est fini
      A+ BRUNO

      Répondre
  30. Sylv_01

    Bonjour et merci pour cet excellent tuto, duquel je suis en train de m’inspirer pour faire mon propre projet, à la différence que je dois en plus lire des entrées et les afficher en temps réel sur la page Web…
    Par contre comme je suis une bille en développement Web, j’ai du mal à comprendre pourquoi passer par un fichier php (index.php), qui appelle une fonction javascript (script.js), qui elle-même appelle de nouveau un fonction en php (gpio.php)…
    Pourquoi ne pas effectuer tous les traitements sur les E/S directement depuis le fichier index.php?
    Qu’est-ce qui est exécuté au niveau du navigateur et qu’est-ce qui est exécuté par le serveur, exactement ?
    Désolé pour cette question de noobs mais j’ai du mal à comprendre le mécanisme…

    Répondre

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Complétez ce captcha SVP * Time limit is exhausted. Please reload CAPTCHA.