How can I force a page to revalidate after receiving a 404 error from an API?

[avt00]

Summary

I'm currently working with a third-party API that I have no control over, which provides data for my project. Sometimes, this API can delete or make certain records unavailable, which leads to 404 responses.

I've encountered a problem where outdated content from the data cache still shows up on my website. This happens because the revalidation strategy of Next.js does not cater to requests returning a 404 error from an API. So, I'm looking for ways to either proactively trigger cache revalidation or clear the cache for certain paths.

Here's a piece from the Next.js documentation:

"If an error is thrown while attempting to revalidate data, the last successfully generated data will continue to be served from the cache. On the next subsequent request, Next.js will retry revalidating the data."

What this means is my app continues to display pages that no longer exist since they're being served from the cache, regardless of the API returning a 404 error for those items. Also, the fetch() I perform from my server component shows a status 200. I'm unable to figure out a method to be notified when a page is no longer available on the API. I'm aware that "revalidatePath" exists but it's pretty much useless since fetch() seems to return a false 200 status response.

Additional information

No response

Example

No response

[mroutadi]

@avt00 did you find the answer?

[avt00]

No. This issue is still relevant.

[petr-like]

@avt00 any updates? Have same issue.

[avt00]

No. This issue is still relevant.

[sabrinalord]

Im also having the same issue