> 웹 프론트엔드 > JS 튜토리얼 > `getServerSideProps`(Next.js)에서 내부 API 호출에 `fetch()`를 사용해야 합니까?

`getServerSideProps`(Next.js)에서 내부 API 호출에 `fetch()`를 사용해야 합니까?

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에 적합합니다. 그러나 공식 문서에서는 getServerSideProps 내에서 내부 API 경로를 호출하기 위해 fetch()를 사용하지 말 것을 권고합니다.

회피 이유

getServerSideProps에서 내부 API 경로를 호출하는 것은 중복되기 때문입니다. 둘 다 서버에서 실행됩니다. 대신 API 경로의 로직을 getServerSideProps에서 직접 구현하여 불필요한 HTTP 요청을 방지해야 합니다.

대체 접근 방식

getServerSideProps에서 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 });
}
로그인 후 복사

pages/home.js(getServerSideProps 사용 공유 논리)

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

export async function getServerSideProps(context) {
  const data = await getData();
  // ... other operations ...
}
로그인 후 복사

위 내용은 `getServerSideProps`(Next.js)에서 내부 API 호출에 `fetch()`를 사용해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