Deblan blog

Futilités de Geek

Afficher une webcam sur son site (version Linux)

Il y a déjà un article pour afficher sa webcam sur une page web mais en plus d'être un peu à la rue, il ne fonctionne pas sur Linux.

Nous allons voir comment intégrer une webcam sur son site web sous Linux.

Il nous faut :

  • Un serveur web
  • Un accès SSH
  • Une webcam
  • Un ou deux logiciels en local

Note : je travail sur Debian, il faut donc transposer mes commandes pour votre distribution.

Étape 1 : les logiciels en local
# aptitude update
# aptitude install openssh-client vgrabbj rsync imagemagick screen
  • openssh-client : notre client SSH
  • vgrabbj : il permettra de capturer les images de la webcam
  • rsync : il sera notre outil d'upload d'image et va s'appuyer sur SSH
  • imagemagick : pour faire un traitement sur l'image (ajouter du texte)
  • screen : pour lancer le script sans monopoliser un terminal
Étape 2 : préparation des répertoires de travail

On va créer un répertoire qui accueillera le script et la capture :

# le répertoire du script
$ if [ -d "$HOME/bin" ] || mkdir "$HOME/bin"
# le répertoire de la capture
$ if [ -d "$HOME/.webcam" ] || mkdir "$HOME/.webcam"

Création du fichier :

$ cd "$HOME/bin"
$ touch webcam
$ chmod +x webcam
Étape 3 : Et on édite le script

Je propose de faire ça en simple shell, donc pas de bash mais un bon vieux sh (ou dash sur Debian).

#!/bin/sh

On prépare des variables de configuration :

# Le login et le serveur
SSH_SERVER="simon@exemple.com"
# Des options à passer au client SSH
# -p indique le port de connexion
# -i permet de paramétrer une clé SSH
SSH_OPTIONS=" -p 22 -i $HOME/.ssh/id_dsa" 

# Chemin vers l'image que va générer la webcam
IMG_LOCAL="$HOME/.webcam/webcam.jpg"

# Le chemin de l'image sur le serveur distant
IMG_REMOTE="/services/web/www/exemple.com/public_html/ressources/webcam.jpg"

# Qualité de l'image générée (de 1 à 100 et plus c'est grand, plus c'est zoli)
IMG_QUALITY=75

# Les dimensions de l'image
# sqcif= 128x96,     qsif = 160x120,
# qcif = 176x144,    sif  = 320x240,
# cif  = 352x288,    vga  = 640x480,
# svga = 800x600,    xga  = 1024x768,
# sxga = 1280x1024,  uxga = 1600x1200
IMG_SIZE=sif

# Je vais afficher du texte sur l'image donc je paramètre sa couleur et sa position
IMG_TEXT_COLOR=black
IMG_TEXT_X=8
IMG_TEXT_Y=16

# Le périphérique webcam à utiliser
VIDEO_INPUT=/dev/video0

# Le temps entre deux captures (en secondes)
WAIT=5

# la fonction text va retourner le texte à afficher sur la webcam
text() {
	# ça donnera : login @ mm/jj/aa hh:mm:ss
	echo "$USER @ $(date +'%D %r')"
}

On ajoute une sécurité : ne pas avoir deux scripts qui tente un accès à la webcam en même temps :

LOCK="$HOME/.webcam/.lock"

while [ -f "$LOCK" ]; do
	sleep 1
done

touch "$LOCK"

On termine par les commandes de capture, d'écriture du texte et d'upload :

# On capture l'image
vgrabbj -i "$IMG_SIZE" -f "$IMG_LOCAL" -d "$VIDEO_INPUT" -q "$IMG_QUALITY" -a 3 -n

# On ajoute le texte
mogrify -fill "$IMG_TEXT_COLOR" -pointsize 11 -annotate +"$IMG_TEXT_X"+"$IMG_TEXT_Y" "$(text)" "$IMG_LOCAL"

# On upload 
rsync -avz -e "ssh $SSH_OPTIONS" "$IMG_LOCAL" "$SSH_SERVER":"$IMG_REMOTE"
# Note : certains seront peut-être plus à l'aise avec scp, c'est comme vous voulez

On termine par boucler tout ça :

# on délock l'accès à la webcam
rm -f "$LOCK"

# On fait attendre un peu le script
sleep $WAIT

# On l'exécute lui-même 
"$0"&

# Et on arrête l'exécution courante
exit 0

Le script complet (sans commentaire) :

#!/bin/sh

SSH_SERVER="simon@exemple.com"
SSH_OPTIONS=" -p 22 -i $HOME/.ssh/id_dsa" 

