Serveur d'impression

Afficher les données série sur une page Web – Utilisation de scripts PHP ou Python – Bien choisir son serveur d impression

Le 1 août 2019 - 11 minutes de lecture

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?

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.

Figure 1: Le fichier PHP dynamique généré par PHP
le script est servi par un serveur web WAMP à notre navigateur
(voir sa barre d'adresse). Il présente le séparé par des virgules
valeurs lues à partir des données du port série dans une table de base.
Les valeurs inférieures à 500 sont imprimées en rouge, les autres en vert.
Le titre de la fenêtre d'invite de commande affiche le
commande pour exécuter le script.

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 "", $ page_title,""; // commence la tête.
écho "";
écho "";
écho "";
écho "";
écho "";
écho ""; // tête.
écho "

"; // le corps commence.

é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 "

";
écho "

";
foreach ($ numbers comme $ x => $ x_value)

écho "

"; // La ligne de la table commence.
écho "

"; // colonne de table 1.
écho "

"; // fin de la colonne 2 du tableau.
écho "

"; // Fin de la ligne du tableau.

// fin de table.
é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.
?>

Figure 2: Cette fois, un script Python génère un fichier HTML dynamique (comme indiqué dans la barre d’adresse du navigateur).

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.

série d'importation
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 (""+ page_title +"") # Page & Head commencent.
fo.write ("")
fo.write ("")
fo.write ("")
fo.write ("")
fo.write ("")
fo.write ("

"+ page_title +"

") # La tête, le corps commence.

# Table commence.
fo.write ("

")
fo.write ("

")
pour i dans la plage (0, len (data_list), 2):
fo.write ("

") # La rangée commence.
fo.write ("

") # Colonne de la table 1.
fo.write ("

") # Table column 2 end.
fo.write ("

") # Fin de la ligne du tableau.
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.

Figure 3: Cette esquisse Arduino génère un flux de données série qui
peut être utilisé pour le développement, le débogage et les tests de scripts.

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

Votre commentaire sera révisé par les administrateurs si besoin.