javascriptthree.jsip-cameratquery

Render IP CAMERA stream with three.js

I'm trying to render video stream from an IP Camera to a three.js texture, but I cannot find how to. I am trying something like this:

....
var video   = document.createElement('video');
video.crossOrigin="anonymous";
video.width = 320;
video.height    = 240;
video.autoplay  = true;
video.loop  = true;

//This works, but it is not from an IP Camera
//video.src="http://video.webmfiles.org/big-buck-bunny_trailer.webm";

//This does not work
video.src="http://webcam01.bigskyresort.com/mjpg/video.mjpg";

this._video = video
var texture;
texture = new THREE.Texture( video );
....

Any idea?

Many thanks in advance!

Solution

  • In Windows, paste this command in run window

    chrome.exe --user-data-dir="C:/Chrome dev session" --disable-web-security

    this will open a new chrome browser which allow access to no 'access-control-allow-origin' header request.

    It has security implications and should only be used for testing.

    Without --user-data-dir= path, everyone (every website) will be able to interact in your name with your banking, social or another website where you have an account, and that everyone (every website) will be able to read your mails from your providers website, without any security blocking them. So do not use your current session for that, create a new one.

    Or maybe you can install another instance of a browser, and use it only for opening the page.