Un serveur de signature numérique sur un Raspberry Pi : 8 étapes

2024 Auteur: John Day | [email protected]. Dernière modifié: 2024-01-30 09:08

Un guide du débutant absolu en Corse sur un Raspberry PI

Les panneaux numériques sont partout. Vous les voyez dans les aéroports, les centres commerciaux, les grands magasins et même les coins de rue. Vous n'avez pas besoin de beaucoup de matériel personnalisé coûteux pour créer votre propre système de signalisation numérique. Ce Instructable montre comment construire un serveur d'affichage numérique qui peut piloter des dizaines d'écrans. Chaque affichage peut être aussi simple qu'un moniteur et un Raspberry PI.

Grâce aux Node Ninjas de Mozilla, vous pouvez même exécuter le serveur sur un Raspberry Pi en utilisant la Corse.

La Corse est une solution d'affichage dynamique extensible qui peut être implémentée sur la plupart des systèmes POSIX. Il se compose d'un serveur et de clients d'affichage. Les machines clientes ne nécessitent pas de logiciel spécial et exécutent simplement n'importe quel navigateur Web moderne, bien que tous les membres de l'équipe Corse recommandent fortement Firefox. Le serveur consomme très peu de ressources et fonctionnera avec plaisir sur un Raspberry Pi ou une autre très petite machine. Un serveur Corse fonctionnant sur un Raspberry Pi 3+ peut facilement prendre en charge plus de 100 affichages clients. Ces instructions sont écrites spécifiquement pour un Raspberry Pi exécutant le système d'exploitation Raspian (un dérivé de Debian). Ces instructions supposent également que vous utilisez le navigateur Firefox. La plupart des autres navigateurs modernes devraient également fonctionner.

Étape 1: La ligne de commande Raspian

Ces instructions vous montreront comment configurer la Corse via la ligne de commande. Si vous utilisez Raspian avec l'interface utilisateur graphique (GUI), vous accédez à la ligne de commande via l'application de terminal. Si vous utilisez Raspian-lite, vous pouvez connecter un clavier et un moniteur et utiliser directement la ligne de commande, ou vous pouvez vous connecter via le réseau à l'aide de SSH. Pour plus d'informations sur l'activation et l'utilisation de SSH, consultez la documentation Raspian SSH. Vous aurez besoin de connaître le nom DNS ou l'adresse IP de votre Raspberry Pi. Le nom par défaut sur la plupart des réseaux locaux sera raspberrypi.local. Si cela ne fonctionne pas, la documentation de Raspian contient des instructions qui vous aideront à découvrir le nom et l'adresse IP corrects.

Étape 2: Installation du logiciel

La Corse utilise node et npm. Node vous permet d'exécuter Javascript côté serveur et npm est le gestionnaire de packages de nœud.

Pour les installer sur un Raspberry Pi, vérifiez d'abord la version du processeur de votre système:

uname -m

Si le résultat commence par armv6, consultez cet article de blog. Pour les systèmes Raspberry Pi 3 et autres avec processeurs armv7 et versions ultérieures:

curl -sL https://deb.nodesource.com/setup_9.x | sudo -E bash -

sudo apt installer nodejs

Si vous n'êtes pas familier avec Node, vous pouvez en savoir plus sur nodesource.com.

Ensuite, installez les outils de ligne de commande Corse:

sudo npm install -g corsica-cli

Pour voir les commandes disponibles, tapez

corse --aide

Au moment d'écrire ces lignes, les commandes disponibles sont:

setup-- pour configurer un serveur Corsestart [options] -- pour démarrer le serveur Corse restart [options] -- pour redémarrer un serveur Corse en cours d'exécutionstop -- pour arrêter un serveur Corse en cours d'exécutionadd-plugin [nom] -- pour installer un pluginremove- plugin [name] -- pour supprimer un pluginlist-plugins installé -- pour lister les pluginsupdate installés -- pour mettre à jour à la fois la Corse et ses plugins

Vous pouvez maintenant utiliser les outils pour paramétrer le logiciel Corse:

configuration de la corse

Le programme d'installation de la Corse vous demandera où vous souhaitez installer la Corse et vous indiquera l'emplacement par défaut:

