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);
  });
相关推荐
OK_boom1 小时前
React-useRef
javascript·react.js·ecmascript
未来之窗软件服务1 小时前
solidwors插件 开发————仙盟创梦IDE
前端·javascript·数据库·ide·仙盟创梦ide
小白学大数据1 小时前
基于Scrapy-Redis的分布式景点数据爬取与热力图生成
javascript·redis·分布式·scrapy
Minyy112 小时前
Vue3指令(二)--v-text、v-html数据渲染,计算属性
前端·javascript·vue.js·前端框架·vue·html
个人开发-胡涂涂2 小时前
ECMAScript标准:JavaScript的核心
前端·javascript·ecmascript
Mryan20052 小时前
Angular | 利用 `ChangeDetectorRef` 解决 Angular 动态显示输入框的聚焦问题
前端·javascript·angular.js
郭尘帅6662 小时前
Vue3中实现轮播图
开发语言·前端·javascript
qq_346295273 小时前
require/exports 或 import/export的联系和区别,各自的使用场景
javascript
flying robot3 小时前
小结:JavaScript 模块化工具链
javascript
inksci4 小时前
Vue 3 打开 el-dialog 时使 el-input 获取焦点
前端·javascript·vue.js