getServerSideProps 与直接在 React 中获取

Question

我对 NextJS 的 getServerSideProps 有点困惑。

在文档中您可以找到此解释。

例如，假设您的页面需要预渲染经常更新的数据（从外部 API 获取）。您可以编写 getServerSideProps 来获取此数据并将其传递给 Page

让我困惑的是，如果你可以简单地在 React 组件本身中每隔 x 秒获取一次数据（在通过 getStaticProps 获取缩写数据之后），为什么要使用 getServerSideProps 呢？

使用 getServerSideProps 比仅使用 React 方式有优势吗？

例如这样：

 useEffect(() => {
    const interval=setInterval(()=>{
      const fetchdata = async () => {
        const res = await fetch("url")
        const data = await res.json()
        setsongs(data)
      }
      fetchdata()
     },15000)
     return()=>clearInterval(interval)
  }, [])

Answer 1

根据文档，getServerSideProps每次请求都会获取 API 数据。因此，使用时间间隔请求（就像您在反应版本中提到的那样）或使用 请求之间存在差异getServerSideProps。\n此外，请记住，这getServerSideProps是在服务器端实现的，并且在 SEO 很重要的情况下可能很有用。但是，如果服务器在您使用的情况下出现故障，getServerSideProps则将不再提供整个页面。\n https://nextjs.org/docs/basic-features/data-fetching#getserversideprops-server-side-rendering

\n

同时，当 SEO 不相关时，在客户端获取数据（或 React 方式）非常有用，页面不需要预渲染\xe2\x80\x99。\n https://nextjs.org/docs/基本功能/数据获取#在客户端获取数据

\n

getServerSideProps在我看来，如果您在显示的数据经常更改并且用户应该看到最新的数据时使用会更好，SEO 至关重要，并且较长的第一个字节时间 (TTFB) 是可以接受的。

\n