与getUserMedia火狐V41问题没有看到Chrome或Firefox V36

Question

我使用（https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia）下面的代码：

navigator.mediaDevices = navigator.mediaDevices || ((navigator.mozGetUserMedia || navigator.webkitGetUserMedia) ? { 
    getUserMedia: function(c) { 
    return new Promise(function(y, n) { 
     (navigator.mozGetUserMedia || navigator.webkitGetUserMedia).call(navigator, c, y, n); 
    }); 
    } 
} : null); 

设置使用的麦克风。此作品在Chrome（V45）和Firefox（V36）大，但在Firefox（V41）我在控制台中出现以下错误：

Error: setting a property that has only a getter 
RecorderSvc.initAudio@http://fakewebsite.com/js/services/recorder.js:61:1 

我可以做解决问题：

if (navigator.mozGetUserMedia || navigator.webkitGetUserMedia) { 
    navigator.mediaDevices.getUserMedia = function(c) { 
     return new Promise(function(y, n) { 
      (navigator.mozGetUserMedia || navigator.webkitGetUserMedia).call(navigator, c, y, n); 
     }); 
    } 
} 

但这在Chrome或Firefox（v36）中不起作用。

• 在Chrome中，仅定义了navigator.webkitGetUserMedia。
• 在Firefox（v36）中，仅定义了navigator.mozGetUserMedia。
• 在Firefox（v41）中，navigator.mozGetUserMedia和 navigator.mediaDevices都已定义。

我不知道如何解决这个问题，而不会破坏其中一个浏览器。有任何想法吗？

Answer 1

如果您将您的语句包围在Try Catch块中，它将起作用。

if (navigator.mediaDevices || (navigator.mozGetUserMedia || navigator.webkitGetUserMedia)) { 
    try { 
    navigator.mediaDevices = { 
     getUserMedia: function(c) { 
     return new Promise(function(y, n) { 
      (navigator.mozGetUserMedia || navigator.webkitGetUserMedia).call(navigator, c, y, n); 
     }); 
     } 
    }; 
    } 
    catch(err) { 
    navigator.mediaDevices.getUserMedia = function(c) { 
     return new Promise(function(y, n) { 
     (navigator.mozGetUserMedia || navigator.webkitGetUserMedia).call(navigator, c, y, n); 
     }); 
    } 
    } 
} else { 
    navigator.mediaDevices = null; 
} 

Answer 2

您复制的代码（我写顺带）做了糟糕的工作试图填充工具navigator.mediaDevices.getUserMedia到没有它本身还没有浏览器。它已从您找到它的地方移除。感谢您发现它已损坏。

填充是棘手的业务，所以我强烈建议使用官方WebRTC填充的adapter.js，而不是试图手动填充它。您可以直接使用最新版本adapter.js的，或者链接到最新总是一个，像这样：

<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script> 

的是，在你所提到的浏览器上运行的这样的一个例子见https://jsfiddle.net/srn9db4h/。

我不会尝试更正您提到的代码，因为polyfilling navigator.mediaDevices正确地变得相当复杂。

这也是不够的，因为getUserMedia的位置不是the specification已更改的唯一的东西。的约束格式参数has changed as well，这就是为什么navigator.mediaDevices.getUsermedia仍处于实验阶段国旗后在Chrome 45

adapter.js照顾的这一切，直到浏览器赶上。