Search code examples
javascriptjqueryioswebrtcgetusermedia

iOS 11 getUserMedia not working?


Apple released a statement that getUserMedia will be fully functional on iOS 11. After installing iOS 11 Beta version 5, I do get a message that my website requests access to my camera and microphone, but it seems that the line:

video.src = window.URL.createObjectURL(stream);

or:

video.srcObject = stream;

Does not work. No errors, no exceptions, simply no picture from the phone's camera.

Here's my full script:

$(function () {
     video = document.getElementById('vid');

     navigator.getUserMedia = navigator.getUserMedia ||
                              navigator.webkitGetUserMedia ||
                              navigator.mozGetUserMedia;

     navigator.getUserMedia(
     {
         audio: true,
         video: { facingMode: "user" }
     }, function (stream) {
         video.srcObject = stream;
         //video.src = window.URL.createObjectURL(stream);
     },
     function (err) {           
         alert(err.name);
     });
});

HTML:

<video id="vid" muted autoplay></video>

Has anyone got it working? Any ideas would be appreciated.


Solution

  • Solved it by using the following:

    $(function () {
        video = document.getElementById('vid');
        video.style.width = document.width + 'px';
        video.style.height = document.height + 'px';
        video.setAttribute('autoplay', '');
        video.setAttribute('muted', '');
        video.setAttribute('playsinline', '');
    
        var constraints = {
             audio: false,
             video: {
                 facingMode: 'user'
             }
        }
    
        navigator.mediaDevices.getUserMedia(constraints).then(function success(stream) {
            video.srcObject = stream;
        });
    });