Access to XMLHttpRequest at '/path/to/loca/file" from origin 'null' has been blocked by CORS policy

I have this code:

<script src="animation.js" type="text/paperscript" canvas="background"></script>

We all recognize this - its a script tag. Specifically, its supposed to use Paper.js (see docs).

However, when I try to launch the site, I see this error:

Access to XMLHttpRequest at 'file:///animation.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, chrome-untrusted, https.

Any idea how to fix this?

Serve those files through a local web server instead of accessing them from a file:// URL.

If you have Python 3, you can do python3 -m http.server for development testing. Supposedly it’s not good enough for production though.

I fixed it by putting them all inline. Not the cleanest way, but I put a lot of comments so it doesn’t become a dumpster fire (hopefully)… Thanks for helping!

1 Like