Cross-origin image load denied with three.js in chrome

javascript google-chrome cross-domain three.js
Nami WANG picture Nami WANG · Nov 5, 2011 · Viewed 44.5k times · Source

Trying to add material in THREE.js like this

var materialWall = new materialClass( { color: 0xffffff, map: THREE.ImageUtils.loadTexture( 'images/a.png' ) } );

It works fine in Chrome, IE, FF, until 3 days ago, after Chrome updated itself to the latest dev version 17.

Chrome 17 just doesn't load the image and complains the following

Cross-origin image load denied by Cross-Origin Resource Sharing policy.

That's insane since the image is clearly in the same domain, so is this an issue of chrome or THREE.js or something else?

Answer

Orbiting Eden picture Orbiting Eden · Apr 11, 2012

If you are running Chrome from localhost and using Three.js, you probably need to run Chrome with this command line flag:

c:// ... /chrome.exe --allow-file-access-from-files

Related questions

"Origin null is not allowed by Access-Control-Allow-Origin" in Chrome. Why?

I am working on some Javascript to run locally on my PC. I am using a jQuery CSV plugin (http://plugins.jquery.com/project/csv) to load load a csv file into javascript arrays. The script is simple: $(function(){ $.get("…

Read More
Cross-origin data in HTML5 canvas

I'm loading an image in js and draw it into a canvas. After drawing, i retrieve imageData from the canvas: var img = new Image(); img.onload = function() { canvas.drawImage(img, 0, 0); originalImageData = canvas.getImageData(0,0,width, height)); //chrome fails } img.src = 'picture.…

Read More
What kind of network error is Chrome encountering when 'Status = (failed)' and 'Type = undefined'

Sometimes I randomly see network requests from Chrome failing with Status = '(failed)' (status code 0 from the request object in JavaScript) and the response type as 'undefined' . I cannot isolate why, my internet connection seems to be up and …

Read More