从React / Next.js中的getInitalProps重定向

next / router在服务器上不可用，这是一条错误消息，提示找不到路由器，next / router只能在客户端使用。

为了在服务器中的getInitialProps中重定向用户，可以使用：

getInitialProps({server,res}){
 if(server)
  res.redirect('/');
 else
  Router.push('/');
}

使用Next.js（以及任何通用反应渲染），您的代码将在两个不同的环境中执行。首先在节点（在服务器上）中，然后在浏览器中。Next做一些工作来提供在这两种环境中都可以运行的统一功能，但是它们却大不相同。下一步不能也不会阻止您。好像您刚刚在浏览器中加载了页面，但是这里有一些实际情况的详细信息……

在客户端/浏览器上：

• 在地址栏中输入url（localhost：3000或其他），然后按Enter。
• GET请求发送到服务器（节点）。

在服务器/节点上：

• GET请求进入。
• Node给您一个请求和一个响应对象。
  • 也许您有一些Express路由/中间件。
• 在某个时候render()，使用请求和响应对象调用Next的函数。
• 下一步运行getInitialProps并传递请求/响应。
• renderToString()调用React ，它将调用以下React生命周期方法：
  • constructor()
  • componentWillMount()
  • render()
• React创建了一个发送给客户端的HTML字符串。

^这是节点。您无法访问window，您没有访问权限，fetch也不能使用下一路由器。这些是浏览器的东西。

返回客户端：

• 下载HTML并开始渲染。
• HTML中指向js / css文件的链接已下载/运行。
  • 这包括Next编译的js代码。
• render()运行React ，它将下载的HTML（DOM）与React虚拟DOM相关联。以下React生命周期方法将运行：
  • constructor()
  • componentWillMount()
  • render()
  • componentDidMount()
• 道具/状态更改时，所有其他生命周期方法（更新）将运行。

^这是浏览器。您有window，您有fetch，您可以使用下一台路由器。现在您没有Node请求/响应，但这似乎减少了人们的负担。

参考：组件生命周期