Télésurveillance sur Mac
Diffusion webcam sur page web

Top

Si vous êtes en possession d'une webcam, vous avez déjà sans doute eu l'occasion de tester un logiciel de vidéochat pour pouvoir discuter en direct, en son et image, avec vos correspondants. Mais vous pouvez également utilisez votre webcam à d'autres fins ! En effet, que diriez vous de transmettre en direct des images en continu par Internet et ce directement sur une page web ? Cela peut être très utile à des fins personnelles pour montrer votre intérieur, votre jardin, votre bureau ou ce que vous voulez ; à des fins commerciales pour présenter une location de vacances en "live", une vue touristique etc... Ou même à des fins de sécurité, pour faire de la télésurveillance afin de surveiller à distance votre nourisson ou votre animal favori ou même pour s'assurer que personne ne s'introduit chez vous pendant votre absence ???? Les possibilités d'utilisation sont infinies ! Il vous suffira d'aller sur n'importe quel ordinateur Mac ou PC connecté sur Internet pour voir ce qui se passe chez vous ou voir ce que vous voulez tant nous montrer !

Introduction - Présentation du logiciel "EvoCam"

Si vous surfez beaucoup sur Internet, vous remarquerez que ce genre d'utilisation est assez fréquente : On propose souvent des accès à des webcams montrant en direct (l'image est rafraîchie toutes les 10, 20 ou 30 secondes) certains sites touristiques, certains points de vue dans les villes etc.. Avec ce système on a l'image, mais pas le son.

 

Comment faire alors sous OS X pour diffuser ainsi sur la toile des images prises par sa webcam ? Pour cela il vous faut donc posséder une webcam bien entendu, mais également un logiciel de transmission vidéo sur Internet comme "EvoCam" que vous téléchargez ICI (téléchargez la dernière version de "Evocam").

 

"EvoCam" ne coûte que 24 € environ, mais vous pouvez utiliser la démo pour une période de 15 jours. "EvoCam" est un logiciel qui se sert d'un serveur distant (un serveur FTP par exemple) pour la transmission vidéo.

 

La procédure avec ce logiciel peut paraître un peu difficile à priori pour les débutants, mais si vous suivez mes directives à la lettre vous verrez que ce n'est pas si compliqué que cela en a l'air !!!

 

"EvoCam" offre de nombreuses fonctionnalités : possibilité de faire du streaming audio/vidéo sur Internet (H.264/AAC), création d'un serveur web, enregistrement audio/vidéo etc... Dans cette astuce nous n'aborderons pas toutes les possibilités de ce logiciel et nous nous contenterons simplement d'expliquer comme utiliser "EvoCam" et un serveur FTP afin de diffuser les images de votre webcam sur Internet.

 

Il vous faudra également obligatoirement disposer d'un serveur FTP. Si vous avez déjà un site internet, tout va bien, il vous suffira d'ajouter un nouveau dossier/répertoire (sous-domaine) sur votre serveur FTP (nous verrons cela plus loin). Mais si vous n'avez pas encore de serveur FTP, rien de plus simple pour vous en créer un. Tous les fournisseurs d'accès Internet proposent gratuitement la création de "pages perso" ! Il suffit donc d'activer, en quelques clics, ce service de pages perso, même si vous ne comptez pas devenir webmaster hors pair, car ce sera juste pour pouvoir diffuser vos images webcam "en live" sur votre page web !

 

Allez sur le site internet de votre fournisseur d'accès Internet, entrez sur votre compte et cherchez la rubrique consacrée aux "Pages perso". Une fois ce service activé, vous disposez alors d'un serveur FTP (espace disque) prévu pour héberger vos pages web. Cet espace disque est de taille pouvant varier selon les FAI (100 Mo ou 200 Mo, voire plus).

 

