Cloudflare custom error pages function as expected for WAF Block errors, but they do not work as intended for 500 class errors

Cloudflare Community Help Request

I have a Next.js static site hosted on Cloudflare Pages at ( The site includes pages designed to override custom error pages on Cloudflare, as explained in the(

WAF Block Override Preview

When attempting to preview the WAF Block override, it functions correctly.

Issue with 500-class Error

However, when trying to view a 500-class error, a blank white screen appears, and the network tab indicates that some CSS file chunks are not loading, as illustrated in the screenshot below:

500-class Error - CSS Not Loading

Page Size

I’ve confirmed that the page size, as analyzed with Collapsify, is approximately 700KB, as seen in the following screenshot:

➜  cf-error-pages git:(main) ✗ collapsify -o collapse-waf.html
{"time":"2023-11-19T05:23:44.858Z","hostname":"Bhavins-MacBook-Pro.local","pid":12170,"level":"info","name":"collapsify-cli","message":"Collapsed Size: 712669 bytes"}

Seeking Assistance

I am seeking assistance in identifying and resolving this issue. Is it feasible to use a Next.js static page in this context? The error pages are hosted at I appreciate any help in resolving this matter.

500 class error preivew:

I can confirm that the issue specifically occurs on pages that require a Cloudflare error token (::[Cloudflare error token]::) and does not manifest on pages where this token is not necessary. The token is present on my page.

Your Collapsify example was for, which has a self-signed certificate, and won’t load due to that not being secure.

From your error page list at, your 5xx page at points to many resources at, so that’s not going to work due to the SSL issue.

I’ve just added a CNAME record to point the errors subdomain on to a Cloudflare Pages site. The preview for custom pages override is successful for However, it encounters issues with, resulting in a React error.

My suspicion is that this problem stems from the necessity of a custom Cloudflare token ::CLOUDFLARE_ERROR_500S_BOX::, for the 5xx error, and there may be an issue with its parsing. While I’m not an expert, the fact that it works for /waf-block but not for any page requiring a Cloudflare token mean something?.

See it works for /waf-block

However, it fails the preview for, which includes the ::CLOUDFLARE_ERROR_1000S_BOX:: token.

Moreover, when I attempt to use the same page, namely, to override WAF Block, it works, indicating a potential issue with the Cloudflare token swapping process.