NextJs：设置状态代码404，而无需重定向

Question

我正在尝试解决我们的Web应用程序的特定要求。 我们有一个“商品”页面，如果商品售罄，该页面应继续显示商品，但该页面的响应码必须设置为404。 我正在尝试类似的事情：

在页面/[id]/Item.tsx中：

static async getInitialProps(ctx) {
   //retrieve item
   if (item.isSoldOut) {
       ctx.res.statusCode = 404;
   }
   //all other stuff
}

，但它将自动重定向到状态代码为302的首页。 如何实现这种行为？

Answer 1

Next.js文档建议使用getStaticProps或getServerSideProps代替getInitialProps（https://nextjs.org/docs/api-reference/data-fetching/getInitialProps）

您可以使用getServerSideProps进行以下操作

export const getServerSideProps: GetServerSideProps = async ({ req, res }) => {
    res.statusCode = 404;
    return { props: {} }
}

使用getInitialProps可以执行以下操作：

static async getInitialProps({res}) {
    // server side
    if(res) res.statusCode = 404;

    // client side
    return { statusCode : 4040 }
}