Affichage WebCam sur site Web

Bien le bonjour en ce vendredi soir

Préembule

Suite à une question sur un forum, j’ai eu envie de retester un truc d’autrefois. Vous vous souvenez de l’article Affichage RaspiCam depuis serveur FTP écrit en 2017 ?
(Oui, je crois que mon site à de l’audience et que des internautes me suivent depuis des années. Enfin, mon autre moi essaye de s’en persuader pour se rassurer)

Mise en contexte

Là, l’idée de la personne est un peu différente, mais comporte la partie où il faut envoyer une image à intervalle régulier sur un site Web via FTP.

Du coup, je me suis repenché sur la chose en 2025 en prenant en compte les évolutions matérielle et un peu plus de sécurité.

Bon, j’ai des modules caméras V2 et V3 de dispo mais comme je suis sur un Raspbérry Pi Zéro et que je n’ai plus de nappe de dispo, je pars sur l’idée de la WebCam (j’en ai qui traînent).

Matériel

Raspberry Pi Zéro v1.3 (acheté 5,22€ à l’époque)
Alimentation de fabrication maison (un adaptateur secteur modifié en micro-USB)
Adaptateur microUSB vers USB
Adaptateur USB vers RJ45 avec 3 ports USB non utilisé par enfant N°1
WebCam de récupération

Concept

On veut que le RaspberryPi démarre à la mise sous tension puis réalise une photo toutes les X minutes et l’envoie via sFTP (FTP version Sécurisé) pour être affichée sur une page Web.

Ceci est le concept de base et j’ai dû contourner certains soucis dits « de la vie réelle ».
J’en causerai par la suite.

Mise en place

Il faut installer RasbperryPiOS BookWorm en version Lite

Ensuite mise à jour avec sudo apt update et sudo apt upgrade si besoin puis on installe fswebcam avec

sudo apt install fswebcam

Et, avant de passer à la suite, on teste avec :

fswebcam -r 640x480 -S 9 --jpeg 100 /home/alban/test.jpg

C’est OK ?
On passe à la suite.
(perso, je fais tout en SSH car ni écran ni clavier sur le RaspberryPi donc je vérifie la photo en me connectant en SFTP via mon explorateur de fichiers pour avoir un retour graphique simple et efficace (je n’utilise que du Linux, mais j’imagine que Windows sait le faire).

Bon, maintenant qu’on est sûr que ça fonctionne, on passe à la partie « transfert » avec un client FTP et un script de transfert.

Le vieux « FTP » est obsolète donc on va lui préférer lftp (vous pouvez lire la page sur wikipedia ou sur le wiki ubuntu pour plus d’info)

sudo apt install lftp

Il reste à utiliser lftp avec un script… et comme on est fainéant (donc efficace voire efficient), on va tout faire d’un coup.

Pour gagner du temps, je vous colle la partie terminale et pas le cheminement.
Mais j’explique après ! 😀

Création du script bash

nano transfert.sh

Et on y colle ceci (attention, adaptez la partie « Variables à personnaliser »)

#!/bin/bash

# Variables à personnaliser
HOST='ftp.XXXXXXX.hosting.ovh.net'
PORT='22'
USER='YYYYYYY'
PASSWD='ZZZZZZZZZZZZ'
REMOTEPATH='/home/YYYYYYYY/www/rasp'
time=$(date +"%d-%m-%Y_%H:%M")

# Prendre la photo
fswebcam -r 640x480 -S 9 --title "WebCam en direct" --subtitle "TREVILLY.COM" --timestamp "$time" --info "Réalisé avec un RaspberryPi" --font /usr/share/fonts/truetype/dejavu/DejaVuSans-Bold.ttf:24 --banner-colour "#808080" --line-colour "#FFFFFF" -S 9 --jpeg 100 /home/alban/"$time".jpg

# Générer le fichier HTML
cat <<EOF > /home/alban/index.html
<!DOCTYPE html>
<html>
<head>
  <title>Derniere image webcam</title>
  <meta http-equiv="refresh" content="60" />
</head>
<body>
  <p>Page en rafraichissement automatique chaque minute. Wait and See ;-)</p>
  <img src="$time.jpg" alt="Derniere image de la WebCam"/>
</body>
</html>
EOF

# Envoyer la photo via FTP avec lftp
lftp -u $USER,$PASSWD sftp://$HOST:$PORT <<EOF
#lftp -u $USER,$PASSWD $HOST <<EOF
cd $REMOTEPATH
put /home/alban/"$time".jpg
put /home/alban/index.html
bye
EOF

exit 0

Application des droits à ce fichier

chmod +x /home/alban/transfert.sh

Explications et contournement des soucis

Pour faire simple, je voulais que ma photo soit nommée par la date et l’heure mais que la page affiche toujours la dernière image.

J’avais donc mis une fonction pour faire une copie de l’image en « last.jpg » afin que la page web affiche toujours l’image « last.jpg ».
Sauf que le refresh (ou rafraichissement) de la page ne fonctionnait pas (ou pas de manière transparente).

Bon, je ne sais pas vraiment faire donc j’ai trouvé une idée « dans ma tête ». Les spécialistes trouveront peut-être ça stupide, mais c’est ma solution de contournement qui me laisse croire (enfin, à l’autre, vous savez, celui qui croit que des gens lisent ses articles) que je suis intelligent… 🙂

« L’intelligence ce n’est pas ce que l’on sait mais ce que l’on fait quand on ne sait pas.«
Jean Piaget

Donc, finalement, l’idée a été de prendre une photo et de la nommer avec date et heure comme au départ et de réutiliser cette variable pour créer la page web après chaque photo et d’envoyer la photo + la page web à chaque fois.

Ouais, c’est con, mais ça fonctionne bien 😀

Automatisation

On veut réaliser une photo toutes les minutes donc il suffit de définir une tâche cron :

crontab -e

Et d’y insérer :

*/1 * * * * /home/alban/transfert.sh

Ce délai explique que j’ai paramétré le refresh de la page web toutes les 60 secondes.
(Spoiler Alert : 1 minute = 60 secondes. Mais Chuuuut…)

Conclusion

Bon, ben voilà, j’ai encore perdu du temps (le faire, le tester et écrire cet article) sur un truc que ne sert à rien, sauf à me prouver que je pouvais le faire et à éventuellement servir à quelqu’un qui cherche à le faire sans l’expérience qui est la mienne.
(Dans mon contexte personnel, expérience = temps perdu à tester des tas de choses, souvent sans savoir ni tout comprendre)

Si cet article vous a été utile = je n’ai pas perdu mon temps 😉