Twilio Video如何永久授予摄像头权限避免重复弹出授权请求？

问题原因 #

默认情况下，调用Twilio.Video.connect()方法时如果没有显式传入已存在的本地媒体轨道，Twilio SDK会自动调用接口创建新的音视频轨道，这一操作会重新触发摄像头/麦克风权限申请流程，即便用户之前已经完成过授权。

解决方案 #

复用步骤2中已经创建好的本地媒体轨道，在调用connect方法时通过配置项传入即可避免重复创建轨道、重复申请权限。

具体实现修改 #

1. 提前在全局或上层作用域声明变量存储已创建的本地媒体轨道

// 存储本地媒体轨道，可根据需要添加音频轨道
const localTracks = [];

2. 修改步骤2的代码，将创建好的轨道存入变量

// Get the track from twilio
const localVideoTrack = await Twilio.Video.createLocalVideoTrack();
// 存入轨道数组
localTracks.push(localVideoTrack);

// Add track to HTML        
LocalMediaContainer.appendChild(localVideoTrack.attach());

3. 修改步骤5的connect调用代码，新增tracks配置项传入已有的本地轨道

Twilio.Video.connect(Token, { 
  name: RoomName,
  // 传入已创建好的本地轨道，SDK不会再重新创建新轨道申请权限
  tracks: localTracks 
}).then(room => {
    console.log('Successfully joined a Room');

    room.on('participantConnected', participant => {
      console.log('A remote Participant connected ');
    });
  }, error => {
    console.error('Unable to connect to Room');
  });

注意事项 #

• 如果你的业务同时用到麦克风，需要在步骤2中同时创建本地音频轨道，一并存入localTracks数组传入
• 由于等待入会的时间最长可达20分钟，需要注意页面切后台时浏览器可能会自动释放媒体轨道，你可以在调用connect前先检查轨道的isStopped属性，如果为true则需要重新创建轨道再传入，避免加入房间失败。

内容的提问来源于stack exchange，提问作者Thomas Carlton