Question:
Our website is having problems loading CSS and JS resources on a Amazon S3 bucket with the very latest version of Chromium (Version 33.0.1722.0 – 237596) and Chrome Canary.
It works well with any of the other browsers including the current Chrome (31.0.1650.57).
The error is:
Script from origin ‘https://mybucket.s3.amazonaws.com‘ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘https://app.example.com‘ is therefore not allowed access.
Our S3 CORS configuration on the resource bucket is:
1 2 3 4 5 6 7 8 9 10 |
Is it a bug with Chromium?
Did something change on the latest CORS spec?
Answer:
Add any query parameter such as ?cacheblock=true
to the url, like so:
Instead of: https://somebucket.s3.amazonaws.com/someresource.pdf
do: https://somebucket.s3.amazonaws.com/someresource.pdf?cacheblock=true
The technical explanation I don’t have entirely down. But it is something like the following:
Including a query parameter will prevent the ‘misbehaving’ caching behavior in Chrome, causing Chrome to send out a fresh request for both the preflight request and the actual request, allowing the proper headers to be present on both requests, allowing S3 to respond properly. Approximately.