Où installer Corse: (/home/pi/corsica-server)

Vous pouvez simplement appuyer sur retour.

Vous verrez des messages d'avertissement npm. Ceux-ci sont sûrs à ignorer.

Lorsque l'installation dit "Terminé!", vous avez installé Corse.

Vous pouvez démarrer la Corse dans votre session de terminal avec:

début corse

Et arrêtez-le avec control-C.

Mais si vous le démarrez de cette façon, il ne fonctionnera que tant que votre session de terminal fonctionnera. Lorsque vous fermez votre terminal session corsica s'arrêtera.

Si vous démarrez Corsica en tâche de fond, il fonctionnera même après la déconnexion de votre session de terminal. Tu peux le faire avec

début corse --background

Pour arrêter l'exécution d'une instance Corse en tâche de fond, saisissez:

arrêt corse

Étape 3: Configuration

Votre configuration nécessitera probablement une certaine personnalisation. Il existe deux types de personnalisation en Corse: la configuration et les paramètres. La configuration est principalement statique et utilisée par le noyau. Les paramètres sont dynamiques et utilisés principalement par les plugins. Plus d'informations sur les paramètres plus tard.

La configuration provient de l'environnement et concerne des éléments très statiques tels que le port à écouter ou les plugins à charger. Il existe quatre sources pour la configuration:

1. lib/config.json - C'est là que les valeurs par défaut sont stockées, et un bon endroit pour voir une partie de ce qui peut être configuré. Vous ne devriez pas modifier les valeurs ici.

2. config.js - Les paramètres trouvés dans ce fichier sont chargés comme s'ils provenaient de l'environnement. La syntaxe est une configuration par ligne, par ex. `PORT=8080`. Si les valeurs ici sont JSON valides, elles seront analysées comme telles. Les paramètres ici remplaceront les valeurs par défaut dans `lib/config.json`. Le fichier config.js précise dans un premier temps le numéro de port sur lequel la Corse écoute, et les plugins utilisés par le système.

3..env - Si le fichier caché nommé.env se trouve dans le répertoire Corse, ses paramètres sont chargés comme s'ils provenaient de l'environnement. La syntaxe est la même que dans config.js. Ce fichier n'existe pas dans la configuration par défaut.

4. Variables d'environnement - Vous pouvez mettre des informations de configuration dans les variables d'environnement système si vous préférez. Si vous n'êtes pas familier avec les variables d'environnement, vous pouvez ignorer cette option en toute sécurité.

Étape 4: Connexion des écrans d'affichage

Une fois que vous démarrez Corse, il exécutera un serveur Web sur le port 8080 de votre machine, sauf si vous avez modifié le numéro de port dans le fichier.env. Vous aurez besoin de connaître le nom d'hôte ou l'adresse IP de votre Pi. Le nom par défaut d'une nouvelle installation de Raspberry Pi est raspberrypi. Si vous ne l'avez pas modifié, vous pouvez simplement ouvrir un navigateur sur votre ordinateur client d'affichage et accéder à:

raspberrypi.local:8080

Vous devriez voir le logo Corse jaune et noir. Une bulle apparaîtra avec le nom Corse de votre client. Vous pouvez (et devez) changer le nom de votre client en quelque chose qui indique l'emplacement de cet écran d'affichage particulier. La façon la plus simple de le faire est d'utiliser le corsica-repl de Potch. (Potch est l'un des principaux développeurs de la Corse, et il a promis de mettre la réinstallation au cœur de la Corse très bientôt).

Ouvrez un onglet de navigateur et accédez à:

potch.github.io/corsica-repl?server=https://raspberrypi.local:8080/

(Cela suppose que raspberrypi.local est le nom de votre serveur Corse).

Nous utiliserons "TestClient" comme nom d'affichage du client pour le reste de ce didacticiel. Accédez au menu déroulant dans le coin inférieur droit de l'écran et recherchez le nom du client qui s'est affiché. Puis dans la ligne de commande en bas à gauche de l'écran tapez:

admin type=renommer=TestClient

