Aquí hay un problema.
Está funcionando la construcción del proyecto porque tenemos el proyecto ya subido en la nube y estamos usando ese API en lugar de la del proyecto. De intentar usar la del proyecto no funcionaría el build.
Aquí https://nextjs.org/docs/basic-features/data-fetching#write-server-side-code-directly ya dicen “You should not fetch an API route from getStaticProps…” . Es decir está ok para datos estáticos, no dinámicos. Sí fuese un API externa podría servir, pero hasta volver a realizar una construcción podríamos tener datos desactualizados en nuestra página estática.
La forma en la que lo estoy haciendo el SSR es usando una variable de entorno
export async function getServerSideProps(/* params */) {
const response: TAPIAvoResponse = await fetch(
`${process.env.API_HOST}/api/avo`
).then((response) => response.json())
return {
props: {
productList: response.data,
},
}
}
En el package
"dev": "API_HOST=http://localhost:3000 next",
Si queremos probar la construcción y luego ejectuarla es sólo , a la hora de ejecutar
API_HOST=http://localhost:3000 npm run start
o
API_HOST=http://localhost:3000 yarn start
Una vez subida a Vercel, es simplemente configurar una variable de entorno con el host de nuestro API, que nos lo da cuando publica.
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?
o inicia sesión.