MediaDevices.enumerateDevices() 通过文件协议访问时未显示所有媒体设备?

2024-01-04

My index.html列出所有媒体设备是

<!DOCTYPE html>
<html>

<body>
    <script>
        (async () => {
            await navigator.mediaDevices.getUserMedia({ audio: true, video: true });
            let devices = await navigator.mediaDevices.enumerateDevices();
            console.log(devices);
        })();
    </script>
</body>

</html>

当我访问这个index.html via 文件协议 https://en.wikipedia.org/wiki/File_URI_scheme like file:///some-path/index.html我只看到很少的设备也没有标签。

[
    {
        "deviceId": "",
        "kind": "audioinput",
        "label": "",
        "groupId": "a71e32bec65bc4788683c156cfbc3c005bce4535b980209e4a455973bd93f36a"
    },
    {
        "deviceId": "",
        "kind": "videoinput",
        "label": "",
        "groupId": "03e0a9c9e71757f81bef3f3a74c4a56785b2d3d103a7de883101e509c233977f"
    },
    {
        "deviceId": "",
        "kind": "audiooutput",
        "label": "",
        "groupId": "a71e32bec65bc4788683c156cfbc3c005bce4535b980209e4a455973bd93f36a"
    }
]

但是当我访问这个index.html via http协议 https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol like http://localhost/index.html我看到了所有设备

[
    {
        "deviceId": "default",
        "kind": "audioinput",
        "label": "Default - Microphone Array (Realtek(R) Audio)",
        "groupId": "95ad50034942d5fc0302807034812fe5fcc218f9b09ca646add4a14a8b2622bf"
    },
    {
        "deviceId": "communications",
        "kind": "audioinput",
        "label": "Communications - Microphone Array (Realtek(R) Audio)",
        "groupId": "95ad50034942d5fc0302807034812fe5fcc218f9b09ca646add4a14a8b2622bf"
    },
    {
        "deviceId": "3a7aefd60c0ca518309257aa2cb4d1e551dbbc515b1b44db6e9dca1fe3707043",
        "kind": "audioinput",
        "label": "Microphone Array (Realtek(R) Audio)",
        "groupId": "95ad50034942d5fc0302807034812fe5fcc218f9b09ca646add4a14a8b2622bf"
    },
    {
        "deviceId": "d8fe6e8b9ea6af07937e5cca27156df470b9ebe074bcde2c9c5a08c4a587f6e3",
        "kind": "videoinput",
        "label": "HP TrueVision HD Camera (05c8:03d2)",
        "groupId": "a7e998e3f31252e8fa432646d953e9ce05b365a184f62e23fc44baa4efef902f"
    },
    {
        "deviceId": "a05bca7ff5990c524b424bea2612606cd5227089ce608e18b4e11e81218a559c",
        "kind": "videoinput",
        "label": "mmhmm Camera",
        "groupId": "d688503a66132497bc8d6069bad536af1bc831c95489d37e44f23c8ec35e50bb"
    },
    {
        "deviceId": "e744025c7a3cdacf663161d755304f6472af21bb6148c0b4adc40ad2ea5a012d",
        "kind": "videoinput",
        "label": "OBS Virtual Camera",
        "groupId": "b91d30a4ab3fa102a7907c58f6fe34e92886feef841112809fc2179a9b16fb93"
    },
    {
        "deviceId": "default",
        "kind": "audiooutput",
        "label": "Default - Speaker (Realtek(R) Audio)",
        "groupId": "95ad50034942d5fc0302807034812fe5fcc218f9b09ca646add4a14a8b2622bf"
    },
    {
        "deviceId": "communications",
        "kind": "audiooutput",
        "label": "Communications - Speaker (Realtek(R) Audio)",
        "groupId": "95ad50034942d5fc0302807034812fe5fcc218f9b09ca646add4a14a8b2622bf"
    },
    {
        "deviceId": "2f1d086698e7f7f056501e2b229a1d704e68e9c623694148f0cb173af68b5b03",
        "kind": "audiooutput",
        "label": "Speaker (Realtek(R) Audio)",
        "groupId": "95ad50034942d5fc0302807034812fe5fcc218f9b09ca646add4a14a8b2622bf"
    }
]

