🖖 Inicio

SERVICIOS

Salir

nochedía

Tu peor pesadilla? Los trailing slashes de Gatsby y los redirect de Netlify, y Google se pone agresivo

400 palabras
2 minutos
October 15, 2019
bloggatsby

Generar páginas con slashes, quitarselos, para que luego Netlify te redirija hacia la versión con los slashes es un desastre, pero puedes corregirlo en Netlify con Prettifier

  1. Trailing Slashes
  2. Netlify

Trailing Slashes

Qué pasa con Gatsby y los trailing slashes?

Diferencias entre www.gilberto.com/mis_servicios y www.gilberto.com/mis_servicios/? Si te fijas verás el último / slash en la segunda versión

Ese slash lo pone Gatsby (www.gilberto.com seguro que está hecho con Gatsby), y se genera bien programáticamente o bien a partir del archivo mis_servicios.js (o incluso mis_servicios.mdx)

Pero puede no gustarnos eso

A mi no me gusta, parece que apuntes a un directorio con lo que prefiero quitarlos, algo que puedes hacer en Gatsby sin demasiados problemas

Luego te vas a tu Chrome Developer Tools o si no quieres te vas a www.redirect-checker.org y pones allí tu url sin slash y ... ves que no tienes un 200 sino una respuesta 301, que quiere decir una redirección

🔥🔥🔥🔥🔥

Luego ves que la página sin slash se ha redirigido a la versión con slash que sí que devuelve el 200 que tanto te gusta

Problemas?

Sí, al menos 2

  1. Esa redirección no es gratis, 200-300 ms como poco, y hasta 1 segundo extra de espera inútil con malas conexiones

Adiós experiencia de usuario, adiós SEO (Google nos penaliza), etc etc

  1. Google ahora tiene dos versiones de la misma página, pero es que además todo tu website apunta a las páginas sin slash, todo tu tráfico va a las páginas sin slash y por lo tanto todas se redirigen

Ahora ves a la Google Search Console y fíjate en cuantos errores por redirect tienes

Espectacular

Y Google no está contenta con esta duplicidad, no está nada contenta

Un desastre, vamos

Netlify

Esto pasa en bastantes servidores de páginas estáticas, pero aquí te hablo de Netlify

Netlify en teoria no hace estas redirecciones, puedes ver su documentación aquí

PERO, incluyen una función para añadir esos slashes, por si esto es lo que quieres

En mi caso esto no es lo que quería

Pero el problema viene de aquí Netlify -> Site -> Deploy -> Post processing -> Asset optimization

netlify

Esto es lo que te encuentras, que en teoría tienes las optimizaciones desactivadas, pero que en gris aparecen todas activadas

Esto es un error (no le veo la lógica), y en realidad lo que está pasando es que sí se te aplican esas "optimizaciones", incluida la primera, la Pretty URLs

Bien, pues simplemente desactivando la global y desmarcando la primera (al menos esa, la Pretty URLs) ya evitamos que se añada la trailing slash, que se redirija el tráfico, que Google se ponga agresivo, y conseguimos que el equilibrio vuelva a la fuerza

Así

netlify

Y Google vuelve a sonreír

Recuerda que tienes los cursos de Gatsby y Google Search Console aquí en cursos

Qué tal la entrada?
👌 Bien 🙌🙌
👍 Bien, pero algunas cosas podrían explicarse mejor 😬
🤷‍♂️ Da por sentadas demasiadas cosas 😒
🤷‍♂️ A ver, hay poca chicha 😬
🤷‍♂️ Los ejemplos no son muy claros 🙇‍♂️
🤷‍♂️ No se entiende, está mal escrito 👎
✍️ Hay errores, revísalo en cuanto puedas 🙏

Newsletter de kuworking, un correo de tanto en cuanto

Quizá te interese

Privacidad
by kuworking.com
[ 2020 >> kuworking ]