Why can I fetch this Cross origin file but I can't create a Worker from it?

427 Views Asked by At

The file in question is this one: http://web-reports-static.s3.us-east-2.amazonaws.com/_next/e02d25753c0f34f5e22c.worker.js

The file is hosted from an s3 bucket that allows any domain to get the file. I also setup the following CORS policy:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
</CORSRule>
</CORSConfiguration>

You can try it in the console of any website (open dev tools here on stackoverflow for example).

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
       // Typical action to be performed when the document is ready:;
      console.log(xhttp.responseText)
    }
};
xhttp.open("GET", "http://web-reports-static.s3.us-east-2.amazonaws.com/_next/e02d25753c0f34f5e22c.worker.js", true)
xhttp.send()

However using it directly to construct a Worker results in an error:

> new Worker("http://web-reports-static.s3.us-east-2.amazonaws.com/_next/e02d25753c0f34f5e22c.worker.js")

VM1925:1 Uncaught DOMException: Failed to construct 'Worker': Script at 'http://web-reports-static.s3.us-east-2.amazonaws.com/_next/e02d25753c0f34f5e22c.worker.js' cannot be accessed from origin 'https://stackoverflow.com'.
    at <anonymous>:1:1
(anonymous) @ VM1925:1
1

There are 1 best solutions below

0
On

Remembered that the Content Security Policy controls which sources can be loaded by various browser mechanisms. In particular I needed to wildcard the worker-src directive: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/worker-src