Control Total de URLs en Astro: La Guía Definitiva de .htaccess (301 y 404)

Has seguido todos los pasos. Has montado tu web con Astro, has configurado tu despliegue automático en Hostinger y todo funciona a la perfección. Pero una mañana, te llega un correo de Google Search Console con un mensaje que te hiela la sangre: “Página duplicada sin URL canónica seleccionada”.

No has roto nada, Arquitecto. Acabas de chocar contra el muro que separa el mundo del desarrollo (tu PC) del mundo de la producción (el servidor).

Astro genera los archivos estáticos de tu web, pero no tiene poder para darle órdenes al servidor de Hostinger. Para eso, necesitamos un lenguaje que el servidor entienda, un “manual de instrucciones” que le diga exactamente cómo debe comportarse. Ese manual se llama .htaccess.

Hoy vamos a forjar este archivo para solucionar tres problemas críticos: el contenido duplicado, los enlaces rotos y las feas páginas de error 404.

1. El Enemigo Silencioso del SEO: El “Trailing Slash”

El problema del “Trailing Slash” ocurre cuando Google ve dos URLs distintas para el mismo contenido: tudominio.com/pagina y tudominio.com/pagina/. Para el buscador, son dos páginas idénticas compitiendo entre sí, lo que diluye tu autoridad SEO.

Astro, en su infinita sabiduría, nos da una solución parcial. En tu archivo astro.config.mjs, puedes añadir la regla: trailingSlash: 'always'

Esto hace que, al construir la web, Astro genere cada página dentro de una carpeta con un archivo index.html (ej: /pagina/index.html). ¡Genial! Pero esto no impide que un usuario (o el propio Google) pueda acceder a la URL sin la barra final.

El chivato de Google: Search Console no miente. Si ve dos URLs para el mismo contenido, te penalizará por contenido duplicado.

2. .htaccess: El Manual de Instrucciones del Servidor

Un archivo .htaccess es un fichero de configuración de texto plano que le da órdenes directas a servidores web como Apache o LiteSpeed (el que usa Hostinger).

Para que funcione, este archivo debe vivir en la carpeta public/ de tu proyecto de Astro. Cuando hagas el build, Astro lo copiará directamente a la raíz de tu servidor.

Forzando la barra final (/)

Para solucionar el problema del trailing slash de una vez por todas, añade este bloque de código a tu archivo public/.htaccess:

# --- FORZAR SIEMPRE LA BARRA FINAL (TRAILING SLASH) ---
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} !(.*)/$
RewriteRule ^(.*)$ https://%{HTTP_HOST}/$1/ [L,R=301]

Con estas reglas, si alguien intenta entrar a tudominio.com/pagina, el servidor le hará una redirección 301 (permanente) a tudominio.com/pagina/ antes de mostrarle el contenido. Problema resuelto.

3. La Máquina del Tiempo: Redirecciones 301 para no perder SEO

Imagina que publicaste un artículo con la URL /mi-primer-post y ahora quieres cambiarla a /guia-definitiva-astro. Si simplemente borras la vieja, todos los enlaces que apuntaban a ella se romperán y perderás el posicionamiento que ya habías ganado.

Una redirección 301 le dice a Google: “Oye, me he mudado de forma permanente. Todo el valor que tenía la URL vieja, pásaselo a esta nueva.”

Añade esta línea a tu .htaccess por cada artículo que renombres:

# --- REDIRECCIONES MANUALES DE ARTÍCULOS ---
Redirect 301 /mi-primer-post/ /guia-definitiva-astro/

4. El Error Amigable: Tu página 404 personalizada

Por defecto, si un usuario llega a una URL que no existe, Hostinger le muestra una página de error genérica, fea y que invita a cerrar la pestaña. Es un callejón sin salida.

Nosotros podemos convertir ese error en una oportunidad. En Astro, puedes crear una página 404.astro en tu carpeta src/pages/. En JRChub, por ejemplo, hemos metido un minijuego interactivo.

Para decirle al servidor que use tu página en lugar de la suya, añade esta línea a .htaccess:

# --- PÁGINA DE ERROR 404 PERSONALIZADA ---
ErrorDocument 404 /404.html

De la frustración a la interacción: Un buen 404 no solo retiene al usuario, sino que refuerza tu marca de “trasteador”.

El Código Maestro: Tu .htaccess definitivo

Aquí tienes la configuración completa y ordenada que usamos en JRChub para que solo tengas que copiar y pegar en tu archivo public/.htaccess:

# ==============================================================================
# JRCHUB - MANUAL DE INSTRUCCIONES DEL SERVIDOR (.HTACCESS)
# ==============================================================================

# --- FORZAR SIEMPRE LA BARRA FINAL (TRAILING SLASH) ---
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} !(.*)/$
RewriteRule ^(.*)$ https://%{HTTP_HOST}/$1/ [L,R=301]

# --- PÁGINA DE ERROR 404 PERSONALIZADA ---
ErrorDocument 404 /404.html

# --- REDIRECCIONES MANUALES DE ARTÍCULOS ---
# Redirect 301 /url-antigua/ /url-nueva-definitiva/
# Redirect 301 /otro-post-viejo/ /otro-post-nuevo/

El plano final: limpio, comentado y listo para desplegar.

🚀 ¿Y ahora qué? Tu Servidor está Blindado

Has dejado de ser un simple desarrollador para convertirte en un administrador de sistemas. Ahora controlas no solo el contenido, sino también cómo el servidor lo entrega al mundo.

El siguiente paso es vigilar que estas reglas funcionen correctamente:

1. Monitoriza Google: Usa la guía para indexar y revisar errores en Search Console para asegurarte de que Google reconoce tus redirecciones.
2. Elige un buen motor: Toda esta configuración depende de un servidor que te dé acceso a .htaccess. Si buscas un hosting que te dé libertad y potencia, este es el que usamos nosotros:

Conclusión

Dominar el archivo .htaccess es lo que separa a un sitio web amateur de una plataforma profesional. Has aprendido a hablarle al servidor en su propio idioma para defender tu SEO, guiar a tus usuarios y fortalecer tu marca.

¡Nos vemos en la terminal! 🛠️