服务器端渲染 (SSR)

您所在的位置：网站首页 › 前端服务器渲染 › 服务器端渲染 (SSR)

服务器端渲染 (SSR)

2024-07-14 01:38| 来源: 网络整理| 查看: 265

服务器端渲染 (SSR)

也称为 "SSR" 或 "动态渲染"。

¥Also referred to as "SSR" or "Dynamic Rendering".

如果页面使用服务器端渲染，则每个请求都会生成页面 HTML。

¥If a page uses Server-side Rendering, the page HTML is generated on each request.

要对页面使用服务器端渲染，你需要 export 一个名为 getServerSideProps 的 async 函数。服务器将在每次请求时调用此函数。

¥To use Server-side Rendering for a page, you need to export an async function called getServerSideProps. This function will be called by the server on every request.

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

¥For example, suppose that your page needs to pre-render frequently updated data (fetched from an external API). You can write getServerSideProps which fetches this data and passes it to Page like below:

export default function Page({ data }) { // Render data...}// This gets called on every requestexport async function getServerSideProps() { // Fetch data from external API const res = await fetch(`https://.../data`) const data = await res.json() // Pass data to the page via props return { props: { data } }}

正如你所看到的，getServerSideProps 与 getStaticProps 类似，但不同之处在于 getServerSideProps 在每个请求上运行，而不是在构建时运行。

¥As you can see, getServerSideProps is similar to getStaticProps, but the difference is that getServerSideProps is run on every request instead of on build time.

要了解有关 getServerSideProps 如何工作的更多信息，请查看我们的数据获取文档。

¥To learn more about how getServerSideProps works, check out our Data Fetching documentation.

【本文地址】

服务器端渲染 (SSR)

服务器端渲染 (SSR)

今日新闻

推荐新闻