En SingleBlogPost.jsx tengo:
export async function getStaticPaths() { const res = await fetch("http://localhost:1337/api/posts"); let { data } = await res.json(); const paths = data.map((data) => ({ params: { slug: data.attributes.slug }, })); return { paths, fallback: "blocking", }; }donde genero páginas de blog por su slug. Pero luego en getStaticProps necesito buscar una sola publicación por slug pero quiero hacerlo por id.
export async function getStaticProps(context) { console.log("context", context); const { slug } = context.params; console.log("slug is:", slug); const res = await fetch("http://localhost:1337/api/posts"); const { data } = await res.json(); return { props: { data, }, revalidate: 10, // In seconds }; }Y quiero mantener una URL como /blog/:slug , no quiero incluir una identificación. en url. Cuando ya busco todas las publicaciones en getStaticPaths, ¿cómo puedo acceder a la identificación de la publicación en getStaticProps para evitar la recuperación por slug?
Encontré un trabajo conciso que usa el paquete object-hash . Básicamente, creo un hash del objeto params y lo uso para crear el nombre de archivo tmp tanto en el set como en el get. El archivo tmp contiene un json con los datos que quiero pasar entre las dos infames devoluciones de llamadas estáticas.
La esencia de esto:
function setParamsData({params, data}) { const hash = objectHash(params) const tmpFile = `/tmp/${hash}.json` fs.writeFileSync(tmpFile, JSON.stringify(data)) } function getParamsData (context) { const hash = objectHash(context.params) const tmpFile = `/tmp/${hash}.json` context.data = JSON.parse(fs.readFileSync(tmpFile)) return context } Luego podemos usar estos ayudantes en las devoluciones de llamada getStaticPaths y getStaticProps para pasar datos entre ellos.
export function getStaticPaths(context) { setParamsData({...context, data: {some: 'extra data'}) return { paths: [], fallback: false, } } export function getStaticProps(context) { context = getParamsData(context) context.data // => {some: 'extra data'} }Estoy seguro de que alguien puede pensar en una API mejor que reasignar una variable de argumento.
Es probable que la creación del archivo tmp no sea lo suficientemente independiente del sistema operativo y podría mejorar.
Parece que recientemente se lanzó una solución alternativa usando un caché del sistema de archivos.
El quid de la solución es que guardan el cuerpo del objeto en la memoria, usando algo como esto:
this.cache = Object.create(null)
y crear métodos para actualizar y obtener datos de la memoria caché.
Discusión aquí: https://github.com/vercel/next.js/discussions/11272#discussioncomment-2257876
Código de ejemplo: https://github.com/vercel/examples/blob/main/build-output-api/serverless-functions/.vercel/output/functions/index.func/node_modules/y18n/index.js#L139: 10