How to access UserMedia

  • Hello,

    Is there a way to access the camera through scripting? Either using Construct's UserMedia or by HTML5 (creating a <canvas> element and using WebRTC ..etc)

    Thank you.

  • Sure, just call the browser APIs directly. See getUserMedia.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Ashley Thanks a lot!

    Can I show this camera stream back in construct (without C3's UserMedia)?

    I tried this code:

    if (navigator.mediaDevices.getUserMedia === undefined) {
    	navigator.mediaDevices.getUserMedia = function(constraints) {
    	 var getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
    	 
    	 if (!getUserMedia) {
    		return Promise.reject(new Error('getUserMedia is not implemented in this browser'));
    	 }
    
    	 return new Promise(function(resolve, reject) {
    		getUserMedia.call(navigator, constraints, resolve, reject);
    	 });
    	}
     }
     
     navigator.mediaDevices
    	.getUserMedia({ video: true })
    	.then(function(stream) {
    	 var vid = document.createElement('video');
    	 vid.src = stream;
    	 console.log(vid);
    	})
    	.catch(function(err) {
    	 console.log(err.name + ": " + err.message);
    	}
    );
    

    It asks for permission, and the camera icon shows up, but of course, the video itself doesn't appear. I assumed it would work if I added a <video> to the page body. What's wrong with this approach, please?

  • There's several problems - you need to assign srcObject, not src; I think you need to play the video too; you don't actually add the video to the document anywhere so it will never be visible. There's plenty of samples around on the Internet, try finding one of them and working from that.

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)