首頁 > web前端 > js教程 > 您應該在 `getServerSideProps` (Next.js) 中使用 `fetch()` 進行內部 API 呼叫嗎?

您應該在 `getServerSideProps` (Next.js) 中使用 `fetch()` 進行內部 API 呼叫嗎?

Linda Hamilton
發布: 2024-11-13 03:08:02
原創
274 人瀏覽過

Should You Use `fetch()` for Internal API Calls in `getServerSideProps` (Next.js)?

使用 getServerSideProps 進行內部 API 取得? (Next.js)

在 Next.js 中,getServerSideProps 函數可讓您在渲染頁面之前從伺服器取得數據,使其適合 SEO。然而,官方文件建議不要使用 fetch() 在 getServerSideProps 中呼叫內部 API 路由。

避免的原因

從 getServerSideProps 呼叫內部 API 路由是多餘的,因為兩者都在伺服器上運行。相反,API 路由中的邏輯應直接在 getServerSideProps 中實現,以避免不必要的 HTTP 請求。

替代方法

在getServerSideProps 中利用API 路由中的邏輯:

  • 將取得邏輯(例如資料庫存取或外部API API )提取到一個單獨的函數中,該函數可以由API 路由和getServerSideProps 共用。
  • 在 API 路由中,呼叫此共享函數來取得並傳回資料。
  • 在 getServerSideProps 中,呼叫相同的共享函數直接從伺服器取得資料。

範例

pages/api/user.js(具有共享邏輯的API 路由)

import { getData } from "./userData";

export async function handler(req, res) {
  const data = await getData();
  res.status(200).json({ data });
}
登入後複製

(具有共享邏輯的API 路由)

import { getData } from "./api/user";

export async function getServerSideProps(context) {
  const data = await getData();
  // ... other operations ...
}
登入後複製
pages/home.js(使用getServerSideProps共享邏輯)

以上是您應該在 `getServerSideProps` (Next.js) 中使用 `fetch()` 進行內部 API 呼叫嗎?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板