Skip to main content
se añadió 1 carácter en el cuerpo
Origen Enlace
Pablo Lozano
  • 49.9k
  • 8
  • 55
  • 92

La solución no depende tu código, sino del servidor web. Trato de explicarlo:

Para que una SPA (Single Page Application, Aplicación de una sola página) pueda refrescarse de ese modo lo que hay que hacer es deshabilitar la respuesta 404 de tu servidor.

Supongamos que:

  1. Tu aplicación web carga todo (y por tanto tiene su raíz en http://localhost/).

  2. El usuario navega, pasando de la raíz (/) a otra página (/ApiHistory). Realmente no se ha hecho una petición al servidor, sino que tu aplicación cambia la URL del navegador.

  3. El usuario refresca la aplicación o (un escenario habitual) va directamente a esta dirección porque la tiene en sus Favoritos.

  4. El servidor recibe la petición y no encuentra esa página.

Estamos en el punto interesante: el servidor puede...

  • Responder con un HTTP status 404: El navegador mostrará una página de error con un mensaje, que puede ser la respuesta del navegador o una página propia (suele depender del tamaño de la respuesta).
  • Redirigir a otra página: Es muy típico tener una página que muestre el 404 de un modo más bonito y personalizado, como hace por ejemplo StackOverflow.

Ahora bien, si la página de error la defines como la página inicial de tu aplicación (/), ¿qué ocurre? Pues que tu página se carga con la URL http://localhost/ApiHistory. Una vez que tu aplicación se ha inicializado no tiene más que mirar la URL y mostrar la página correspondiente.

Es por esto que los frameworks como React o Angular suelen usar un router que se encarga de gestionar, como una máquina de estados, qué URL es la actual y qué se tiene que mostrar en esa URL.

Por tanto, si usas Apache, o Nginx o cualquier otro servidor web, tendrás que mirar la documentación correspondiente y configurar la gestión del error 404 para que se adecue a lo que necesitas.

En Nginx sería añadir a la configuración algo como

try_files $uri $uri/ /index.html;

En Apache sería (creo) añadir algo como

ErrorDocument 404 /index.htmlApiHistory/

en tu fichero .htaccess

La solución no depende tu código, sino del servidor web. Trato de explicarlo:

Para que una SPA (Single Page Application, Aplicación de una sola página) pueda refrescarse de ese modo lo que hay que hacer es deshabilitar la respuesta 404 de tu servidor.

Supongamos que:

  1. Tu aplicación web carga todo (y por tanto tiene su raíz en http://localhost/).

  2. El usuario navega, pasando de la raíz (/) a otra página (/ApiHistory). Realmente no se ha hecho una petición al servidor, sino que tu aplicación cambia la URL del navegador.

  3. El usuario refresca la aplicación o (un escenario habitual) va directamente a esta dirección porque la tiene en sus Favoritos.

  4. El servidor recibe la petición y no encuentra esa página.

Estamos en el punto interesante: el servidor puede...

  • Responder con un HTTP status 404: El navegador mostrará una página de error con un mensaje, que puede ser la respuesta del navegador o una página propia (suele depender del tamaño de la respuesta).
  • Redirigir a otra página: Es muy típico tener una página que muestre el 404 de un modo más bonito y personalizado, como hace por ejemplo StackOverflow.

Ahora bien, si la página de error la defines como la página inicial de tu aplicación (/), ¿qué ocurre? Pues que tu página se carga con la URL http://localhost/ApiHistory. Una vez que tu aplicación se ha inicializado no tiene más que mirar la URL y mostrar la página correspondiente.

Es por esto que los frameworks como React o Angular suelen usar un router que se encarga de gestionar, como una máquina de estados, qué URL es la actual y qué se tiene que mostrar en esa URL.

Por tanto, si usas Apache, o Nginx o cualquier otro servidor web, tendrás que mirar la documentación correspondiente y configurar la gestión del error 404 para que se adecue a lo que necesitas.

En Nginx sería añadir a la configuración algo como

try_files $uri $uri/ /index.html;

En Apache sería (creo) añadir algo como

ErrorDocument 404 /index.html

en tu fichero .htaccess

La solución no depende tu código, sino del servidor web. Trato de explicarlo:

Para que una SPA (Single Page Application, Aplicación de una sola página) pueda refrescarse de ese modo lo que hay que hacer es deshabilitar la respuesta 404 de tu servidor.

Supongamos que:

  1. Tu aplicación web carga todo (y por tanto tiene su raíz en http://localhost/).

  2. El usuario navega, pasando de la raíz (/) a otra página (/ApiHistory). Realmente no se ha hecho una petición al servidor, sino que tu aplicación cambia la URL del navegador.

  3. El usuario refresca la aplicación o (un escenario habitual) va directamente a esta dirección porque la tiene en sus Favoritos.

  4. El servidor recibe la petición y no encuentra esa página.

Estamos en el punto interesante: el servidor puede...

  • Responder con un HTTP status 404: El navegador mostrará una página de error con un mensaje, que puede ser la respuesta del navegador o una página propia (suele depender del tamaño de la respuesta).
  • Redirigir a otra página: Es muy típico tener una página que muestre el 404 de un modo más bonito y personalizado, como hace por ejemplo StackOverflow.

Ahora bien, si la página de error la defines como la página inicial de tu aplicación (/), ¿qué ocurre? Pues que tu página se carga con la URL http://localhost/ApiHistory. Una vez que tu aplicación se ha inicializado no tiene más que mirar la URL y mostrar la página correspondiente.

Es por esto que los frameworks como React o Angular suelen usar un router que se encarga de gestionar, como una máquina de estados, qué URL es la actual y qué se tiene que mostrar en esa URL.

Por tanto, si usas Apache, o Nginx o cualquier otro servidor web, tendrás que mirar la documentación correspondiente y configurar la gestión del error 404 para que se adecue a lo que necesitas.

En Nginx sería añadir a la configuración algo como

try_files $uri $uri/ /index.html;

En Apache sería (creo) añadir algo como

ErrorDocument 404 /ApiHistory/

en tu fichero .htaccess

Origen Enlace
Pablo Lozano
  • 49.9k
  • 8
  • 55
  • 92

La solución no depende tu código, sino del servidor web. Trato de explicarlo:

Para que una SPA (Single Page Application, Aplicación de una sola página) pueda refrescarse de ese modo lo que hay que hacer es deshabilitar la respuesta 404 de tu servidor.

Supongamos que:

  1. Tu aplicación web carga todo (y por tanto tiene su raíz en http://localhost/).

  2. El usuario navega, pasando de la raíz (/) a otra página (/ApiHistory). Realmente no se ha hecho una petición al servidor, sino que tu aplicación cambia la URL del navegador.

  3. El usuario refresca la aplicación o (un escenario habitual) va directamente a esta dirección porque la tiene en sus Favoritos.

  4. El servidor recibe la petición y no encuentra esa página.

Estamos en el punto interesante: el servidor puede...

  • Responder con un HTTP status 404: El navegador mostrará una página de error con un mensaje, que puede ser la respuesta del navegador o una página propia (suele depender del tamaño de la respuesta).
  • Redirigir a otra página: Es muy típico tener una página que muestre el 404 de un modo más bonito y personalizado, como hace por ejemplo StackOverflow.

Ahora bien, si la página de error la defines como la página inicial de tu aplicación (/), ¿qué ocurre? Pues que tu página se carga con la URL http://localhost/ApiHistory. Una vez que tu aplicación se ha inicializado no tiene más que mirar la URL y mostrar la página correspondiente.

Es por esto que los frameworks como React o Angular suelen usar un router que se encarga de gestionar, como una máquina de estados, qué URL es la actual y qué se tiene que mostrar en esa URL.

Por tanto, si usas Apache, o Nginx o cualquier otro servidor web, tendrás que mirar la documentación correspondiente y configurar la gestión del error 404 para que se adecue a lo que necesitas.

En Nginx sería añadir a la configuración algo como

try_files $uri $uri/ /index.html;

En Apache sería (creo) añadir algo como

ErrorDocument 404 /index.html

en tu fichero .htaccess