attiliov
attiliov

Reputation: 61

NextJS not-found.tsx returns HTTP 200 Status Code

When I use NextJS's not-found.tsx file, it renders fine but it returns a 200 status code instead of 404. Any idea why? How can I fix this?

Upvotes: 0

Views: 1361

Answers (2)

Devon Ray
Devon Ray

Reputation: 840

Another potential cause, the one that i ran into is that if you are using a loading.js suspense page in your app route it turns your 404s into client responses, I couldn't find this anywhere in the nextjs documentation for the loading component https://nextjs.org/docs/app/api-reference/file-conventions/loading.

But I tried removing the loading.js file and it worked, i now have the correct http codes being returned.

Upvotes: 1

Yilmaz
Yilmaz

Reputation: 49581

I think since you are returning a valid custom component, it sets it as 200.

If you delete not-found.tsx and use this

import { notFound } from 'next/navigation'

inside the component

if(true) notFound()

if you hover over notFound

When used in a React server component, this will set the status code to 404. When used in a custom app route it will just send a 404 status.

Upvotes: 0

Related Questions