建置Next.js 網站進行生產時，使用getStaticProps 時可能會遇到「取得錯誤」和getStaticPaths 從API 路由取得資料。發生此錯誤的原因有很多。
在提供的程式碼中，您正在呼叫內部 API 路由 /api/products/${slug} ，來自 getStaticProps 內。不建議這樣做，因為 API 路由在建置期間不可用，從而導致獲取錯誤。
您應該編寫而不是取得 API 路由伺服器端程式碼直接在 getStaticProps 和 getStaticPaths 中。這些僅在伺服器端運行，並允許您直接使用伺服器端資源（例如資料庫查詢）編寫程式碼。
這是程式碼的修改版本：
// /pages/product/[slug]
import db from '../../../data/products'
// Remaining code..
export const getStaticProps = async ({ params: { slug }, locale }) => {
const result = db.filter(item => item.slug === slug)
const data = result.filter(item => item.locale === locale)[0]
const { title, keywords, description } = data
return {
props: {
data,
description,
keywords,
title
}
}
}
export const getStaticPaths = async () => {
const paths = db.map(({ slug, locale }) => ({ params: { slug: slug }, locale }))
return {
fallback: true,
paths,
}
}透過直接在getStaticProps 和getStaticPaths 中使用資料來源，您可以避免在建置時呼叫內部API 路由，從而解決了取得問題錯誤。
以上是為什麼在生產環境中建置 Next.js 靜態網站時出現「取得錯誤」？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