Laissez l'onglet corsica-repl ouvert et passez à l'onglet du navigateur affichant le logo Corse et actualisez la page. Vous verrez le nouveau nom dans la bulle contextuelle. S'il disparaît trop rapidement, passez votre souris dans le coin inférieur droit et le bouton "Plein écran" apparaîtra avec le nouveau nom à gauche.

Étape 5: Ajouter du contenu

Après avoir affiché le logo Corse le client affichera des animaux de dessins animés sur fond bleu.

La balise par défaut du fichier state.json contient une liste d'adresses de pages Web. Vous pouvez ainsi présenter n'importe quelle page Web, même si la mise en page de certaines pages les rend moins adaptées à une utilisation avec la Corse.

Un client Corse affiche le contenu d'une ou plusieurs balises auxquelles il est abonné. Les nouveaux clients viennent déjà abonnés à un tag nommé "default".

Les animaux de dessins animés sont mignons, mais ajoutons du contenu utile à la rotation de l'écran sur notre client de test.

Retournez dans l'onglet corsica-repl et dans la ligne de commande en bas à gauche tapez:

admin type=subscribe tag=météo

Revenez à l'onglet client d'affichage et actualisez la page.

Une prévision météorologique pour San Jose, Californie, sera ajoutée à la liste des URL affichées.

Notre exemple de fichier state.json contient trois balises nommées "default", "weather" et "images". La balise "images" contient des liens vers d'autres fichiers de dessins d'animaux (.png). Ajoutons-les en revenant à l'onglet corsica-repl et en tapant:

admin type=subscribe tag=images

Encore une fois, revenez à l'onglet client d'affichage et actualisez la page. Vous verrez de nouveaux animaux ajoutés à la rotation. Mais notez que les nouveaux animaux apparaissent sur le bord gauche de la page avec un fond blanc. C'est parce que les dessins animés sur fond bleu sont répertoriés dans state.json en tant qu'URL pointant vers une page Web appropriée écrite en html. Les nouveaux dessins animés avec des arrière-plans blancs sont répertoriés dans state.json en tant qu'URL qui pointent simplement vers les fichiers graphiques-p.webp

On peut améliorer l'affichage de ces graphismes par la Corse, mais pour cela il va falloir « étendre » la Corse elle-même.

Étape 6: Étendre la Corse

Plus d'une dizaine de plugins npm Corse sont disponibles sur le site npm. Suivez ce lien et entrez « corse » dans le champ de recherche en haut de la page pour en voir la liste. Nous utiliserons l'un de ces plugins npm pour vous permettre d'afficher nos nouveaux animaux. Il est également utile d'afficher n'importe quelle image que vous trouvez sur le Web, sans afficher de graphiques gênants autour de l'image.

Allez dans la ligne de commande Corsica, arrêtez Corsica et installez le plugin corsica-image:

corsica add-plugin corsica-image

Redémarrez ensuite la Corse:

début corse

Ouvrez l'onglet client corsica display sur votre navigateur et actualisez la page. Vous devriez voir les nouveaux animaux affichés centrés sur l'écran avec un fond bleu foncé.

Étape 7: personnalisation du contenu

Jetons un coup d'œil à la différence entre ce que font les URL de la balise par défaut et celles de la balise images. Jetez un œil à state.json en accédant à la ligne de commande Corsica et en tapant:

chat ~/corsica-server/state.json

Dans la section "par défaut" de ce fichier, vous trouverez une ligne qui ressemble à:

"https://ramilewski.github.io/corsica-support/show.html?image=kitty.png", Cette URL est un lien vers une page Web avec un dessin animé d'un chaton. Cette page Web affiche une image, mais elle fournit également un arrière-plan qui est un dégradé qui commence en haut de la page en bleu et passe au blanc en bas de la page. Cet arrière-plan est créé par le CSS et le HTML de la page Web. Il ne fait pas partie du graphique lui-même.

Les sections « images » de la page ont une ligne qui ressemble à:

"https://ramilewski.github.io/corsica-support/bunny.png bg=#2244BB", Il s'agit d'une URL qui spécifie un lien vers l'image-p.webp