我如何通过以下方式查看所有设备file protocol (file:///) only?


媒体捕获和流 API 仅在安全上下文中工作。请参阅 MDN 和相关规范。

https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia

https://w3c.github.io/mediacapture-main/#interface-definition https://w3c.github.io/mediacapture-main/#interface-definition

linked: https://bugs.chromium.org/p/webrtc/issues/detail?id=14393 https://bugs.chromium.org/p/webrtc/issues/detail?id=14393

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

MediaDevices.enumerateDevices() 通过文件协议访问时未显示所有媒体设备? 的相关文章

  • 将事件添加到 Google Maps API InfoWindow 内的元素

    我想在 Google Maps API v3 InfoWindow 内放置一个带有输入字段和提交按钮的表单 提交后 我想调用一个函数 该函数使用输入字段中输入的地址启动方向服务 这是我的代码 我目前只测试方向事件是否被触发 我已经编写了完整
  • 三.js环境光意想不到的效果

    在下面的代码中 我渲染了一些立方体并使用点光源和环境光照亮它们 然而 当设置为 0xffffff 时 AmbientLight 会将侧面的颜色更改为白色 无论其指定的颜色如何 奇怪的是 点光源按预期工作 我怎样才能使环境光表现得像点光 因为
  • Chrome JavaScript 日期构造函数获取 1884 年之前的日期似乎是错误的

    如果我将 1 1 1753 午夜 的 unix 毫秒时间戳值 6847786800000 传递给 Chrome 中的 JavaScript Date 构造函数 则 Chrome 给出的日期看起来非常奇怪 当我使用带有七个参数的 Date 构
  • 如何避免 TypeScript 中出现虚假的“未使用参数”警告

    我遇到过很多次这种情况 最后决定弄清楚正确的方法是什么 如果我有一个声明方法的抽象父类 然后一些具体子类在其实现中实现真正的逻辑 并且显然使用方法参数 但某些子类不需要在该方法中执行任何操作 因此不要使用方法参数 那些不必执行任何操作的方法
  • 如何在 Angular 2 应用程序中使 DateAdapter 单例?

    我正在开发一个带有延迟加载模块的 Angular 7 应用程序 我也使用有角度的材料组件 我想在日期选择器组件中本地化并支持多个区域设置 当应用程序语言发生变化时 我想在整个应用程序中全局更改它 可以通过 DateAdapter setLo
  • 如何更改元素的 CSS 类并在单击时删除所有其他类

    我如何处理 AngularJS 2 中的一种情况 即单击一个元素需要更改其自己的样式 并且如果其他元素具有该样式 则需要将其删除 最好在一个函数中 如同Angular js 如何在单击时更改元素 css 类并删除所有其他元素 https s
  • 如何在html中设置按钮的文本大小

    您好 我想在我的网站上有一个按钮 并且我想调整按钮上的文本大小 我该怎么做呢 我的代码如下
  • Rails 中的 PDF 导出

    我需要将包含一些图表的 HTML 页面导出为 PDF 有哪些好的 gem 可以做到这一点 PDFKit http railscasts com episodes 220 pdfkit http railscasts com episodes
  • 我们如何使用 thymeleaf 绑定对象列表的列表

    我有一个表单 用户可以在其中添加任意数量的内容表对象这也可以包含他想要的列对象 就像在 SQL 中构建表一样 我尝试了下面的代码 但没有任何效果 并且当我尝试绑定两个列表时 表单不再出现 控制器 ModelAttribute page pu
  • 元素不适应 Firefox 上的

    使用 ES6 ish D3js 模块运行 Angular 6 应用程序会导致 Firefox 出现问题 Chromium Chrome Safari 和 IE Edge 工作正常 伪代码看起来类似于 生产代码可以在下面找到
  • JavaScript 中的最短路径

    几周来我一直在寻找一种在 JavaScript 中计算最短路径的方法 我一直在玩书数据结构和算法作者 格罗纳 Groner 名字恰如其分 https github com loiane javascript datastructs algo
  • 如何显示 GroupList 的 FormArray?

    我正在尝试制作一个交互式表单 在每一行上列出一个项目以及一个删除按钮 在我的示例中称为 verwijderen 这些项目是从数据库中检索的 并且每个项目都实例化为名为的自定义对象LaborPeriod 然后这些对象被转化为FormGroup
  • 模拟节点外部模块默认使用 jest 的链式方法

    在我们的节点 CLI 中 我们有一个简单的方法 use strict const ora require ora module exports function startSpinner textOnStart color spinnerT
  • 适用于多应用项目的 Grunt 和 requirejs 优化器

    我在让 Grunt 对具有以下结构的项目执行 requirejs 优化时遇到问题 static js apps app js dash js news js many more app files build collections lib
  • Socket.io 与服务器离线连接

    如何检测服务器是否离线或由于其他原因无法连接 我的代码看起来像这样 this socket io connect connectionInfo reconnect false 它不会抛出任何错误 因此 try catch 子句不起作用 Us
  • 在firefox上用js改变表单方法

    我需要使用 javascript jQuery 或纯 更改表单的方法属性 我的表单有 method post 我尝试用以下方法更改它 submit button click function var url input id url val
  • JavaScript 正则表达式两个标签之间的多行文本

    我编写了一个正则表达式来从 HTML 中获取字符串 但似乎多行标志不起作用 这是我的模式 我想将文本输入h1 tag var pattern div class box content 5 h1 lt lt h1 gt mi m html
  • YouTube iFrame Player API 无法在 DOMWindow 上执行 postMessage

    我正在尝试使用以下命令将 youtube 加载到我的网页中YouTube iFrame Player API 并在加载时出现以下错误 Failed to execute postMessage on DOMWindow The target
  • 我如何用 javascript/jquery 进行两指拖动?

    我正在尝试创建当有两个手指放在 div 上时拖动 div 的功能 我已将 div 绑定到 touchstart 和 touchmove 事件 我只是不确定如何编写这些函数 就像是if event originalEvent targetTo
  • Angular 2:使用正则表达式进行数字验证

    我正在尝试验证 IE 11 中的数字字段

随机推荐