load cross domain image in Texture - Three.js

Question

I am trying to load an image using THREE.ImageUtils.loadTexture(url) but since image is in a different domain than on which web page is hosted , I am getting below error :

Uncaught SecurityError: Failed to execute 'texImage2D' on 'WebGLRenderingContext': The cross-origin image at

I added THREE.ImageUtils.crossOrigin = "anonymous" before loading texture but then I get below error :

Image from origin 'cross domain url' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'hosted url' is therefore not allowed access.

I also tried below code :

var url = 'http://www.corsproxy.com/yourdomain/yourfolder/yourimage.png';    
            var image = document.createElement('img');
            image.crossOrigin = '';
            image.src = url;
            var texture = new THREE.Texture(image);
            texture.needsUpdate = true;
            material.map = texture;

but since proxy are blocked on my side , so not able to load cross domain images by this way also , Please let me know how can I proceed with loading cross domain images in THREE.js Textures. I am using ver 66 of Three.js..

pratik pratik · Accepted Answer · 2014-05-08T10:34:11

As javascript is client side language, It won't allow. You have to use server side coding to access cross domain data.

see java open pdf file when it is being downloaded

http://www.mkyong.com/jquery/jquery-access-to-restricted-uri-denied-solution/

load cross domain image in Texture - Three.js

1 Answers