Safari getUserMedia() Unhandled Promise Rejection

Question

As advised in internet i added the muted and playsinline attributes to my video element. I still cant get a vision in Safari 11 but only this error. I also tried to remove autoplay from my video element.

Unhandled Promise Rejection: TypeError: Type error

Is it possible to get webrtc working in Safari 11 or am i losing time with this?

getUserMedia() works on all other browsers (Chrome,Firefox,Edge,Opera).

Thank you!

I use this shim, https://github.com/addyosmani/getUserMedia.js/blob/gh-pages/lib/getUserMedia.js this returns a success callback,

Then in the callback,

var video = camOptions.videoEl; //the video element

var vendorURL = window.URL || window.webkitURL;

try {
    video.src = vendorURL ? vendorURL.createObjectURL(stream) : stream;
}
catch(err) {
    //HERE IS THE TYPE ERROR IN SAFARI
}

Answer 1

The TypeError you are getting is because you are passing the wrong constraints when calling GetUserMedia. This error happens when you pass constrains which are not recorgnized by the device (browser) or have invalid values.

Also, you need to use video.srcObject and not video.src which is deprecated.

Here's a working example for Safari. Keep in mind this only works on iOS 11 and above:

// Get the <video> element
var video = document.getElementById('vid');

// Default constrains
var constraints = { audio: true, video: true };

navigator.mediaDevices.getUserMedia(constraints).then(handleSuccess);

var handleSuccess = function (stream) {  
    video.srcObject = stream;
};