类型错误:在未实现接口 MediaDevices 的对象上调用了“getUserMedia" [英] TypeError: 'getUserMedia' called on an object that does not implement interface MediaDevices

问题描述

我正在尝试使用视频标签在网站中实现网络摄像头.它适用于 Chrome，但 FireFox 和 IE 在控制台中返回错误.任何人有任何想法为什么?谢谢！

I'm trying to implement a webcam into a website using a video tag. It works in Chrome, but FireFox and IE return errors in the console. Anyone have any ideas why? Thank you!

代码:

navigator.getMedia =    navigator.getUserMedia ||
                                navigator.webkitGetUserMedia ||
                                navigator.mediaDevices.getUserMedia ||
                                navigator.msGetUserMedia ||
                                OTPlugin.getUserMedia;

Firefox 错误:TypeError:在未实现接口 MediaDevices 的对象上调用了getUserMedia".

Firefox error:TypeError: 'getUserMedia' called on an object that does not implement interface MediaDevices.

IE 错误:无法获取未定义或空引用的属性getUserMedia"

IE error: Unable to get property 'getUserMedia' of undefined or null reference

推荐答案

您忘记了用于 Firefox 的 navigator.mozGetUserMedia.IE 没有(尽管 MS Edge 有).

You forgot navigator.mozGetUserMedia for Firefox. IE doesn't have it (though MS Edge does).

此外，从该列表中删除 navigator.mediaDevices.getUserMedia，因为它的工作方式不同.

Also, remove navigator.mediaDevices.getUserMedia from that list since it works differently.

我的建议:跳过前缀混乱并尝试adapter.js，官方 WebRTC polyfill.然后使用 navigator.mediaDevices.getUserMedia 唯一，因为其他所有内容都已弃用.

My advice: Skip the prefix mess and try adapter.js, the official WebRTC polyfill. Then use navigator.mediaDevices.getUserMedia exclusively, as everything else has been deprecated.

示例(在 Chrome 中使用 https fiddle):

Example (use https fiddle in Chrome):

navigator.mediaDevices.getUserMedia({ video: true, audio: true })
  .then(stream => video.srcObject = stream)
  .catch(e => console.log(e.name + ": "+ e.message));

<video id="video" width="160" height="120" autoplay></video><br>
<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>

这篇关于类型错误:在未实现接口 MediaDevices 的对象上调用了“getUserMedia"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！