IMG_LOCAL="$HOME/.webcam/webcam.jpg"

IMG_REMOTE="/services/web/www/exemple.com/public_html/ressources/webcam.jpg"

IMG_QUALITY=75
IMG_SIZE=sif
IMG_TEXT_COLOR=black
IMG_TEXT_X=8
IMG_TEXT_Y=16

VIDEO_INPUT=/dev/video0

WAIT=5

text() {
	echo "$USER @ $(date +'%D %r')"
}

LOCK="$HOME/.webcam/.lock"
 
while [ -f "$LOCK" ]; do
	sleep 1
done

touch "$LOCK"

vgrabbj -i "$IMG_SIZE" -f "$IMG_LOCAL" -d "$VIDEO_INPUT" -q "$IMG_QUALITY" -a 3 -n
mogrify -fill "$IMG_TEXT_COLOR" -pointsize 11 -annotate +"$IMG_TEXT_X"+"$IMG_TEXT_Y" "$(text)" "$IMG_LOCAL"
rsync -avz -e "ssh $SSH_OPTIONS" "$IMG_LOCAL" "$SSH_SERVER":"$IMG_REMOTE"

rm -f "$LOCK"

sleep $WAIT
"$0"&
exit 0
Étape 4 : la page html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ma webcam</title>
<script>
// Deux helpers pour attacher un évenement à un object et un selecteur rapide d'élement par id
var addEvent = function(object, eventName, myFunction) {
	if(object.addEventListener) {
		object.addEventListener(eventName, myFunction, false);
	} else if(object.attachEvent) {
		object.attachEvent('on'+eventName, myFunction);
	}
}
var $ = function(id) {
	return document.getElementById(id);
}

// On ne veut pas de clignottement donc entre chaque
// chargement d'image, on attend que celui-ci soit 
// terminé pour mettre à jour l'image dans la page
var image_reload = function(id, time) {
	var img = $(id);
	if(img) {
		var _img = new Image();
		var src = (img.getAttribute('src')).split('?')[0]+'?'+Math.random();
		_img.src = src;
		addEvent(_img, 'load', function() {
			img.setAttribute('src', src);
		});
		window.setTimeout(function() {
			image_reload(id, time);
		}, time);
	}
}

addEvent(window, 'load', function() {
	// id de l'image de la webcam et temps de rafraissement
	image_reload('webcam', 2000); 
});
</script>
<body>

<p><img id="webcam" src="/ressources/webcam.jpg" alt="" title="" /></p>

</body>
Étape 5 : lancer le script
$ screen
$ ./bin/webcam

C'est terminé :)


Sources du blog

Comme je l'avais indiqué il y a quelques semaines, je souhaite libérer les sources du moteur de ce blog.

La publication de code n'implique pas de ma part un support technique. Je ne suis pas responsable si une faille de sécurité est utilisée à travers mon code.

Pour être honnête avec vous, il n'est pas du tout terminé mais il est fonctionnel. Je n'ai aucune prétention a dévoilant les sources.

Il y a encore des traces de moi dans le code. Je vous invite à faire le tour du module "page" présent dans le répertoire "apps/www/".

Pour télécharger et installer le blog, suivant les instructions suivantes :

1. Configurer votre virtualhost

Configurer votre virtualhost pour que le domaine du blog pointe sur le répertoire "web" présent dans le zip (que vous allez bientôt télécharger)

2. Se place dans le répertoire du site puis :
$ wget https://www.deblan.io/uploads/sources_blog.zip
$ unzip sources_blog.zip
3. Configurer les accès à la base

Il faut éditer le fichier "config/database.yml".

N'utiliser pas des tabulations mais des espaces.
[...]
dsn:        mysql:dbname=NOM_BASE;host=localhost
username:   UTILISATEUR
password:   MOT_DE_PASSE
[...]
4. Lancement de la "procédure" d'installe du blog :
# on vide le cache
$ ./symfony cc
# on crée les tables pour la base de données
$ ./symfony propel:build-all
$ mysql -uUTILISATEUR -p NOM_BASE < data/sql/permissions.sql
# création de l'admin
$ ./symfony guard:create-user admin password
$ ./symfony guard:promote admin
$ ./symfony guard:add-permission admin Rédaction
$ ./symfony guard:add-permission admin Administrer

Le design est cassé (web/css/main.css est vide). Je vous invite à faire le votre.

J'avoue c'est un peu posté à l'arrache mais je n'ai pas spécialement le temps de faire mieux en ce moment :)

Note : on accède au backoffice via /admin.php

Enjoy!


J'ai besoin de dons

