Como webmaster, una de nuestras responsabilidades fundamentales es garantizar que nuestro sitio web funcione de manera eficiente y proteger nuestros recursos de cualquier uso indebido, uno de los problemas más comunes que enfrentamos en el mundo del alojamiento web es el hotlinking, en este artículo, discutiremos qué es el hotlinking, por qué es importante implementar medidas para prevenirlo y cómo puede afectar negativamente a nuestro sitio web si no se aborda adecuadamente.

El hotlinking, también conocido como enlace directo o robo de ancho de banda, es una práctica en la que un sitio web utiliza enlaces directos a archivos multimedia, como imágenes o videos, alojados en otro sitio web sin su consentimiento, esto en esencia significa que el sitio web que roba no solo está robando contenido, también está utilizando los recursos del sitio web original sin su permiso, lo cual puede generar una serie de problemas para el propietario del sitio web original.

Entonces, ¿por qué es importante abordar este problema y proteger nuestro sitio web del hotlinking? Hay varias razones clave:

1. Consumo de ancho de banda: Cuando otros sitios web enlazan directamente a nuestros archivos multimedia, aumenta el consumo de ancho de banda de nuestro servidor. Esto puede ralentizar nuestro sitio web, lo que resulta en una experiencia de usuario deficiente y posiblemente afecta nuestro posicionamiento en los motores de búsqueda. Además, si tenemos un plan de alojamiento con límites de ancho de banda, podemos enfrentar cargos adicionales si se exceden esos límites debido al hotlinking.
2. Pérdida de control sobre el contenido: Al permitir que otros sitios web utilicen nuestros archivos multimedia, perdemos el control sobre cómo y dónde se utilizan nuestros recursos. Esto puede generar problemas de marca y de derechos de autor si nuestro contenido se usa de manera inapropiada o sin nuestro consentimiento.
3. Costos de alojamiento: Como mencionamos anteriormente, el hotlinking puede generar un mayor consumo de ancho de banda y, como resultado, aumentar nuestros costos de alojamiento. Al prevenir el hotlinking, podemos reducir estos costos y garantizar que nuestro sitio web funcione de manera eficiente y rentable

Si bien podemos utilizar servicios de CDN (Content Delivery Network) que ofrezcan protección contra el hotlinking, también, podemos implementar otras medidas más sencillas y rápidas, como modificar nuestro archivo .htaccess para bloquear el acceso a nuestros archivos multimedia desde sitios web externos o reemplazar la imagen solicitada por una predeterminada cuando se detecte hotlinking, lo cual veremos a continuación.

Las reglas

Puedes utilizar el siguiente código en tu archivo .htaccess para lograr lo que deseas, este código permite cargar imágenes solamente si se accede a ellas desde el dominio específico (con y sin www) y bloquea la carga si se intenta insertar en otra web.

Reemplaza “tudominio.com” el dominio de cuál deseas permitir el acceso a las imágenes:

RewriteEngine On
RewriteCond %{HTTP_REFERER} !^https://(www\.)?tudominio\.com/ [NC]
RewriteCond %{HTTP_REFERER} !^$
RewriteRule \.(jpeg|jpg|png|gif)$ - [F,NC,L]

El caso anterior permite bloquear la carga de las imágenes desde otro subdominio, sin embargo, no bloquea la carga de la imagen si se la escribe directamente en el navegador porque en el caso anterior esta permitiendo las peticiones sin HTTP_REFERER o con HTTP_REFERER igual al dominio, solo bloquea los HTTP_REFERER diferentes al dominio, es decir cuando es insertado en otra web, para solucionar esto se puede eliminar el segundo RewriteCond:

RewriteEngine On
RewriteCond %{HTTP_REFERER} !^https://(www\.)?tudominio\.com/ [NC]
RewriteRule \.(jpeg|jpg|png|gif)$ - [F,NC,L]

Si además del subdominio quieres permitir el acceso desde 2 subdominios puedes usar lo siguiente:

RewriteEngine On
RewriteCond %{HTTP_REFERER} !^https://(www\.)?tudominio\.com/ [NC]
RewriteCond %{HTTP_REFERER} !^https://(www\.)?subdominio1\.tudominio\.com/ [NC]
RewriteCond %{HTTP_REFERER} !^https://(www\.)?subdominio2\.tudominio\.com/ [NC]
RewriteCond %{HTTP_REFERER} !^$
RewriteRule \.(jpeg|jpg|png|gif)$ - [F,NC,L]

Si se quiere bloquear el acceso directo a las imágenes se remueve el penúltimo RewriteCond y quedaría como:

