I am currently learning WebGL. In a call to texImage2D, which is called when a texture has finished loading, I get the following SecurityError:

Uncaught SecurityError: Failed to execute 'texImage2D' on 'WebGLRenderingContext': The cross-origin image at /path/to/texure.png may not be loaded.

However, the file is on the same domain, in fact it is in the same directory as the html file requesting it.

Here is the file layout:

> js
|-> script.js
|-> glUtils.js
|-> sylvester.js
> texture.png
> index.html

And when I look in the F12 console's resource list, the image texture.png is there, fully loaded, and it is 256 x 256. Why does it think I am requesting from another domain?

I am currently learning WebGL. In a call to texImage2D, which is called when a texture has finished loading, I get the following SecurityError:

Uncaught SecurityError: Failed to execute 'texImage2D' on 'WebGLRenderingContext': The cross-origin image at /path/to/texure.png may not be loaded.

However, the file is on the same domain, in fact it is in the same directory as the html file requesting it.

Here is the file layout:

> js
|-> script.js
|-> glUtils.js
|-> sylvester.js
> texture.png
> index.html

And when I look in the F12 console's resource list, the image texture.png is there, fully loaded, and it is 256 x 256. Why does it think I am requesting from another domain?

• javascript
• cross-domain
• textures
• webgl

• 1 Are you working from file:// URLs? They're not treated as being in the same domain as each other for security reasons. – Pointy Commented Aug 13, 2014 at 16:57
• Yes, I am. Is there any way I can do this from my local site? – vcapra1 Commented Aug 13, 2014 at 16:58
• 1 If you serve up the stuff from a local webserver it'll work, because the browser will see those as being from the same domain. Chrome used to have an mand-line option to allow it: --allow-file-access-from-files but I don't know if it still works. – Pointy Commented Aug 13, 2014 at 17:00

2 Answers 2

The solution is that you must be on a local webserver, because file:/// domain requests will not be granted. (Information given by Pointy:

If you serve up the stuff from a local webserver it'll work, because the browser will see those as being from the same domain. Chrome used to have an mand-line option to allow it: --allow-file-access-from-files but I don't know if it still works

You're probably getting the error because you're using a file:// based URL.

The solution is to use a simple web server. Open a terminal and type

python -m SimpleHTTPServer

then go to http://localhost:8000 (install python if you're on Windows) or use node.js or possibly even better use devd

Do NOT use --allow-file-access-from-files. This opens your machine to getting hacked through the browser. That would be like turning off your firewall or your virus scanner.