We are currently building an Angular application backed with a RESTful API. The app tries to fetch a user's information with the following request URL: http://example.com:1337/api/users/1
. This resource responses with a HTTP 301 (Moved Permanently) and sets the location header where the resource has been moved to, e.g. Location=http://another-hostname.com:8088/new/users/1
.
Angular's HTTP client or rather the browser is handling this response automatically and redirects to this new location.
Sadly, in Chrome we get the following error message:
XMLHttpRequest cannot load http://example.com:1337/api/users/1. Redirect from 'http://example.com:1337/api/users/1' to 'http://another-hostname.com:8088/new/users/1' has been blocked by CORS policy: Request requires preflight, which is disallowed to follow cross-origin redirect.
Chrome skips a preflight request (CORS) before calling the GET to the new resource. We tested this with Firefox and there it is working quite well. Firefox issues a new preflight request and the GET request afterwards will be handled successfully.
So, I'm wondering what's the correct behavior here. Has anyone made a similar experience with 30x responses?
Is there a possibility to disable the automatic browser (or Angular HTTP client) redirect handling? So that we can handle the new GET manually with a brand new this.http.get(...)
.
Thanks for any advice,
Michael
Is there a possibility to disable the automatic browser (or Angular HTTP client) redirect handling?
No way for XMLHttpRequest (and Angular's $http therefore). Such option is provided in fetch()
, which is not crossbrowser yet.
But there's a workaround:
Determine the final request destination by a special preliminary
request (by examining XHR.responseURL).
This should be a simple request: only GET/POST/HEAD and only simple headers — so that it won't produce a preflight.
Make your "real" request to that destination.
what's the correct behavior here
Cross-site redirects originally were forbidden, but now (since 4 Aug 2016) are allowed — but most browsers have not yet implemented the change.
This is very clearly explained in the MDN https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#Preflighted_requests_and_redirects
Chrome skips a preflight request (CORS) before calling the GET to the new resource. We tested this with Firefox and there it is working quite well. Firefox issues a new preflight request and the GET request afterwards will be handled successfully.
You can find a discussion about that with additional workarounds and a link to the corresponding section of the W3C Recommendations for CORS here: https://stackoverflow.com/a/39728229/4282127.
Chrome should support preflight requests at redirects (3xx) since version 57. So updating to the latest Chrome version should solve at least the problem of missing preflight requests.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With