"#2244BB" est une notation hexadécimale pour une couleur bleu foncé. Pour un outil vous aidant à spécifier n'importe quelle couleur en notation hexadécimale, consultez le Sélecteur de couleurs MDN.

En affichant cette ligne, la Corse a utilisé le plugin corsica-image pour rendre l'affichage. Cela signifie que si vous trouvez une image que vous souhaitez afficher sur vos écrans clients Corse, vous pouvez créer une ligne dans state.json qui affichera uniquement cette image, mais aucun autre contenu distrayant de la page environnante. Pour trouver l'url d'une image dans Firefox, faites un clic droit sur l'image et sélectionnez "Copier l'emplacement de l'image" dans le menu contextuel qui apparaît.

La section "météo" de state.json n'a qu'une seule URL. Cela récupère une prévision météo de https://forecast.io. Mais à moins que vous ne viviez à San José, cette prévision n'est pas très utile. Pour obtenir une prévision de votre position, vous devez connaître sa latitude et sa longitude en degrés décimaux. Si vous ne le faites pas, il existe un outil Web qui vous permettra de le trouver.

À l'heure actuelle, l'URL dans la ligne dans state.json qui spécifie les prévisions météorologiques ressemble à:

"https://forecast.io/embed/#lat=37.3352&lon=-121.8871&name=San%20Jose%20CA&color=#4466bb zoom=300"

Pour obtenir les prévisions pour votre emplacement, modifiez les entrées de latitude et de longitude dans cette ligne et remplacez le nom par votre emplacement. Utilisez %20 au lieu d'espaces dans le nom de lieu. Le paramètre color spécifie la couleur des barres entre les températures hautes et basses. Le paramètre de zoom est utilisé pour ajuster la taille de la prévision pour qu'elle s'adapte à l'écran d'affichage.

Lorsque vous créez votre propre fichier state.json, n'oubliez pas que si vous avez une balise "par défaut", tout contenu spécifié dans cette balise apparaîtra sur tout navigateur qui se connecte au serveur sans autre configuration.

Affichage de la synchronisation

En haut de state.json, certains paramètres contrôlent la durée d'affichage de chaque image à l'écran.

"paramètres::timer": {

"resetTime": 30000, "jitter": 5000, Tous les temps sont mesurés en millisecondes (millièmes de seconde). Le resetTime est la durée maximale d'affichage de chaque image à l'écran avant l'affichage de l'écran suivant. La gigue est multipliée par un nombre aléatoire entre -1 et 1 et le résultat est ajouté à resetTime. Cela offre une certaine variété dans les temps d'affichage. Vous pouvez régler la gigue sur 0 si vous le souhaitez. Les paramètres affichés entraîneront l'affichage de chaque page pendant 25 à 35 secondes.

Vous pouvez également définir des heures différentes pour chaque client d'affichage:

"paramètres::timer": {

"resetTime": 30000, "jitter": 5000, "resetOnConnect": true, "screens": { "TestClient": { "resetTime": 10000, "jitter": 1000 } } }, Ici, nous avons défini le temps d'affichage de notre TestClient entre 9 et 11 secondes.

Étape 8: Conclusion

Nous avons montré comment installer et configurer un serveur Corse sur un Raspberry Pi. Avec ce que vous avez appris ici, vous pouvez créer un système d'affichage dynamique polyvalent et à très faible coût. Vous pouvez utiliser Raspberry Pis non seulement comme serveur dans votre système, mais également pour piloter les affichages client.

Il existe de nombreux autres plugins sur le site npm que vous pouvez utiliser pour ajouter d'autres fonctionnalités à votre installation Corse, notamment l'affichage:

• Images de Flickr
• Tweets
• Conversations dans un canal IRC
• Fichiers vidéo
• Vidéos youtube
• Diapositives dans les présentations Google
• Dessins animés XKCD
• Contenu d'un flux RSS

Crédits

La Corse est la création des Node Ninjas ceinture noire de troisième degré de Mozilla dirigés par potch, lonnen et mythmon.

Ces instructions pour la Corse sur Raspberry Pis ont été bricolées par Richard.

Vous pouvez généralement trouver tout le monde qui rôde autour de la chaîne #corsica sur irc.mozilla.org.