Une fois ce service activé sur votre compte personnel sur le site de votre FAI, il vous faudra simplement BIEN NOTER les éléments suivants :

  • L'adresse de votre site (on appelle cela l'adresse URL). C'est cette adresse que l'on tape dans le navigateur pour visualiser ce que vous avez hébergé sur votre serveur FTP (sites, pages web etc...).
  • Les "Informations pour le FTP" qui vous seront communiquées à l'issue de la création de l'adresse de votre site Internet (adresse du serveur FTP, Nom d'utilisateur et mot de passe).

 

 

Première étape : Configurer votre site web

Maintenant que vous possédez un espace disque chez votre fournisseur d'accès, c'est sur cet espace disque que normalement (si vous aviez décidé de créer et mettre en ligne un site web) vous auriez du déposer tous les fichiers inhérents à votre site web (pages, photos, images etc...).

On appelle cet espace disque le "serveur FTP" auquel on accède grâce à un logiciel FTP (File Transfert Protocol).

 

Le but ici n'est cependant pas de créer un site web, mais de diffuser en "live" les images de sa webcam. Pour cela il est nécessaire dans un premier temps de déposer sur votre serveur web le fichier "webcam.html" qui se trouve dans le dossier "HTML" situé lui dans le dossier "EvoCam"de la version 3.7.6 du logiciel que vous pouvez télécharger ICI sur le site de l'éditeur EVOLOGICAL (il n'y a pas de fichier "webcam.html" fourni avec la dernière version de "Evocam").
Une fois cette version 3.7.6 téléchargée, récupérez simplement le fichier "webcam.html" situé dans le dossier "HTML". Mettez tout le reste à la corbeille, car nous n'utiliserons pas cette ancienne version, mais bien la dernière version de "Evocam".

 

Pour déposer (uploader) ce fichier "webcam.html" sur votre serveur web, il convient donc d'utiliser un logiciel FTP. Il y en a beaucoup, et je peux notamment vous conseiller "Fetch" ICI ou "Transmit" ICI (mon préféré, que je vais utiliser ici-même). Vous pouvez aussi opter pour le logiciel FTP Open Source "FileZilla" disponible ICI.

 

Téléchargez un de ces logiciels et lancez-le. Indiquez l'adresse de votre serveur FTP, votre nom d'utilisateur (login) et votre mot de passe tels qu'ils vous ont été communiqués par votre fournisseur d'accès lors de la création de vos "pages perso".

 

Pour Orange par exemple, indiquez cela dans votre logiciel FTP :

 

Adresse serveur = perso-ftp.orange.fr

Utilisateur = votre adresse email chez Orange

Mot de passe = le mot de passe de votre adresse email

Laissez le reste comme tel et cliquez sur "Se connecter"

 

 

 

Une fois ce logiciel FTP lancé et que vous vous êtes ainsi connecté sur votre serveur FTP, vous pouvez voir les dossiers qui s'y trouvent déjà (en principe aucun, si vous vous connectez pour la première fois sur votre serveur FTP de pages perso).

Créez maintenant un nouveau dossier (*) sur votre serveur FTP.

Nommez ce dossier comme bon vous semble, "Partage" par exemple.

 

 

 

----------------------------------------------

 

 

 

Une fois ce nouveau dossier créé, ouvrez-le (en double-cliquant dessus), puis glissez-déposez simplement le fichier "webcam.html" dans ce nouveau dossier ! Le fichier "webcam.html" va être alors automatiquement uploadé sur votre serveur FTP dans le dossier que vous venez de créer !

 

 

 

----------------------------------------

 

 

Vous venez de faire le plus dur ! Votre site est maintenant prêt à accueillir les images de votre webcam ! Le reste va être de la rigolade ! Quittez votre logiciel FTP.

 

(*) Mieux vaut en effet se créer un dossier réservé à cette utilisation précise. Ce serait dommage d'utiliser tout votre serveur FTP rien que pour cette seule utilisation. Vous pourrez ainsi créer d'autres dossiers sur votre serveur FTP, au même niveau que le dossier "Partage" afin d'y héberger des sites web par exemple (un par dossier créé).

 

Deuxième étape : Configurer "EvoCam"

Là, les choses sont beaucoup plus simples ! Lancez l'application "EvoCam" : Votre image apparaît dans la fenêtre principale de "EvoCam", c'est donc que votre webcam est automatiquement reconnue !

 

Rendez vous dans un premier temps dans les préférences de "EvoCam". Comme nous allons utiliser un serveur FTP, allez à la rubrique "FTP Server" et paramétrez la fenêtre comme suit :

 

 

 

-------------------------------------

 

 

 

  • À la rubrique "FTP Server", indiquez l'adresse de votre serveur FTP (pour cette astuce, je vais utiliser le serveur FTP de pages perso de mon fournisseur d'accès Internet Numéricable).
  • Username : Indiquez votre nom d'utilisateur FTP.
  • Password : Indiquez votre mot de passe de connexion FTP.
  • Initial Path : Indiquez dans quel dossier sur votre serveur FTP "EvoCam" doit envoyer l'image de votre webcam. C'est dans ce dossier que se trouve déjà le fichier "webcam.html"). Si vous avez nommé ce dossier "Partage", indiquez alors "/Partage" (tapez bien la barre oblique inversée au début).
  • Laissez le reste comme tel.

 

