Cómo evitar el hotlinking de imágenes en WordPress

¿Has notado recientemente que estas cerca de sobrepasar las tasas de transferencia que tu proveedor de hosting te permite al mes? Si la respuesta es afirmativa, es posible que estés sufriendo el maldito hotlinking.

Esto puede hacer que incluso tu web aparezca caída (offline) ya que te han robado todo el ancho de banda permitido. Y está claro que esto es lo último que quieres que te pase.

En este pequeño tutorial te explicamos con más detalle qué es el hotlinking y cómo puedes evitarlo.

¿Qué es el hotlinking?

El hotlinking es un concepto muy sencillo de explicar. Imagina que tienes una web que ha publicado una imagen muy interesante. De repente, un visitante de tu web la ve y le gusta tanto que copia el enlace de esa imagen y lo pega en su web. Ahora imagina que la web de ese visitante tiene un montón de visitas. Pues cada vez que se cargue su web se hará una petición a tu servidor para descargar tu imagen.

Copiar la dirección web de una imagen es muy sencillo.
Copiar la dirección web de una imagen es muy sencillo. Hacemos clic con el botón derecho desde el navegador y encontraremos una opción similar a la que podemos ver en esta captura.

Esto pasa porque esa persona no ha subido la imagen a su propio servidor, sino que la ha enlazado directamente hacia tu web, con lo que te está robando de forma indirecta ancho de banda. Esto puede parecer una tontería, pero si te lo hace muchísima gente porque tu contenido se vuelve viral, o te lo hacen desde sitios con mucho tráfico, pueden incluso tirar abajo tu servidor web, dejando tu web inaccesible.

La tasa de transferencia mensual que permite tu proveedor de alojamiento web tiene un límite. Quizás no lo sepas, pero es así. Si a través del hotlinking de tus imágenes por terceros vas consumiendo este recurso puedes llegar a quedarte sin.

Hay que decir que mucha gente hace hotlinking de imágenes por mero desconocimiento. No saben que te están perjudicando ni tienen malas intenciones. Aún así, está bien tenerlo en cuenta y conocer las maneras que tienes para protegerte llegado el caso.

Plugins para evitar el hotlinking

Seguramente alguna vez en tu vida habrás hecho hotlinking sin saberlo. Tu simplemente copiaste el enlace a una imagen y lo reutilizaste. Y seguro que más de una vez te pasó que ese enlace dejó de funcionar al ponerlo en tu web. Pero si ibas a la web origen, allí la imagen si que funcionaba.

Esto te pasó porque el propietario de la web desde donde robaste la imagen ya conocía el problema y supo ponerle solución, controlando el hotlinking para que el enlace a la imagen dejara de funcionar si la petición no se hacía directamente desde su web. Vamos, que te pillaron con las manos en la masa 🙂 .

Afortunadamente, WordPress y el ecosistema de plugins nos ayudan a evitar el hotlinking de imágenes. La opción más potente via plugins es instalar ByREV WP-PICShield. Se trata de un plugin que además de evitar hotlinking permite diferentes funcionalidades, como servir de caché de imágenes y demás. Es algo complejo de configurar y, bajo mi punto de vista, hace demasiadas cosas.

Pantalla de configuración del plugin ByREV WP-PICShield
Pantalla de configuración del plugin ByREV WP-PICShield. Como ves, puedes indicar qué tipos de imagen bloquear e incluso hacer que cuando te enlacen una imagen vean otra diferente que hayas predeterminado.

Algo más simple es el plugin Hotlink Protection, aunque parece que últimamente está algo abandonado. Este plugin se encarga de añadir las líneas necesarias en el archivo .htaccess para evitar que te puedan hacer hotlinking. No obstante, te recomiendo que si vas a decantarte por esta opción, sigas leyendo.

Evitar el hotlinking via .htaccess

La opción manual para evitar el hotlinking es editar directamente el archivo .htaccess que podrás encontrar en la raíz de tu instalación WordPress en tu servidor. Una vez lo tengas abierto, sólo has de añadir las siguientes líneas:

RewriteEngine on
 RewriteCond %{HTTP_REFERER} !^$
 RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?wprincipiante.es [NC]
 RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?google.com [NC]
 RewriteRule \.(jpg|jpeg|png|gif)$ http://dropbox.com/imagen-alternativa.jpg [NC,R,L]

La tercera linea indica el dominio que tiene permitido el acceso a las imágenes. Aquí es donde tienes que poner la dirección de tu web, o sino bloquearás todas las imágenes.

Suele ser también una buena práctica añadir como dominio permitido a Google, para evitar perder posicionamiento si Google te viene a indexar para que tus imágenes aparezcan en Google Imágenes. Del mismo modo, podríamos permitir hotlinking desde redes sociales.

Por último, la linea final define qué tipos de imágenes vamos a bloquear (jpg, jpeg, png y gif, en el ejemplo). Y podemos también definir una dirección web alternativa para que cuando se intente acceder desde un dominio prohibido a la imagen, se muestre una imagen alternativa (en este caso, debería ser un enlace a un servicio externo, como por ejemplo Dropbox). Indicar que no solo podemos hacerlo con imágenes, sino también con otros documentos como audios o PDFs, por ejemplo.

Con esto podemos ser tan creativos como queramos. Podemos hacer una imagen alternativa con un mensaje en texto indicando que no permites el hotlinking, o incluso convertir esa imagen en un anuncio a tu web. Así, el que intente hacer hotlinking a tus imágenes, te estará haciendo promoción 😉

Conclusión

Deberías siempre evitar hacer hotlinking a las imágenes y recursos de terceros, a no ser que estos te den permiso explícito para poder hacerlo. El karma te lo recompensará.

En tu web no está de más que te protejas un poco si realmente notas que tus tasas de transferencia y ancho de banda de salida están por las nubes. Tienes varios plugins disponibles, o incluso puedes hacerlo añadiendo unas simples líneas a tu archivo .htaccess. Sin embargo, ten en cuenta que esto sólo funcionará si los archivos los tienes alojados directamente en tu WordPress (es decir, no usas un servicio externo como Amazon S3, por ejemplo).

No obstante, ten en cuenta que deberías permitir hotlinking desde ciertos dominios como por ejemplo Google o redes sociales varias, para evitar perder posicionamiento.

Imagen destacada de Tim Wang

por

Doctor en Computación por la UPC, con publicaciones en el campo de la minería de datos y de la explotación de información relevante de grandes volúmenes de datos en el campo de la salud. Especializado en el diseño, desarrollo e integración de servicios y aplicaciones web en el cloud. Contribuye muy activamente en la comunidad WordPress participando en meetups, seminarios y WordCamps.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *