Sommaire
Parfois, il peut être utile de visualiser un flux continu de données arrivant via une connexion série sous forme de page Web dans un navigateur. Mais comment allez-vous? Pouvons-nous suggérer un peu de script?
En gros, le problème consiste à créer périodiquement une page Web contenant les dernières données de série. Un navigateur Web peut alors afficher la page, que ce soit sur le même ordinateur ou sur un réseau. Par conséquent, vous avez besoin d’un petit programme qui convertit en permanence les données série en fichiers HTML ou PHP, par exemple. Aha! PHP n’est-il pas un langage de programmation pour les applications Internet? Oui, ça l'est. Alors, pouvons-nous utiliser PHP pour faire le travail? Oui nous pouvons. Mais il y a aussi d'autres moyens, comme nous le verrons.
Utiliser l'actualisation automatique de la page
Tout commence par rappeler que HTML permet l'utilisation d'une balise méta qui indique au navigateur de recharger une page périodiquement:
Cette balise indique au navigateur de recharger la page contenant la balise toutes les dix secondes. (Si votre navigateur ne supporte pas cette balise, elle peut être remplacée par un morceau de JavaScript. Voir le téléchargement gratuit ci-dessous cet article. Si nous créons une page Web qui inclut cette balise et que nous pointons le navigateur dessus, ce dernier continuera à le recharger toutes les dix secondes (le délai d’expiration peut bien entendu être une autre valeur). Si nous réécrivons la page toutes les dix secondes et y introduisons de nouvelles données série, le navigateur l'affichera également.
Diviser la tâche en deux
Il est également possible de placer la balise de rafraîchissement dans un fichier PHP au lieu d'un fichier HTML et le navigateur fera la même chose. Le fichier PHP pourrait alors aussi contenir un script pour lire les données du port série. C’est là que les choses se compliquent car PHP ne supporte pas nativement les ports série. Et même si cela se produisait, cela signifierait que chaque fois que le navigateur demande la page (la dernière version), le script devrait ouvrir le port série, obtenir des données et refermer le port. Les données reçues en dehors de cette fenêtre sont perdues. De plus, certains systèmes de type Arduino peuvent être réinitialisés à l'ouverture du port série, rendant la configuration inutile. Une solution consiste à scinder le processus en deux sous-processus:
[bullet list]
– Processus 1: Un script pour lire en permanence le port série et mettre à jour un fichier de données importé par la page Web PHP, voir Listing 1.
Liste 1: Un script PHP qui lit les données du port série et les écrit dans un fichier nommé "data.txt".
// Linux $ comPort = "/ dev / ttyACM0";
$ comPort = "COM15";
inclure "php_serial.class2.php";
$ serial = new phpSerial;
$ serial-> deviceSet ($ comPort);
// Sous Windows (seulement 10?), Tous les paramètres de mode doivent être effectués en une fois.
$ cmd = "mode". $ comPort. "baud = 115200 parité = n données = 8 stop = 1 à = éteint xon = éteint";
$ serial -> _ exec ($ cmd);
$ serial-> deviceOpen ();
echo "En attente de données … n";
dormir (2); // Attend qu'Arduino ait fini de démarrer.
$ serial-> serialflush ();
tandis que (1)
$ read = $ serial-> readPort ();
if (strlen ($ read)! = 0)
$ fp = fopen ("data.txt", "w");
si ($ fp! = false)
fwrite ($ fp, trim ($ read));
fclose ($ fp);
?>
– Processus 2: Un navigateur qui recharge périodiquement la page Web PHP afin d’actualiser les données, voir Listing 2 et figure 1.
Liste 2: Cette page Web PHP formate le contenu d'un fichier nommé "data.txt" sous forme de tableau..
$ page_title = "Arduino sur PHP";
// Début de la page HTML.
écho "";
écho ""; // La page commence.
écho "
écho "";
écho "";
écho "";
écho "";
écho "";
écho ""; // tête.
écho "
écho "
", $ page_title,"
"; // Titre de la page.
// Crée une table à partir d'un fichier de données.
$ handle = fopen ("data.txt", "r");
si ($ handle! = NULL)
// Lire une ligne du fichier, puis fermez-le.
$ data = fgets ($ handle);
fclose ($ handle);
// Synchroniser avec les données.
si ($ data[0]== '$')
// Supprime les espaces.
str_replace ('', '', $ data);
// Fractionner les données dans des champs séparés par ','.
// Format attendu: "$, id1, valeur1, id2, valeur2, CRLF"
liste ($ startchar, $ id1, $ valeur1, $ id2, $ valeur2, $ nouvelle ligne) = exploser (",", $ data);
// Crée un tableau à partir d'une liste.
$ numbers = array ($ id1 => $ valeur1, $ id2 => $ valeur2);
// Trie un tableau dans l'ordre croissant des clés.
ksort ($ nombres);
// Table begin.
écho "
ID | Valeur |
---|---|
", $ x" | "; // La colonne de table 2 commence. if ($ x_value> = 500) echo ""; sinon echo ""; echo $ x_value; écho " |
";
écho ""; // extrémité du corps.
écho ""; // Fin de page.
?>
Oups, il faut un serveur web…
Cela résout le problème d'ouverture et de fermeture du port série et la perte de données qui en résulte, mais nécessite l'exécution d'un script en arrière-plan. S'il s'agit d'un script PHP, l'ordinateur doit être capable d'exécuter des scripts PHP. En outre, vous avez besoin d'un serveur Web pour alimenter la page Web PHP avec un navigateur. Sinon, le navigateur affichera simplement le code PHP constituant la page à la place de la page elle-même. Pour ce faire, la méthode traditionnelle consiste à installer un package dit «AMP» ou «WAMP». AMP signifie Apache-MySQL-PHP, le «W» est pour Windows et forment ensemble un serveur Web tout en chant et en danse.
N'utilisez pas PHP…
Nous avons essayé cette méthode et avons réussi à la faire fonctionner, mais pas sans problèmes. Outre les difficultés de configuration du serveur Web, le principal problème que nous avons rencontré était de faire en sorte que PHP ouvre de manière fiable un port série pour recevoir les données. En recherchant sur Internet, il ne semble exister qu'une seule bibliothèque PHP pour les communications en série, PHP Serial. Tous les autres semblent en avoir été dérivés. Comme l'auteur le mentionne sur la page GitHub “Windows: cela semble fonctionner pour certaines personnes, pas pour d'autres.«Nous étions clairement dans le deuxième groupe. Pour que les communications série fonctionnent avec PHP, nous avons d'abord dû ouvrir et fermer immédiatement le port avec un programme de terminal série (Tera Term par exemple); impossible de l'obtenir autrement. Nous avons donc abandonné la méthode PHP et opté pour Python.
… Utilisez plutôt Python
Python 3 avec pySerial s’est avéré parfaitement fonctionner sur notre ordinateur de test Windows 10; nous avons donc écrit un script pour lire les données du port série et écrire la page Web contenant ces données. Maintenant que PHP n’est plus nécessaire, le script Python peut également produire un fichier HTML simple. Listing 3.
Liste 3: Un script Python qui lit les données du port série et génère un fichier HTML pour ce dernier.
temps d'importation
nom_fichier = "serial.html" # Une fois créé, ouvrez ce fichier dans un navigateur.
# Adapter le numéro de port série. & débit en bauds à votre système.
serial_port = 'COM15'
vitesse de transmission = 115200
page_title = "Arduino sur Python";
def write_page (data_list):
fo = open (nom_fichier, "w +")
# Début de la page HTML.
fo.write ("")
fo.write ("
fo.write ("")
fo.write ("")
fo.write ("")
fo.write ("")
fo.write ("")
fo.write ("
"+ page_title +"
") # La tête, le corps commence.
# Table commence.
fo.write ("
ID | Valeur |
---|---|
"+ liste de données[i]+ " | ") # La colonne 2 de la table commence. fo.write ("<font color = '") # Les valeurs> = 500 seront imprimées en vert, les plus petites seront en rouge. if (int (liste de données)[i+1])> = 500): fo.write ("vert") else: fo.write ("rouge") fo.write ("'>") fo.write (liste_données[i+1]) fo.write (" |
") # Table end.
fo.write ("") # Extrémité du corps.
fo.write ("") # Fin de page.
# Terminé, ferme le fichier.
fo.close ()
s = serial.Serial (serial_port, baudrate) # Port série ouvert.
s.dtr = 0 # Réinitialiser Arduino.
s.dtr = 1
print ("En attente de données …");
time.sleep (2) # Attendez que Arduino ait fini de démarrer.
s.reset_input_buffer () # Supprime toutes les données obsolètes.
tandis que 1:
data_str = s.readline (). decode () # Lire les données et convertir les octets en type chaîne.
# Nettoyer les données d'entrée.
# Format attendu: "$, id1, valeur1, id2, valeur2, …, CRLF"
data_str = data_str.replace ('', '') # Supprime les espaces.
data_str = data_str.replace (' r', '') # Supprimer le retour.
data_str = data_str.replace (' n', '') # Supprime la nouvelle ligne.
data_str + = '123,65,1,999, cpv, 236' # Ajoutez quelques données supplémentaires
print (data_str)
# Fractionner les données dans des champs séparés par ','.
data_list = data_str.split (",")
del data_list[0] # Supprimer '$'
# Ecrire une page HTML.
write_page (data_list)
Toute la mise en forme des données effectuée par la page Web PHP peut être faite directement en Python. Tout est maintenant au même endroit. La page Web peut toujours être servie par un serveur Web (jeu de mots), mais un navigateur peut également afficher et actualiser la page sans en avoir un. Par conséquent, un package (W) AMP n’est plus nécessaire non plus, ce qui simplifie grandement les choses.
Sonnant
Dans cet article, nous avons présenté une méthode d'affichage de données série dans un navigateur Web. La méthode n'est ni nouvelle, exclusive, ni "la meilleure". Si vous connaissez une autre façon – plus simple, plus élégante, peu importe – partagez-la avec nous en utilisant le Ajouter un commentaire bouton ci-dessous. Et bien sûr, vous n’avez pas besoin de Python pour écrire le script, n’hésitez pas à utiliser un langage de programmation capable d’effectuer des communications en série et d’écrire des fichiers. L'avantage d'utiliser Python avec pySerial est qu'il s'exécutera sur des machines Windows, macOS et Linux (et plus).
Le code développé pour cet article sous forme de scripts PHP et Python, ainsi qu'un sketch Arduino peuvent être téléchargés ci-dessous.
(170111)
Voulez-vous lire plus d'articles ElektorLabs? Devenez membre Elektor maintenant!
Commentaires
Laisser un commentaire