Solution for DOMException Failed to load because no supported source was found error in Chrome with HTML5 media API

Solution for DOMException Failed to load because no supported source was found error in Chrome with HTML5 media API

After updating Chrome to release 53 this week, my web application was no longer able to use the media API to capture video with a webcam. This is the third time that I am forced to update my code due to changes in Chrome... this is getting a little annoying!

The error message I was getting in my javascript console is:
DOMException: Failed to load because no supported source was found

Ill keep it short. The problem was the way I set the source of my media element.
I was setting the source like this:

navigator.getUserMedia(videoObj, function(stream) {
   CaptureImageStream = stream;
   CaptureImageVideo.src = stream;
   CaptureImageVideo.play();
}, errBack);

It seems like this is no longer supported. I changed it to this and it now works again:

navigator.getUserMedia(videoObj, function(stream) {
   CaptureImageStream = stream;
   CaptureImageVideo.src = window.URL.createObjectURL(stream);
   CaptureImageVideo.play();
}, errBack); 

I hope this helps!
Clement

download file now