Question

伙计们，我继承了一个由nextjs构建并在Netlify上运行的项目。我正在尝试在用户使用IE时加载组件。在本地，我能够呈现组件视图而没有任何问题。但是当构建运行（代码已推送到特定分支）时，该构建在Netlify上失败。 Netlify似乎不喜欢以下内容。

const userAgent = props ? props.req.headers['user-agent'] : navigator.userAgent

打开任何建议。我是Netlify的新手，只是尝试显示一个组件来让用户知道不支持其浏览器。以下是我在_document.js

中拥有的代码

_document.js

class MyDocument extends Document {

 static async getInitialProps(props) {
  const page = props.renderPage()
  const userAgent = props ? props.req.headers['user-agent'] : navigator.userAgent

  return {
    ...page,
    userAgent
  }
 }

renderBrowserSupport() {
  let msie = this.props.userAgent.indexOf('MSIE ');
  let ie11 = this.props.userAgent.indexOf('Trident/');

  if(msie > 0 || ie11 > 0) {
    return (
      <BrowserSupport/>
    )
  }

  else return false;
}

render() {
  <html lang="en">

  <body>
  {this.renderBrowserSupport()}
  </body>

  </html>
 }
}

export default MyDocument

运行npm run build时出错

Cannot read property 'user-agent' of undefined

Answer 1

在向_document.js添加代码时遇到了几个问题，因此我采用了以下不同的方法：

创建了路由更新浏览器
在IE中添加了带有消息传递和替代浏览器的组件
添加了脚本来检查浏览器是IE 11还是IE，并重定向到更新浏览器页面

Nextjs getInitialProps错误导致无法在Netlify上构建

1 个答案: