Javascript / Amazon s3 - Access control origin error when loading a javascript file via threejs

Question

I am hosting a few large files on amazon s3 that I want my website to be able to load via a threejs load call. However, when I call the load for these files, I get an error that the loading is not allowed because of access control allow origin. My load call is this:

loader = new THREE.JSONLoader();
loader.load("https://s3.amazonaws.com/folder/shoot-o.js",function(geometry){
    //DO STUFF
});

How do I access these?

Answer 1

The only way I know of to make it work with the three loader is to make the server send an Access-Control-Allow-Origin: yourdomain.com header with your hosted file. I do not know if this is possible on s3 though.

You could also try using JSONP (JSON with Padding), for example like this:

var head = document.getElementsByTagName("head")[0];
var script = document.createElement("script");
script.src = "https://s3.amazonaws.com/folder/shoot-o.js";
head.appendChild(script);

Then modify your js file so that the JSON data is wrapped by a js function call:

loadJSON({yourData: true, ...});

And implement the loadJSON function so that it accepts the JSON data as first parameter and does your stuff with it.

Here is a discussion about the problem regarding the THREE loader