WebGL JavaScript 3D Object

Question

I am trying to render a 3D object using WebGL and Javascript and Right now I am getting an error.

"test.js:123 Uncaught DOMException: Failed to execute 'texImage2D' on 'WebGL2RenderingContext': The image element contains cross-origin data, and may not be loaded.

at initStaticVertexBufferObj"

I've tried to use a fix that I found online which said to add an a tag to the "img" in the html file.

Answer 1

Without seeing the code, itself, it sounds like you have a 2d canvas context and 3d canvas context that might need some reorganizing. A context is the 'space' that you do work in either setup: 2d or 3d.

Secondly, CORS restrictions are causing you some trouble. Some part of the code is requesting from a server with a different domain. This is likely the texture of the material. If you are running a file of javascript by file:// protocol and it makes requests to localhost you will run into this issue.

Just remember, Google.com is your friend in support.