"El buen diseño es obvio. El gran diseño es transparente"
- Joe Sparano

Como hacer una redirección en Javascript

2 minutos de lectura
Fecha: 27/3/2019

Para hacer una redirección en Javascript tenemos diferentes métodos. Y prácticamente todos hacen lo mismo, pero hay matices.

Veamos las dos maneras clásicas de hacerlo. La primera es usando window.location.replace(...) y es la manera más correcta de hacerlo.

La razón es sencilla estamos hablando de hacer una redirección en Javascript, no de hacer una navegación.

Y este detalle es importante, cuando tu rediriges a otra url es porque realmente no quieres que el usuario este ahí, si fuera que el usuario ha realizado una acción (como pulsar un botón) entonces sería otra historia.

Manera correcta de hacer una redirección

Cuando usamos window.location.replace nos lleva a otra url pero además no guarda la página original que lanza esa redirección en tu historia de navegación.

De manera que cuando pulses el botón de ir atrás en tu navegador no te va a devolver a la página que hizo la redirección. Te llevará a la anterior si existe.

Puedes comprobarlo en la documentación de Mozilla pulsando en este enlace.

Otra manera de hacer esto mismo es

window.location = '...'.

Un detalle que a mucha gente se le pasa es que la url tienes que escribirla de forma absoluta. Sino entiende que es relativa y la concatena a la url actual.

Por ejemplo, si estas en otra página y quieres hacer una redirección a la mía no te sirve esto:

window.location.replace("oscarlijo.com");

Ni siquiera te vale esto:

window.location.replace("www.oscarlijo.com");

Tienes que escribirlo así:

window.location.replace("https://www.oscarlijo.com");

Otras maneras de hacer una redirección

La otra manera de hacer una redirección en Javascript es usar:

window.location.href(...).

Pero de esta manera más que una redirección estamos ejecutando una navegación, porque a diferencia del caso anterior ahora si que la página se ha quedado guardada en tu historia de navegación.

Otro método para hacerlo es:

window.location.assign(...)

Que al igual que el caso anterior, hace el registro en el historial de navegación.

Por lo tanto estas maneras de hacerlo son menos recomendables.