Question

和API端点（快速）发送404。
return res.status(404).json({ message: 'Not Found !!!' })

在_app组件中

static async getInitialProps({ Component, ctx }) {
    try {
      const pageProps = Component.getInitialProps
        ? await Component.getInitialProps(ctx)
        : {}

      const statusCode = ctx.res && ctx.res.statusCode

      return {
        pageProps,
        statusCode
      }
     } catch (err) {
       // What to do here?
     }

应用程序组件在另一个组件中调用getInitialProps ...这里是调用API，它将返回404状态。

static async getInitialProps(ctx) {
   try {
      const response = await axios.get(route.API_POST(id))
      // do something with response
    } catch (err) {
      //???????
    }
}

只有，不是。它返回200。

当Express端点返回404状态时，如何在NextJS中呈现404页面？

Answer 1

在自定义服务器中，您正在执行以下操作：

app.render(req, res, page, params)

如果通过将res更改为404来修改statusCode对象，则在NextJS的路由组件中，您将拥有res对象和statusCode属性。如果res.statusCode从不为404，请尝试在getInitialProps中覆盖它

static async getInitialProps({ Component, ctx }) {
    try {
      const pageProps = Component.getInitialProps
        ? await Component.getInitialProps(ctx)
        : {}

      const statusCode = ctx.res && ctx.res.statusCode

     ctx.res.statusCode = 404

      return {
        pageProps,
        statusCode
      }
     } catch (err) {
       // What to do here?
       // Here you cannot do anything because 
       // you don’t have any throw in the previous statements
     }
}

我注意到上面的代码与getInitialProps中的_app.js有关，我不知道此代码是否在此组件中有效。但是，尝试添加一条路线并执行以下操作：

static getInitialProps({ res }) {
  if (res) {
    res.statusCode = 404
  }

  return {}
}

NextJS：Express端点返回404时的404页面？

1 个答案: