vue3项目使用腾讯TRTC搭建一个线上会议室

一.背景

公司业务发展，需要搭建一套线上的web会议室平台系统，包含pc+H5端，而且需要集成语音的实时转写功能。

二.看文档

领导和我说公司买了腾讯的服务器啥的，直接和我说让我去研究腾讯TRTC的文档，接到任务的时候挺兴奋的，因为没搞过，所以不放过这次学习的机会。

三.项目中使用

1.引入对应的包

npm i trtc-js-sdk
npm i mul_speech_recogn //语音识别 

语音识别的那个包是我自己从腾讯的demo代码里拉下搞得包，demo地址

2.TRTC引入

TRTC方法可以创建一个实时音视频通信的客户端对象 (Client) 和本地音视频流对象 (Stream)。这张图可以更好的理解。 1.检测TRTC web SDK是否之前当前浏览器。(可以更具我们的业务需求在不同阶段检测，避免用户在当前浏览器操作了很多后，进入会议室的时候提醒当前浏览器不支持，用户体验不好)
2.初始化客户端对象(TRTC.createClient)

export const meetPerson = reactive({
  client: '', //客户端对象
  mediator: { //本地流
    video: '',
    audio: ''
  },
  applicant: {  //远端流1
    video: '',
    audio: ''
  },
  respondent: {  //远端流2
    video: '',
    audio: ''
  }
})

export const initClient = async (state) => {
  meetPerson.client = TRTC.createClient({
    sdkAppId: state.SDKAPPID, // 填写您申请的 sdkAppId
    userId: state.mediator,  // 填写您业务对应的 userId
    userSig: state.userSig, // 填写服务器或本地计算的 userSig
    mode: 'rtc'              //mode有俩种情况 rtc：实时通话   live:互动直播模式
  })
} 

sdkAppId,userId,userSig这些数据