Fermez la fenêtre des préférences et retournez maintenant à la fenêtre principale de "EvoCam", à la rubrique "Actions". Paramétrez cette rubrique exactement comme suit en vous servant des petits menus déroulants proposés sous les triangles noirs à droite :

 

 

 

-------------------------------------------------

 

 

  • À la rubrique "Every --- seconds", indiquez par exemple "10" (ou moins ou plus c'est à vous de voir !). Attention, il s'agit là du rafraîchissement de l'image diffusée par la webcam dans le dossier "Partage" et non du rafraîchissement de la page web elle-même. Nous verrons comment paramétrer cela un peu plus bas.
  • Cochez bien les trois cases comme indiqué ci-dessus.

 

À partir de maintenant, "Evocam" va envoyer toutes les 10 secondes (si vous avez indiqué 10 secondes) l'image prise par votre webcam directement dans le dossier que vous avez créé sur votre serveur FTP (dans mon exemple c'est le dossier "Partage"). D'ailleurs, si vous relancez votre logiciel FTP et que vous vous rendez sur votre serveur FTP dans votre dossier "Partage", vous apercevrez qu'il y a maintenant un fichier "webcam.jpg".

C'est l'image qui est uploadée (téléversée) par "EvoCam" sur votre serveur FTP (celle-ci est donc changée toutes les 10 secondes dans notre exemple).

 

 

 

------------------------------------------

 

 

 

 

Sur l'image diffusée par "EvoCam", vous consaterez la présence par défaut de deux éléments (items en anglais) : le mot "EvoCam" en jaune à gauche et l'horloge en bleu à droite :

 

 

 

------------------------------------------------------------

 

 

Il est possible de supprimer ou modifier ces éléments en allant dans la fenêtre de l'inspecteur "Inspector". Sélectionnez un des éléments sur l'image (cliquez une fois dessus pour ce faire), vous verrez alors apparaître les données de cet élément (item) sélectionné dans l'inspecteur.

Ici, j'ai par exemple sélectionné l'horloge :

 

 

 

---------------------------------------------------------------

 

 

Vous pouvez modifier l'emplacement de l'horloge, le niveau de transparence, la couleur, la taille, la police, le format etc...

Pour la faire disparaître, sélectionnez-la dans l'image, puis appuyez sur la touche "Envoi".

 

Vous pouvez procéder de même pour l'élément "EvoCam" figurant sur l'image (vous pouvez par exemple renommer cet élément).

 

Il est également possible de modifier la taille par défaut (320 x 240) de l'image à la rubrique "Canvas Size" de l'inspecteur. Attention toutefois à ne modifier ce paramétrage que si votre configuration matérielle (webcam, bande passante etc...) le permet.

 

Maintenant que vous avez effectué tout ce travail de paramétrage, je vous invite à aller dans le menu "File" puis "Save as" afin d'enregistrer tout cela. Dans la fenêtre qui s'ouvre, donnez un nom au fichier qui sera créé dans votre dossier "Documents" (par défaut). Nommez ce fichier par exemple "EvoCam".

Quand vous re-lancerez l'application "EvoCam", il suffira alors d'aller dans le menu "File", puis "Open Recent" afin d'ouvrir à nouveau ce fichier "EvoCam" et vous retrouverez ainsi tous vos paramétrages. Il sera inutile de tout recommencer !

 

 

 

