logo html5

Comme vous le savez peut-être déjà, l'une des fonctionnalités de l'HTML5 est l'accès aux "User Media" et la webcam fait partie de ces "User Media" ;-)

En tentant d'accéder à la Webcam, Chrome affiche un petit message très banal que l'utilisateur peut facilement accepter sans trop se poser de question. Pour démontrer la faiblesse du message affiché par Chrome, je me suis amusé à développer une petite page Web qui capture le visage de la personne sans qu'elle ne s'en aperçoive :

http://labs.geeek.org/html5/

La page ouvre un flux vidéo et réalise une photo dans un canevas HTML5 en "display hidden". Un appel Ajax est ensuite réalisé au serveur pour transférer la photo dans le dos de l'utilisateur.

Techniquement, l'ouverture d'un flux vidéo en HTML5 est très simple à mettre en place. Pour cela, il est possible d'utiliser la fonctionnalité proposée par Webkit en passant deux fonctions de callback : une en cas de succès de la récupération du flux vidéo et l'autre en cas d'erreur.

navigator.webkitGetUserMedia({video:true}, gotStream, noStream);

Ensuite, pour réaliser une photo à partir du flux vidéo, il suffit d'utiliser un canevas HTML et d'utiliser la fonction "drawimage" pour copier une image du flux vidéo vers le canevas.

canvas.getContext('2d').drawImage(video, 0, 0);

Et le tour est joué ... il ne reste plus qu'à transformer le contenu en blob et de l'envoyer sur une URL du serveur.

Soyez très prudents si vous utilisez un navigateur partagé, une fois que l'utilisateur a autorisé le flux vidéo, il suffit que l'onglet reste ouvert pour que le navigateur puisse continuer à filmer et à envoyer des photos sur un serveur distant ...

1. Le , 18:55 par John
31b40676725cc8e8f38fb62d466af024

Mouai enfin le message soit disant "banal" est quand même assez clair,
et sans que le mec s'en aperçoive c'est aussi discutable. A la rigueur s'il a miss clic sur "oui" parce qu'il a pas ses lunettes sur lui, la led de la webcam qui s'allume c'est pas non plus très discret..

Donc perso j'ai pas l'impression que tu démontre grand chose..

2. Le , 11:37 par Ludovic
9ab09dd3e305f924f8930e20e1a35843

@John : En fait, j'essai de démontrer que très peu de personnes connaissent cette fonctionnalité et qu'il est facilement possible de réaliser une page Web qui espionne une personne à son insu.

Pour tous ceux qui ont accepté le message de chrome, voici votre photo :
http://labs.geeek.org/html5/phot0s/

3. Le , 13:49 par 1001portails
9ccc99a84510018308f0849b218d58ca

Il suffit de coller un petit autocollant sur l'objectif de sa webcam ( sur les webcams intégrés des portables et netbooks) . et l'enlever quand on se sert vraiment de celle ci ...

Il y a pas a même chose avec le son ?

4. Le , 16:04 par Yannick
9e98dc9c2ba66b2132cb306e814b35a7

Maintenant que tu connais un peu mieux ton lectorat, je te conseille de trouver rapidement un partenariat avec un revendeur de lunettes, il y a une majorité de clients potentiels ! :-)
Plus sérieusement, le risque est quand même important, parce qu'il n'y a pas forcément de LED qui s'allume à l'allumage d'une webcam (en tout cas avec un modèle intégré, je n'en ai pas). Donc, effectivement, le cache sur la webcam reste une protection loin d'être superflue.

5. Le , 19:58 par Ludovic
9ab09dd3e305f924f8930e20e1a35843

@1001portails : Il est aussi possible de capturer le son ... ;-)

@Yannick : Le message n'est pas un message habituel, et le fait de ne pas avoir de retour visuel rend encore plus opaque l'activité du navigateur.
Je pense qu'il sera bientôt possible de développer un trojan en HTML5 ;-)

6. Le , 09:46 par Tpcvtp
016df6ab6a6d68758fdbe7476bdd94f2

Et on peut avoir le code source ?

7. Le , 21:35 par Ludovic
9ab09dd3e305f924f8930e20e1a35843

Voici les photos : http://labs.geeek.org/html5/gallery...

@Tpcvtp : Le code source Javascript est visible dans la page HTML ;-)

8. Le , 23:21 par n00b
e612ea5914c541da4d658854db4a6a05

C'est censé les mettre dans quel répertoire les images la ?

9. Le , 16:09 par lc33
48cb575ac9232b915dfead036771534e

Bonjour,
Vous dites "Techniquement, l'ouverture d'un flux vidéo en HTML5 est très simple à mettre en place" cependant en ce qui me concerne j'ai le plus grand mal à trouver un tuto simple et fonctionnel. Peut être que vous pouvez m'en indiquer un ?
Meric

Ajouter un commentaire

Le code HTML est affiché comme du texte et les adresses web sont automatiquement transformées.