Configurar rutas de reserva
Hay una ruta del lado cliente denominada /products en la aplicación front-end que muestra una lista de productos para la lista de la compra. Cuando vaya a /products en la aplicación mediante el vínculo Productos, la barra de direcciones del explorador confirma que se encuentra en /products. Cuando actualice el explorador mientras se encuentre en esta página, quiere que la aplicación se actualice y muestre los productos de nuevo. Pero sin una ruta de reserva, verá un error 404 que indica que no se puede encontrar la página.
Verá un error 404 al actualizar la página porque el explorador envía una solicitud a la plataforma de hospedaje para servir /products, Pero no hay ninguna página en el servidor denominada products que se pueda servir.
Afortunadamente, es un problema fácil de resolver si se crea una ruta de reserva. Una ruta de reserva es aquella que coincide con todas las solicitudes de página no coincidentes en el servidor.
Configurar una ruta de reserva
Azure Static Web Apps admite reglas de enrutamiento personalizadas definidas en un archivo staticwebapp.config.json opcional ubicado en la carpeta de origen de la aplicación. Puede definir una ruta de reserva de navegación en el objeto navigationFallback. Una configuración de ruta de reserva común es similar a la de este ejemplo.
{
"navigationFallback": {
"rewrite": "/index.html",
"exclude": ["/_framework/*", "/css/*"]
}
}
| Configuración | valor | Descripción |
|---|---|---|
| rewrite | /index.html |
El archivo que se va a servir cuando una ruta no coincida con ningún otro archivo. |
| exclude | ["/_framework/*", "/css/*"] |
Rutas de acceso que se omitirán del enrutamiento de reserva. |
La regla de reserva de navegación se aplica después de otras reglas de enrutamiento que aparezcan en el archivo staticwebapp.config.json.
Ubicación del archivo de rutas
La ubicación recomendada del archivo staticwebapp.config.json es la carpeta establecida como app_location en el archivo de flujo de trabajo. Sin embargo, el archivo se puede colocar en cualquier ubicación dentro de la carpeta de código fuente de la aplicación.