Cloudflare Access CORS Problem

Zero Trust Access
1

Hi everyone,

I am having an Issue with Cloudflare Access. I have a frontend at: “web.domain.com” and an API at “api.domain.com”, they are both for a development environment, so I want to put them both behind Cloudflare Access. I configured the Cloudflare Access App like this: “*.domain.com”, so I would protect both with the same application. As for the CORS settings, I have configured them the following way:
Enabled “Access-Control-Allow-Credentials”. Added in the “Access-Control-Allow-Origin” the origins: “web.domain.com” and “null”, as specified at the documentation (for some reason it does not allow me to select the “Allow All Origins” option). I have set “Allow all https headers” and “Allow all methods”.
For the “Cookie Settings”, I have the “None” option and “HTTP Only” and “Enable Cookie binding” set.

“web.domain.com” has a login page that, when submitted, makes and API call to authenticate the user to “api.domain.com”. My problem is the following: I go to “web.domain.com” and authenticate correctly (using the Google method) in Cloudflare Access. Then, when I enter the login form and submit it (so it makes de API call to “api.domain.com”), make the preflight correctly to the api (returns a 200 code and the access-control-* headears seem to be okay). To be more specific, the headers returned in the preflight call are: “access-control-allow-credentials: true”, “access-control-allow-headers: authorization,content-type”, “access-control-allow-methods: POST”, “access-control-allow-origin: https://web.domain.com”, “access-control-max-age: 3600”, " vary: Origin, Access-Control-Request-Method, Access-Control-Request-Headers, Accept-Encoding". Then, when it actually makes the API Call to “api.domain.com”, it returns a 302 and the location to redirect is set to “https://domain.cloudflareaccess.com/cdn-cgi/access/login/api.domain.com?kid=26c2a0777f421147da1339c8bccffe795432b138b7201e896f86e50e29faad72&redirect_url=%2Fv1%2Fusers%2Flogin&meta=e…”. Then it makes the request to this location and returns de login authentication html page of Cloudflare Access.

Does anybody knows how to fix it? Thank you in advance.

Pau

1 Like
2

If I’m not mistaken, when you authenticated to access one application (e.g. web.domain.com) doesn’t mean that you automatically have access to api.domain.com. Different applications need to be authenticated separately.

In your situation, it’s better not to protect your API using Cloudflare Access. Try using firewall rules to block API requests not coming from web.domain.com referer.

3

Hi, thank you for answering @erictung. web.domain.com isn’t the only place from which I need to access the API (other sites and even mobile devices), any ideas on how I could protect it using Cloudflare Access?

4

Hi,

Did you find any solutions? I have same problem with multiple domain API request.

5

We’re currently battling the same issues and CF support is not helping. Has anyone out there found a solution?

6

The same-origin Workers proxy that adds cf-access-client-* headers CORS · Cloudflare Zero Trust docs worked for me. My frontend is hosted by Pages.

7

I have the exact same setup and also looking for a solution to this - how do I authenticate a mobile app? Service Tokens?

8

Check this solution out: