Navigator.mediaDevices.getUserMedia не работает на iOS 12 Safari - PullRequest
Новая
       26

Navigator.mediaDevices.getUserMedia не работает на iOS 12 Safari

0 голосов
/ 26 ноября 2018

Начиная с iOS 12, navigator.mediaDevices.getUserMedia() возвращает ошибку в Safari.

Чтобы восстановить это, откройте iPhone Web Inspector , затем запустите этот фрагмент в консоли: 

var constraints = { audio: true, video: { width: 1280, height: 720 } }; 

navigator.mediaDevices.getUserMedia(constraints)
  .then(function() {
    console.log('getUserMedia completed successfully.');
  })
  .catch(function(error) {
    console.log(error.name + ": " + error.message);
  });

Вы увидите, что он успешно работает в браузерах настольных компьютеров и в iOS 11 Safari, но не работает в iOS 12 Safari.

NotAllowedError: Запрос не разрешен пользователемагент или платформа в текущем контексте, возможно, потому что пользователь отказал в разрешении.

Есть идеи почему?

примечание: это происходит до того, как пользователя спросят,к их камере можно получить доступ, исключая возможность того, что пользователь отказал в разрешении.

Ответы [ 2 ]

0 голосов
/ 13 февраля 2019

Установка этих трех атрибутов перед вызовом getUserMedia решила проблему для меня: 

    video.setAttribute('autoplay', '');
    video.setAttribute('muted', '');
    video.setAttribute('playsinline', '');

По какой-то причине video.setAttribute() работает, но пытается присвоить значение непосредственно видеообъекту, например video.muted = ''не.

Также кажется, что нет необходимости звонить video.play().

Простая установка video.srcObject для потока, возвращаемого getUserMedia, сработала для меня.

Этот средний пост содержит ссылку на рабочую демонстрационную версию и исходный код.

0 голосов
/ 26 ноября 2018

Есть две возможные причины немедленного NotAllowedError на данный момент:

1.getUserMedia запрашивает https

Похоже, что Safari требует https для доступа к камере и микрофону, как в iOS, так и в OSX.

С https ссылкой , iOS Safari 12 работает длямне; та же ссылка в http получает NotAllowedError.

Chrome имеет те же требования.Это согласуется с направлением спецификации, которое недавно ограничило getUserMedia безопасными контекстами.Браузеры, которые еще не обновились, по-прежнему выставляют navigator.mediaDevices в http, но getUserMedia всегда отклоняет NotAllowedError.

В будущем ожидается, что браузеры полностью удалят mediaDevices в http, чтобы соответствовать спецификации.

2.getUserMedia требует политики объектов в кросс-исходных элементах iframes.

Это кажется новым в Safari 12. В элементах iframes политика элементов getUserMedia по умолчанию отключена для содержимого кросс-источников.

Это работает для меня: 

<iframe
  allow="camera;microphone"
  src="https://webrtc.github.io/samples/src/content/getusermedia/gum/">
</iframe>

Это не работает : 

<iframe src="https://webrtc.github.io/samples/src/content/getusermedia/gum/">
</iframe>

... и в дополнение к ошибке с NotAllowedError, Safari предупреждает в веб-консоли: 

The top-level frame has prevented a document with a different security origin to
call getUserMedia.

Это также недавнее обновление до спецификации .

...