Hello everyone,
I’m a front-end developer and we have API endpoints behind Zero Trust. I can connect to the endpoint directly using WARP after authenticating I can see a CF_Authorization and CF_Session cookies are set and that’s great.
However we also need to test code locally and we do this running next on localhost:9001
which connects to these endpoints at e.g. api.example.com
.
I’ve configured axios to route requests from the server and attach CF-Access-Client-Id
and CF-Access-Client-Secret
headers pulled from Doppler and set in process.env and this seems to work during build. This only happens on the server, these headers are not leaked to the client.
However in browser all API requests fail. I see a 302 to url’s like this https://DOMAIN.cloudflareaccess.com/cdn-cgi/access/login/ENDPOINT?kid=XXXX
and then subsequent 302 with a response header like this: https://ENDPOINT/cdn-cgi/access/authorized?nonce=YYYY
and finally a 400 with a request like this https://ENDPOINT/cdn-cgi/access/authorized?nonce=YYYY
The original requests all have a CF_AppSession cookie (but no CF_Authorization cookie). The 302 redirection attaches CF_Authorization
& CF_Session
request cookies and then the 400 has no request cookies
I don’t really know how this has been configured at the Zero Trust side and Devops seem to think this is a front-end problem?
I feel like I’m going round in circles - hopefully someone can help me understand the following:
- Is it even possible to access an endpoint behind Zero Trust via localhost like this?
- Am I doing something wrong and / or is there something I should be testing passing into or out of Axios requests?
- Could this be an issue with my front-end code or something at the Cloudflare level?
Thanks so much in advance for any help / suggestions