RewriteEngine On
RewriteCond %{HTTP_REFERER} !^https://(www\.)?tudominio\.com/ [NC]
RewriteCond %{HTTP_REFERER} !^https://(www\.)?subdominio1\.tudominio\.com/ [NC]
RewriteCond %{HTTP_REFERER} !^https://(www\.)?subdominio2\.tudominio\.com/ [NC]
RewriteRule \.(jpeg|jpg|png|gif)$ - [F,NC,L]

Existen plugins de WordPress que pueden tener problemas en caso de eliminar el acceso directo a las imágenes ya que no utilizan HTTP_REFERER, por eso la solución es autorizar la IP, por ejemplo si la IP fuera 111.111.111.111 la agregaríamos de la siguiente forma:

RewriteEngine On
RewriteCond %{HTTP_REFERER} !^https://(www\.)?tudominio\.com/ [NC]
RewriteCond %{REMOTE_ADDR} !^111\.111\.111\.111$
RewriteRule \.(jpeg|jpg|png|gif)$ - [F,NC,L]

Hasta ahora simplemente bloqueo la imagen mostrando un error 403, sin embargo, también podemos sustituir la imagen solicitada por una imagen predeterminada, por ejemplo por algo asi:

Para lograrlo simplemente debemos quitar la bandera F de Forbidden de la ultima regla y sustituir el guion por una ruta, por ejemplo debemos cambiar:

RewriteRule \.(jpeg|jpg|png|gif)$ - [F,NC,L]

por:

RewriteRule \.(jpeg|jpg|png|gif)$ /stop.jpg [NC,L]

Quedaria algo como eso:

RewriteEngine On
RewriteCond %{HTTP_REFERER} !^https://(www\.)?tudominio\.com/ [NC]
RewriteCond %{HTTP_REFERER} !^$
RewriteRule \.(jpeg|jpg|png|gif)$ /stop.jpg [NC,L]

Por supuesto podemos combinarlo con cualquiera de las reglas anteriores.

Como funciona

Este código realiza las siguientes funciones:

1. La regla RewriteEngine habilita el motor de reescritura.
2. Verifica si el remitente (HTTP_REFERER) no es “tudominio.com” o “subdominio1.tudominio.com”
3. Cuando en HTTP_REFERER se coloca !^$ es para permitir el acceso si el remitente (HTTP_REFERER) está vacío. Esto es permite el acceso si se accede a las imágenes directamente desde el navegador, si se remueve de la regla esta bloquea el acceso directo, ya que no existe ningún  HTTP_REFERER
4. En RewriteRule bloquea el acceso a los archivos con extensiones jpeg, jpg, png y gif si no cumplen con las condiciones anteriores, podemos agregar cualquier extensión de fichero que necesitemos, también podemos especificar si quieres indicar una imagen por defecto o queremos que arroje un 403.

Recuerda que este código debe colocarse en el archivo .htaccess que se encuentra en la carpeta donde están alojadas las imágenes que deseas proteger.

Las letras [F,NC,L] en la regla de reescritura son banderas (flags) que especifican opciones adicionales para la regla. En este caso, las banderas tienen los siguientes significados:

1. F: Significa “Forbidden” (prohibido). Cuando se cumple la condición de la regla, el servidor devolverá un error 403 Forbidden, lo que indica que el acceso al recurso solicitado está prohibido.
2. NC: Significa “No Case” (no distinguir mayúsculas de minúsculas). Esta bandera hace que la regla no distinga entre mayúsculas y minúsculas. Por ejemplo, si la regla especifica una extensión de archivo como “.jpg”, también se aplicará a “.JPG”, “.jPg”, etc.
3. L: Significa “Last” (última). Esta bandera indica que si la regla actual coincide con la solicitud, el servidor no procesará más reglas en el archivo .htaccess. En otras palabras, si se cumple la condición de esta regla, el servidor no continuará evaluando las siguientes reglas y detendrá el procesamiento.

Estas banderas se utilizan en combinación con la directiva RewriteRule para especificar cómo se aplicará la regla y cómo el servidor responderá cuando se cumplan las condiciones.

Conclusión

En conclusión, prevenir el hotlinking es fundamental para proteger nuestros recursos, mantener la integridad de nuestro contenido y optimizar el rendimiento de nuestro sitio web, al ser proactivos y tomar medidas para evitar el hotlinking, no solo garantizamos una mejor experiencia para nuestros usuarios, sino que también nos aseguramos de mantener el control sobre nuestros archivos multimedia y reducir los costos asociados al consumo de ancho de banda y alojamiento, es responsabilidad de todo webmaster estar informado sobre este problema y tomar las medidas necesarias para proteger su sitio web y sus recursos.