WebRTC中获取当前采集设备的deviceId

在做webRTC项目离不开切换摄像头,但是怎么拿到当前采集的设备id就成了问题,查阅资料后发现官方其实有提供相关方法,简单记录下;

通用玩法获取采集设备id
javascript 复制代码
// 请求访问用户媒体设备
navigator.mediaDevices.getUserMedia({ video: true, audio: true })
  .then((stream) => {
    // 获取视频轨道
    let videoTrack = stream.getVideoTracks()[0];
    if (videoTrack) {
      console.log('视频设备ID:', videoTrack.getSettings().deviceId);

      // 获取音频轨道
      let audioTrack = stream.getAudioTracks()[0];
      if (audioTrack) {
        console.log('麦克风设备ID:', audioTrack.getSettings().deviceId);
      }
    } else {
      console.log('未找到可用的视频设备');
    }
  })
  .catch((error) => {
    console.error('获取媒体流失败', error);
  });
相关推荐
艾小码2 分钟前
别再只会用默认插槽了!Vue插槽这些高级用法让你的组件更强大
前端·javascript·vue.js
赖small强8 小时前
【ZeroRange WebRTC】NAT 与防火墙在 WebRTC 中的影响
webrtc·防火墙·nat·stun
赖small强10 小时前
【ZeroRange WebRTC】OpenSSL 与 WebRTC:原理、集成与实践指南
webrtc·openssl·x.509·证书验证·tls/dtls
菜鸟‍10 小时前
【前端学习】阿里前端面试题
前端·javascript·学习
用户479492835691511 小时前
告别span嵌套地狱:CSS Highlights API重新定义语法高亮
前端·javascript·css
赖small强11 小时前
【ZeroRange WebRTC】WebRTC 媒体安全:实现原理与应用(深入指南)
webrtc·dtls-srtp·端到端加密·srtcp 控制安全·srtp 加密与完整性
九章云极AladdinEdu13 小时前
项目分享|告别枯燥命令行,构建终端用户界面的 TypeScript 库
javascript·ui·typescript
带着梦想扬帆启航13 小时前
UniApp 多个异步开关控制教程
前端·javascript·uni-app
小高00714 小时前
JavaScript 内存管理是如何工作的?
前端·javascript