CORS Configuration Issue in Firefox – Works in Chrome
Hi,
I'm developing a website that needs to authenticate with an external endpoint. Once authenticated, the website receives a session cookie that it uses for subsequent API requests.
I've configured the CORS headers on both Apache and Nginx, but I can't get it to work in Firefox. Interestingly, the same setup works perfectly in Google Chrome.
Here's an example of the headers I receive using a curl call:
curl -X OPTIONS https://crlliria.moval.es/web/session/authenticate \ -H "Origin: https://gis.moval.es" \ -H "Access-Control-Request-Method: POST" -I -k
HTTP/1.1 204 No Content Server: nginx Date: Wed, 04 Dec 2024 10:23:24 GMT Connection: keep-alive Access-Control-Allow-Origin: https://gis.moval.es Access-Control-Allow-Credentials: true Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE Access-Control-Allow-Headers: DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range Access-Control-Max-Age: 1728000 Content-Type: text/plain; charset=utf-8 Content-Length: 0
Despite these headers appearing correct, Firefox throws the following error:
"Credential is not supported if the CORS header ‘Access-Control-Allow-Origin’ is ‘*’."
I know the Access-Control-Allow-Origin value is not * (it's set to https://gis.moval.es), so this message might not reflect the real issue. However, I can't figure out how to debug it further.
Questions:
Is there anything specific about Firefox's handling of CORS and credentials that might cause this issue? Are there tools or techniques I can use to diagnose the actual problem? Could there be a subtle discrepancy in the request or response that Firefox is stricter about compared to Chrome? Any help or suggestions would be greatly appreciated!
Thanks in advance.
所有回覆 (1)
Hi Salvador Sánchez Aroca!
It sounds like you're facing a frustrating issue with CORS and authentication in Firefox. Let’s see if we can troubleshoot this together.
Cross-Origin Credentials Rule: Firefox is stricter compared to Chrome when it comes to handling CORS with credentials. Even though you have Access-Control-Allow-Origin set correctly, make sure that both the request and response are handling credentials properly. For Access-Control-Allow-Credentials to be true, you need to ensure that Access-Control-Allow-Origin is not set to * — which appears to be correct in your case.
Check Preflight Requests: Since you’re using POST, ensure your server correctly responds to the preflight OPTIONS request. Review the headers returned in response to the OPTIONS request to confirm they match your expectations.
Use Firefox Debugging Tools: The Firefox Developer Tools can help you analyze network requests. Look at the "Network" tab to check the headers for both your OPTIONS and POST requests. This may reveal if any headers are missing.
CORS and Path Matching: Check if there’s any mismatch between your origin (the referring domain) and the headers set on your server. Sometimes, discrepancies in subdomain or trailing slashes can cause issues.
Browser Cache: Clear your browser cache, as old response headers might affect new requests. Test with Different Origins: If possible, try testing with a simpler setup to see if it’s an issue with your specific domain configuration. This can help isolate the problem.
If the issue persists, consider setting up a minimal example or using tools like Postman or Insomnia to replicate the request. This can help determine if it’s a browser-specific issue or a problem with your server setup.
I hope this helps, and best of luck with your project! Cheers!