Three.js：网络摄像机的纹理

Question

So I'm having some troubles to put the video of an Axis Camera into a Texture. The Axis Camera is returning the wanted video into a picture. The picture src is the camera IP address.

I wanted to put directly the picture into the texture, but I got an error from the Cross-origin resource sharing... I did some research on Internet and I found this link . Therefore, I wrote the exact same code and it worked well with the webcam, and the 71st version of Three Js ! However, when I wanted to test it with my axis camera, it was sending me the same error :

Uncaught SecurityError: Failed to execute 'texImage2D' on 'WebGLRenderingContext': Tainted canvases may not be loaded.

Does someone have an idea about how to solve this problem ?

Answer 1

I finally get it ! So it's indeed a CROS problem. Put just the crossOrigin image at "anonymous" wasn't the good solution, because the CROS was always a problem, since the picture I want to use is from another IP address...

So what I needed to do is only to put some attributes to Chrome :

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir="D:\chrome"

And that's working ! ^u^ Warning though, you need to create another shortcut exclusively for your work and you mustn't use that to search on the internet !