--------------------------------------------------

 

 

 

Troisème étape : La diffusion sur le web

Une fois à ce stade, nous avons vu que la webcam transmet d'ores et déjà les images en direct sur le net (via le serveur FTP, et ce toutes les 10 secondes).

 

Pour visualiser ce que cela donne sur Internet, lancez votre navigateur préféré ("Safari", "Chrome" etc...) et dans le champ "Adresse" tapez simplement l'adresse de votre site web telle qu'elle vous a été communiquée lors de la création de vos pages perso et à laquelle vous ajouterez le chemin indiquant où se trouve le fichier "webcam.html" sur votre serveur FTP.

 

Ainsi, par exemple chez Orange, l'adresse sera :

 

http://pagesperso-orange.fr/NOM D'UTILISATEUR/Partage/webcam.html

 

 

Si vous avez appelé le dossier créé sur votre serveur FTP d'un autre nom que "Partage", tapez ce nom à la place de "Partage".

 

Vous remarquerez toutefois que l'image apparaissant sur la page web de votre navigateur, elle, n'est rafraîchie que toutes les 60 secondes, ce qui est le réglage par défaut (et ce même si l'image est rafraîchie toutes les 10 secondes sur votre serveur FTP). Il est cependant possible de modifier ce paramétrage par défaut pour, par exemple, faire en sorte que l'image apparaissant sur la page web soit rafraîchie plus souvent, toutes les 10 secondes par exemple... Voici comment faire.

 

  • Récupérez le fichier "webcam.html"dans le dossier "HTML" de la version 3.7.6 du logiciel (re-téléchargez-le si nécessaire). Nous allons le modifier.
  • Ouvrez le fichier "Webcam.html" avec l'application "TextEdit". Cette page s'ouvre :

 

 

 

 

-------------------------------

 

  • Regardez la deuxième ligne en commençant par le haut (Ligne <META HTTP-EQUIV="refresh" CONTENT="60">) : le chiffre "60" signifie que le rafraîchissement de l'image du site est calibré sur 60 secondes. Tapez alors 10 à la place de 60 ! Ainsi votre image du site se rafraîchira toutes les 10 secondes.
  • Allez dans le menu "Fichier"/"Enregistrer une version" et quittez "TextEdit" (pensez à décocher la case "Ignorer les commandes HTML dans les fichiers HTML" dans les préférences). Félicitations ! Vous venez (peut-être) de faire vos premiers pas dans la programmation HTML !
  • Maintenant il vous faut relancer votre logiciel FTP pour vous rendre à nouveau sur votre serveur FTP afin de placer ce fichier "webcam.html" modifié en lieu et place de celui que vous avez préalablement placé dans le dossier que vous aviez créé au tout début (dans mon exemple, il s'agissait du dossier "Partage").

 

Retournez sur votre page web, et en effet, le taux de rafraîchissement de l'image est nettement plus rapide.

 

Ne reste plus qu'à communiquer au monde entier votre adresse de site pour que tout le monde puisse voir ce que vous avez envie de montrer. Ou bien utilisez votre smartphone pour vérifier que tout est OK chez vous pendant votre absence etc...

 

Remarque importante

Si "EvoCam" est lancée, l'image webcam diffusée sur votre site sera rafraîchie automatiquement toutes les x secondes (ou plus) en fonction de vos paramétrages HTML. La date et l'heure figurant éventuellement sur cette image en attesteront ! Vous êtes bien en "live" !

 

Si vous quittez "EvoCam", coupez votre webcam ou éteignez votre ordinateur, il va de soi que la transmission en direct d'images de votre webcam vers votre serveur FTP s'interrompt également. Dans ce cas, l'image qui figurera sur ce site est la dernière diffusée en date avant l'interruption : la date et l'heure figurant sur cette image indiqueront d'ailleurs de quand est cette image ! Le rafraîchissement de l'image continue à s'opérer, mais comme il n'y a pas de nouvelle image diffusée, ce sera toujours cette dernière image qui s'affichera ! Logique ! La diffusion reprendra dès que vous lancerez à nouveau "EvoCam".