[英]Error occurred prerendering page in Next JS
I created an API in next JS (in the pages\/api<\/code> folder) and I used it on a page in the
pages<\/code> folder.
我在下一个 JS 中(在
pages\/api<\/code>文件夹中)创建了一个 API,并在
pages<\/code>文件夹中的页面上使用了它。
When I run on the localhost (development stage), the API can be called correctly.当我在 localhost(开发阶段)上运行时,可以正确调用 API。 But when I deploy to Vercel there is an error during build.但是当我部署到 Vercel 时,在构建过程中会出现错误。
export const getStaticProps = async () => {
const baseUrlDribble = 'https://api.dribbble.com/v2';
const baseUrl = process.env.NODE_ENV === 'production' ?
'https://jovanka-samudra.vercel.app/api' : 'http://localhost:3000/api';
const resShots = await fetch(`${baseUrlDribble}/user/shots?access_token=${process.env.TOKEN_DRIBBLE}&page=1&per_page=9`);
const shots = await resShots.json();
const resResult = await fetch(`${baseUrl}/projects`);
const result = await resResult.json();
const projects = result.data.projects;
return {
props: {
shots,
projects,
},
revalidate: 1,
}
}
You should not fetch an internal API route from getStaticProps — instead, you can write the fetch code in API route directly in getStaticProps.您不应该从 getStaticProps 获取内部 API 路由 - 相反,您可以直接在 getStaticProps 中编写 API 路由中的获取代码。
https:\/\/nextjs.org\/docs\/basic-features\/data-fetching#write-server-side-code-directly<\/a> https:\/\/nextjs.org\/docs\/basic-features\/data-fetching#write-server-side-code-directly<\/a>
"
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.