C'est une journée grave aujourd'hui, j'ai découvert (trois ans après sa sortie) LE fauteuil qu'il me faut !

C'est un peu le paradis pour le geek, mais il a un coût (40K$). Ainsi, je demande à mes chers lecteurs (si si y'en a un ou deux) de me donner moulte argent pour que cet été je puisse me l'offrir :D

Je suis certain que vous comprendrez ma démarche :-°


Mettre en place un firewall sur une machine de bureau sous Linux

L'installation d'un firewall sur une machine est primordiale, quelque soit la façon d'utiliser sa machine (machine de travail, machine de jeu, serveur, etc.).

Seulement, ce n'est pas évident de trouver l'outil idéal et accessible pour mettre en place un firewall. Personnellement, j'utilise iptables partout où je peux. Sur mes serveurs, j'ai un script qui balance sur série de règles pour bloquer ou ouvrir l'accès à des services, faire des ban ip, etc. J'ai également des outils comme fail2ban pour virer les bourrins qui tentent des accès en brute force sur mes services. Ces règles iptables sont longues à mettre en place car la syntaxe n'est pas simple du tout. La documentation est ample mais complexe.

Sur les machines de bureau, il existe un tas d'outils plus ou moins évolués et complets, plus ou moins accessibles. Dans tout ces outils ressort Firestarter.

Firestarter est un outil graphique qui permet de constuire un ensemble de règles en fonction des interfaces réseaux disponibles et activées sur son système. Il se base sur iptables pour finaliser les configurations.

Il offre aussi des outils qui permettent de connaître facilement les connexions sortantes de la machine.

La GUI est bien foutue et il n'est pas nécessaire de l'expliquer ici. Je vous recommande donc ette outil si vous souhaitez rapidement mettre en place une politique de sécurité sur votre système.

Firestarter

Afficher les règles iptables générées


Bouh !!! Des lignes de commandes :(

Ça y est, je me décide enfin à écrire pour de bon ce que je pense des personnes qui me crient que les lignes de commandes sous Unix c'est over has been et qu'elles ne sont faites que pour les geeks enfouis très loin dans leur cave...

Je vais surement m'attirer les foudres de gens qui ne comprendrons jamais mon avis mais peu m'importe, je n'aurai plus à l'expliquer oralement.

Une très grande majorité de personnes est née avec une souris dans les mains. Elles sont habituées depuis toujours à utiliser leur mulot pour user des fonctionnalités graphiques de leur machine.

La ligne de commande est un moyen souvent bien plus efficace et rapide de faire des actions sur un système (pour peu qu'il soit adapté). Évidement, quand une personne "click-addict" voit un mec écrire un bout de texte pour virer un fichier, ça lui faire peur, mais pourtant, ça ne devrait pas. L'ensemble de commandes de bases pour traiter les fichiers sont très simples et ne demandent pas d'avoir des skills d'ingénieur pour les utiliser.

Prenons quelques exemples pour illustrer :

Créer un fichier : touch monFichier
Supprimer un fichier : rm monFichier
Copier un fichier : cp monFichier maCopieDeMonFichier
Déplacer/renommer un fichier : mv monFichier monNouveauFichier

Est-ce vraiment plus compliqué que de faire un clique-droit dans un répertoire ou un fichier pour faire exactement pareil ? Je ne crois pas.

Bien sûr, quand on n'a pas été habitué à utiliser son clavier pour faire des actions basiques, ça peut rebuter. Seulement, on oublie rapidement certains concepts que chaque jour, une personne un temps soit peu à l'aise avec un ordinateur fait.

Une nouvelle fois je vais illustrer simplement : quand vous souhaitez faire un copié/collé, vous utilisez les raccouris clavier "CTRL+C" et "CTRL+V". De la même manière, sur Firefox par exemple, vous ouvrez des onglets avec "CTRL+T", vous placer le curseur dans la barre d'adresse avec "CTRL+L", vous sélectionner tout un texte avec "CTRL+A", etc.

Ces raccourcis, vous les vantez auprès des personnes qui sont sans cesse avec le souris pour faire exactement la même chose en perdant du temps. Basiquement, c'est pareil avec des lignes de commandes : si vous preniez le temps de les assimiler comme les raccourcis clavier, vous iriez plus vite.

Je reste persuadé que si vous aviez été habitué aux lignes de commandes avant de bidouiller avec votre souris, vous auriez une réaction totalement inverse.

Conclusion : les lignes de commandes ne sont pas faites pour une élite quelconque, mais bien pour aller largement plus vite dans la manipulation des données, et ce n'est pas si dure que ça...