Note utilisateur: 5 / 5

Etoiles activesEtoiles activesEtoiles activesEtoiles activesEtoiles actives
 

macro

 

Dans ce tutoriel, nous allons voir ce qu'est le hotlinking et quelles en sont ses conséquences.

Puis, nous verrons comment protéger son site contre le hotlinking...

 

 

C'est quoi le hotlinking ?

Le hotlinking (ou direct linking) consiste à utiliser l'adresse d'un fichier publié sur un site Web, le plus souvent une image, pour l'afficher sur un autre site, un blog ou un forum.

En d'autres termes, au lieu d'enregistrer l'image et de l'installer sur son propre serveur Web, le hotlinkeur crée un lien direct vers le serveur d'origine.

 

 

Qu'est-ce que ça peut faire ?

Même dans le cas où l'image est libre de droits, le fait de créer un direct link est illégal, s'il n'est pas expressément autorisé par l'éditeur du site Web concerné, puisqu'il s'agit littéralement d'un vol de bande passante.

En effet, chaque affichage de l'image provoque l'envoi d'une requête au serveur qui l'héberge. Celui-ci répond en transférant un volume de données correspondant au poids du fichier. Or, dans le prix facturé à son client, un hébergeur Internet tient généralement compte du trafic mensuel de données afin d'éviter les abus et de préserver sa bande passante.

Le hotlinking est donc une "méthode sauvage" qui pénalise fortement l'éditeur d'un site Web : d'abord sur le plan technique, car son serveur peut être sérieusement ralenti si les liens créés à son insu produisent un grand nombre de requêtes, puis sur le plan financier, car son hébergeur peut lui facturer un supplément pour dépassement du quota de données.

Pire encore, dans le cas d'un hébergement mutualisé, le site Web peut même être interrompu s'il consomme trop de bande passante.

 

 

Comment faire autrement...

Lorsqu'on souhaite utiliser une image provenant d'un autre site Web, il suffit de la copier, puis de l'enregistrer sur son propre serveur !

On peut également se tourner vers des sites d'hébergement d'images, gratuits, comme le célèbre ImageShack

Mais bien souvent, hélas, les internautes peu scrupuleux (ou inconscients) trouvent bien plus simple de faire un lien direct...

 

 

Protégez votre site

Le meilleur moyen pour se protéger du hotlinking est donc de mettre en place un système simple qui va empêcher l'affichage de vos images sur les autres sites.

Le principe est simple : si quelqu'un réalise un hotlink vers une image de votre site, ce sera un message d'avertissement qui apparaîtra à la place.

Par exemple, si vous tentez de réaliser un hotlink de mon image (URL : http://www.learnup.fr/evo2/images/stories/articles/2010/2010-12/hotlinking/001.png) ci-dessous dans un forum :

alt

 

Vous obtiendrez à la place celle-ci :

002

 

 

Nous allons voir comment paramétrer tout ça...

 

 

Créer l'image d'avertissement

Nous allons tout d'abord concevoir l'image d'avertissement qui remplacera toutes les images de votre site victime du hotlinking.

Créez l'image avec votre éditeur d'images préféré (Paint, Paint.net, etc...), puis enregistrez-là.

Nous allons ensuite modifier son extension.

Il faut en effet que son extension soit différente de tous les formats d'images possibles.

 

Je m'explique :

J'ai enregistré mon image d'avertissement sous le nom "antihotlink.png"

alt

 

J'enlève la dernière lettre de l'extension (le "g" de l'extension ".png"), afin de créer une extension atypique, que je suis certain de ne jamais utiliser dans d'autres images de mon site :

alt

 

alt Si vous ne voyez pas les extensions de vos fichiers, vous devez modifier l'affichage de vos dossiers ("Panneau de configuration" - "Options des dossiers" - onglet "Affichage", puis décochez la ligne "Masquer les extensions des fichiers dont le type est connu").

 

 

Placer l'image d'avertissement sur votre serveur

A l'aide de votre logiciel FTP préféré, placez cette image à la racine de votre serveur...

alt

 

 

Modification du fichier .htaccess

Récupérez votre fichier .htaccess situé à la racine de votre site.

C'est lui que nous allons devoir paramétrer.

Ouvrez le avec un éditeur texte (Bloc Note, Notepad+, etc...).

Saisissez le code suivant :


RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$

 

En dessous, nous allons paramétrer le ou les sites Web qui seront autorisés à utiliser les images de notre serveur, sans avoir l'image d'avertissement.

alt Vous devez évidemment définir au moins votre propre site !

Dans l'exemple ci-dessous, j'autorise mon propre site (learnup.fr) mais aussi le site facebook.com à afficher mes images en direct link :


RewriteCond %{HTTP_REFERER} !^http://(www\.)?learnup.fr(/)?.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http://(www\.)?facebook.com(/)?.*$ [NC]

 

Je vais maintenant définir les extensions des images qui devront être surveillées, ainsi que le lien vers mon image d'avertissement :

RewriteRule .*\.(gif|jpg|jpeg|bmp|png|PNG|JPG|JPEG)$ http://www.learnup.fr/antihotlink.pn [R,NC]

altEn vert se trouvent les extensions des images de mon sites, séparées par des barres verticales (touches Alt Gr+6), en rouge se trouve le lien absolu de mon image d'avertissement.

 

 

Voici donc mon code final :

RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www\.)?learnup.fr(/)?.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http://(www\.)?facebook.com(/)?.*$ [NC]
RewriteRule .*\.(gif|jpg|jpeg|bmp|png|PNG|JPG|JPEG)$ http://www.learnup.fr/antihotlink.pn [R,NC]

Si je le traduis en langage humain, ça donne :

La réécriture d'URL est activée, ainsi que la réécriture avec conditions. J'autorise les sites learnup.fr et facebook.com à afficher les images de type gif, jpg, jpeg, bmp, png, PNG, JPG et JPEG à réaliser des liens directs/

Si un autre site crée un lien vers une image ayant une extension de type gif, jpg, jpeg, bmp, png, PNG, JPG ou JPEG, dans ce cas, réécrire l'adresse de l'image en http://www.learnup.fr/antihotlink.pn

 

Enregistrez les modifications apportées à votre fichier .htaccess, puis uploadez le sur votre serveur.

Et voilà :)

 

 

Tester votre protection

Un service vous permet de tester votre protection contre le hotlink : http://www.htaccesstools.com/test-hotlink-protection/

Il vous suffit d'entrer l'URL d'une de vos images, et de vérifier que tout fonctionne correctement :)

 

 

En conclusion

Certes, si votre image d'avertissement apparaît dans des milliers de forums, vous allez me dire que votre passante ne sera en rien épargnée, et vous aurez raison.

Mais l'image d'avertissement est très dissuasive : vous verrez qu'elle ne sera pas utilisée bien longtemps :o)

N'hésitez pas à communiquer sur votre site Web que vos images sont protégées contre le hotlink.

 

 

alt

 

 

1000 caractères restants


Gravatar
Jean-Luc
Bonjour, la protection semble fonctionner (j'ai testé l'accès depuis un autre domaine d'une image du site protégé en l'insérant dans un article, au premier rafraichissemen t, le lien est rompu et ne fonctionne pas) néanmoins, quand je teste avec http://www.htaccesstools.com/test-hotlink-protection/ l'image que j'ai créée ne s'affiche pas...une idée? merci