检测 Firefox 对屏幕共享的支持

Question

Firefox，自版本 52 起，将通过以下方式支持屏幕共享：

navigator.mediaDevices.getUserMedia({ video: { mediaSource: 'screen' }}) 
  .then(stream => { ... });

查看 this test page to see it in action。

我想知道有没有办法检测浏览器是否支持{ mediaSource: 'screen' }？

我只想提供与具有共享能力的用户共享屏幕的选项。所以我希望能够检测到这一点。

Answer 1

更新的答案： getDisplayMedia 现在是屏幕共享的正确 API，所有主要浏览器都支持几年了（在 Firefox 中，自 66 岁以上）。所以正确的 API 是：

await navigator.mediaDevices.getUserMedia({video: true});

特征检测的正确方法是：

console.log(navigator.mediaDevices &&
            "getDisplayMedia" in navigator.mediaDevices);

这是 false 移动设备，但缺少支持（Firefox Android 和 Chrome Android）。

它也是 false 不安全的 http（非 https）连接，其中 navigator.mediaDevices 本身是 undefined，一个被认为是“强大功能”的对象。

真正老式 Firefox 的答案 < 66:

⚠️ 不要在较新的浏览器中依赖这个答案，因为这个限制正在消失！

a way to detect whether a browser supports { mediaSource: 'screen' }?

迂腐的回答是下面会告诉你是否支持mediaSource约束：

console.log(!!navigator.mediaDevices.getSupportedConstraints().mediaSource);

不幸的是，mediaSource 是非标准的，仅在 Firefox 中实现。 在撰写本文时，Firefox 是唯一无需插件即可启用屏幕共享的浏览器。

Chrome 有一个不同的非标准 API 使用 chromeMediaSource 作为插件可用，使用旧的约束语法，但它（正确地）没有出现在新 getSupportedConstraints.

还是有点乱。长期使用的浏览器最终可能会实现 getDisplayMedia。