En NextJS, he creado una página dinámica para obtener y mostrar contenido del blog, con la siguiente URL https://example.com/blog/[blogId]
Pero cuando trato de acceder a la URL en producción, el usuario es redirigido a la URL raíz (página de inicio) en lugar de a la página de contenido del blog.
A continuación se muestra la estructura de mi carpeta.
pages |__ blog |___ [blogId].tsx¿Alguien puede decirme qué está pasando aquí? PD: Localmente esto está funcionando bien.
Si desea utilizar [blogId] como la parte variable de su cadena de URL, debe asegurarse de que los datos que se entregan desde su fuente de datos coincidan exactamente.
getStaticPaths debería generar una matriz de blogID en su caso, algo como esto:
export async function getStaticPaths() { const pages = await getPathsForBlogs(); return { paths: pages?.map(({ node }) => `/blog/${blogID}`) || [], fallback: false, } } En getStaticPages , ingiere esa pila de paths y Next generará una página en cada blogID . En este ejemplo, enviamos la carga útil de datos al componente en la page de parámetros personalizados, que deconstruiría en su componente /pages/blog.js .
export async function getStaticProps({ params, preview = false, previewData }) { const pageData = await getSingleActionPage(params.blogID, previewData); return { props: { preview, page: pageData ?? null, }, revalidate: 60, } }