Question

我对 next.js 有疑问。

我已经阅读了生成 HTML 文件的增量静态生成，但我有一个像下面这样的案例，

所以我的问题是在 next.js 下可能出现的行为？

目前对于我们的服务器端渲染，我们使用简单的 node.js。

当用户访问页面 www.sample/home?number=1
Node.js 将向另一台服务器请求数据。
一旦收到数据，Nodejs 就会创建 const resultHTML = ReactDOMServer.renderToString(<Home data={data} />)
字符串结果会缓存到redis中
下次当用户和 1 号查询相同时，我们将立即返回 resultHTML。

下面不是真正的代码，大致是这样的

import express from 'express'
import React from 'react'
import ReactDOMServer from 'react-dom/server'

import App from '../src/App'

const PORT = 8080
const app = express()

const router = express.Router()


app.get('/home', async (req,res) => {
  const number = req.query.number
  
  let resultHTML = checkRedisForNumber(number);
  
  if(!resultHTML){
    const data = await fetch('urlToData');
    resultHTML = ReactDOMServer.renderToString(<Home data={data} />)
    cacheResultToRedis(number, result); 
    // future user that use same query will be served from redis
    // this way server does not waste cpu power trying to renderToString
  }

  res.setHeader('content-type', 'text/html');
  res.send(resultHTML);

})

据我所知，getServerSideProps() 会返回 props，并且将始终执行第 3 步。

为什么需要跳过第 3 步？

我们预计在高流量期间每秒有 1000 - 2000 名唯一身份访问者。
由于这个查询的页面实际上已经在 step3 中创建并保持不变，我们可以将其存储在缓存中并立即返回给用户

Next.js 缓存 getServerSideProps 或 getStaticPath

0 个答案: