Three.js：来自IP摄像头的纹理

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 :

所以我有一些麻烦将Axis相机的视频放入纹理。 Axis Camera将想要的视频返回到图片中。图片src是摄像头IP地址。我想直接将图片放入纹理中,但我从跨源资源共享中得到了一个错误...我在互联网上做了一些研究,我找到了这个链接。因此,我编写了完全相同的代码,它与网络摄像头和第三版Js的第71个版本配合得很好!但是,当我想用​​我的轴相机进行测试时,它发送了同样的错误:

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 ?

有人知道如何解决这个问题吗?

1 个解决方案

#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 :

我终于明白了!所以这确实是一个CROS问题。把crossOrigin图像放在“匿名”不是很好的解决方案,因为CROS总是一个问题,因为我想要使用的图片是来自另一个IP地址...所以我需要做的只是放一些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 !

这是有效的! ^ u ^警告但是,您需要专门为您的工作创建另一个快捷方式,您不能使用它来在互联网上搜索!