Tenemos un proyecto que contiene una ruta dinámica [productId], y dentro de esta página, tenemos varias otras páginas que incluyen rutas generales opcionales. Aquí está la estructura en la carpeta de páginas:
[productId] contentOne [[...slugOne]] El problema es que el catch-all opcional no funciona correctamente cuando las páginas se generan estáticamente. Ej: productId/contentOne no funciona, pero productOne/contentOne/extra funciona El problema ocurre solo cuando se implementa en vercel. Todas las rutas funcionan perfectamente en local.
Aquí está el getStaticPaths:
export async function getStaticPaths() { return { paths: [], fallback: true, } }Aquí está el getStaticProps :
export async function getStaticProps({ locale }) { return { props: { test: 'test', ...(await serverSideTranslations(locale, ['common'])), } } }Tenemos un problema abierto para esto: https://github.com/vercel/next.js/issues/30631
Mientras tanto, tuvimos que usar reescrituras (esto va al archivo next.config):
async rewrites() { return { beforeFiles: [ { source: '/:productId/contentOne', destination: '/:productId/contentOne/index' } ] }Al usar getStaticPaths para generar sus páginas, establecer { fallback: true } no da como resultado un 404 . Durante el desarrollo, funciona porque el desarrollo usa una versión de Optimización estática automática en la que Next ofrece un sitio renderizado por servidor incluso si las páginas van a ser estáticas.
Si está ejecutando un sitio de SSR con Next, la configuración de fallback mostrará una página estática con accesorios vacíos. Ese es el comportamiento esperado (si eso es lo que le sucede a usted) y le corresponde a usted manejar esa página, ya sea redirigiendo el lado del cliente o mostrando su propia página de tipo 404 o contenido faltante.
Si está utilizando next export para crear y exportar sus páginas, la configuración de fallback no hace nada (el comportamiento esperado al usar next export ), lo que significa que la página simplemente no existirá y su servidor debe manejar el 404, ya sea sirviendo una página de error 404 o redirigir al usuario a otro lugar.
No estoy seguro de lo que quiere decir con "no funciona". ¿Le está dando un error 404 o una página vacía? De cualquier manera, lo anterior es por qué.