Note that there are some explanatory texts on larger screens.

plurals
  1. POThree.JS, Amazon S3, and access control origin errors for hosted JS files
    text
    copied!<h2> Background </h2> <p>We use the Javascript library Three.JS for visualizing models stored up on Amazon S3.</p> <p>I use the JSONLoader for all of my models. Other formats lack the toolchain support our team needs, and common formats like COLLADA or OBJ seem to be second-class citizens as far as the included loader libraries go (they are found, for instance, in the source tree under "examples"... the JSONLoader is in the core loaders folder).</p> <p>I have large model files, and so store them and their associated assets up on Amazon S3 storage, where bandwidth and space are relatively cheap. The intent is that the web app using Three.JS loads models from our storage on Amazon, and everything is okay.</p> <h2> Problem </h2> <p>Unfortunately, the models are Javascript files ("modelBlah.js", for example) and when they are loaded by the JSONLoader any sane browser immediately pouts about the fact that we're violating the same-origin policy for scripting--e.g., we're loading and attempting to evaluate scripts from a different domain than the calling script (which is the main harness for the app).</p> <p>So, it would seem that we've flown in the face of many years of web security best practices.</p> <h2> Solutions looked at so far </h2> <ul> <li><p><em>Host the models ourselves?</em> We're using Heroku for now, and ideally we'd like to use a service specifically billed as "Big Buckets of Bits and Bandwidth" instead of doing it ourselves.</p></li> <li><p><em>Use DNAME records to spoof where the resources come from?</em> Unfortunately, this doesn't seem sufficient to fool browsers, as the subdomain used for the media hosting would still enrage the browser security.</p></li> <li><p><em>Use CORS, specifically Access-Control-Allow-Origin headers?</em> Brief skimming of Amazon S3 doesn't seem to allow this, though I am hopefully mistaken. Even so, would that be sufficient?</p></li> </ul> <hr> <p>Any ideas?</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload