JS Challenge/Challenge CORS issues on API

Hey there! :raised_hand:

I have a SPA application (Angular + API).
The frontend domain: domain.com
The API domain: some-api.domain.com
Both a protected with CF.

The CORS settings on the origin server of some-api.domain.com include domain.com (Access-Control-Allow-Origin: domain.com). Everything works fine if no CF challenge is running. But as soon an Cloudflare challenge is executed by WAF and passed I’m getting this error:

Access to fetch at ‘https://some-api.domain.com/api/translations/get-translations?somestuff=1’ from origin ‘https://domain.com’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.

So it seems like the FE can be consumed but the API does not.
I get btw the same problem when I try to protect FE + API with Cloudflare access, if I just protect the FE it works fine.

Any way to fix this for WAF rules challenge and for cf access?


Does anybody have any advice or idea on this?


Still happy for any hint!


This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.