0

项目：列出所有媒体设备，然后选择 1 个不同于 Windows 默认的特定音频输出设备

我使用了 enumerateDevices()，遵循了许多代码示例，example here和：

  • 在 Firefox 上：音频输入、视频输入列表，没有显示音频输出，但每个只有 1 个（我有 2 个输入，3 个输出）
  • 在 Chrome 上，Brave：显示相同的列表，每个列表也只有 1 个，并且类型/标签/id 为空（尽管 groupId 不是空的）

代码：

function checkDevices(devices){
        (async () => {   
  await navigator.mediaDevices.getUserMedia({audio: true, video: true});   
  let devices = await navigator.mediaDevices.enumerateDevices();   
  devices.forEach(function (device) {
      console.log(device.kind + ": " + device.label + " id: " + device.groupId);//Other parameters device.kind/device.deviceId
    });
  })();
}
function checkError(err){
    console.log(err.name + ": " + err.message);
} 
navigator.mediaDevices.enumerateDevices().then(checkDevices).catch(checkError);

有人可以帮忙吗？

输出 Firefox 在此处输入图像描述

输出 Chrome（在 Brave 上相同） 在此处输入图像描述

4

1 回答 1

0

我找到了代码不起作用的原因，以及一些解决方法，可能对类似情况的其他人有所帮助：

原因： enumerateDevices() 需要用户的许可和浏览器的安全性 (https) 才能正确列出可用设备。由于代码位于本地，因此它返回错误列表和空标签/种类。

一些解决方法：

  1. 发布 html，例如，我使用了https://www.netlify.com/（免费）；但是如果您的项目正在开发中，每次尝试重新上传 html 并不方便。Netlify 允许链接到 github，所以代码可以自动刷新

  2. 使用像www.w3schools.com这样的在线编译器，因为代码是从网站上运行的，所以它可以工作

  3. 使用electron做桌面应用，代码和web app基本一样。不知道电子？在此处查看此视频（15 分钟）

希望那些帮助别人！

于 2021-02-01T23:51:21.187 回答