uni-app技术分享| uni-app转小程序_实时音视频

微信小程序 实现实时音视频与 uniapp 转码成微信小程序 实现实时音视频两者是一样的，区别仅仅是一个是原生小程序一个是 uniapp 转码成小程序

本文使用uniapp转码成小程序实现音视频通话

前提

• 确保微信开发平台 =》开发 =》开发管理 =》接口设置 的 实时播放音视频流与实时录制音视频流开启

• 线上版本配置 anyRTC 相关的服务器域名(本地调试可设置不校验域名)
  如图所示：小程序原生本地设置不校验域名

• uniapp 转小程序可以在小程序编辑器中配置也可在 uniapp 的 manifest.json 中配置

代码逻辑

1. 引入anyRTC 小程序版的实时音视频 SDK

2. 初始化 SDK

3. 加入相同的频道并将自己的视频流发布出去

4. 根据相关事件回调处理相关逻辑

必须填写 appid (在 anyRTC 控制台的项目管理中获取)
用户 uid 类型必须为字符串并且不重复
只有加入同一频道房间(类型必须为字符串)才可进行通话

代码实现

1. npm 引入 ar-rtc-miniapp

   ```js
     npm i ar-rtc-miniapp
   ```

2. 封装 rtc.js

  ```javascript
    // 引入 RTC
    import ArRTC from "ar-rtc-miniapp";
    console.log("ArRTC 版本", ArRTC);
    // 定义
    let Store = {
        appId: '',
        // 本地用户uid
        userId: "",
        // 频道房间
        channelId: "",

        // RTC 客户端
        rtcClient: null,
        // 本地录制地址(小程序特有推流)
        livePusherUrl: "",
        // 远端播放(小程序特有拉流)
        livePlayerUrl: "",
    };
    // 初始化 RTC
    const InItRTC = async (info) => {
       Store = Object.assign(Store, info)
       // 创建RTC客户端 
       Store.rtcClient = new ArRTC.client();
       // 初始化
       await Store.rtcClient.init(Store.appId);
       // 已添加远端音视频流
       Store.rtcClient.on('stream-added', rtcEvent.userPublished);
       // 已删除远端音视频流
       Store.rtcClient.on('stream-removed', rtcEvent.userUnpublished);
       // 通知应用程序发生错误
       Store.rtcClient.on('error', rtcEvent.error);
       // 更新 Url 地址
       Store.rtcClient.on('update-url', rtcEvent.updateUrl);
       // 远端视频已旋转
       Store.rtcClient.on('video-rotation', rtcEvent.videoRotation);
       // 远端用户已停止发送音频流
       Store.rtcClient.on('mute-audio', rtcEvent.muteAudio);
       // 远端用户已停止发送视频流
       Store.rtcClient.on('mute-video', rtcEvent.muteVideo);
       // 远端用户已恢复发送音频流
       Store.rtcClient.on('unmute-audio', rtcEvent.unmuteAudio);
       // 远端用户已恢复发送视频流
       Store.rtcClient.on('unmute-video', rtcEvent.unmuteAudio);
       return
   }
  // RTC 监听事件处理
  const rtcEvent = {
      // RTC SDK 监听用户发布
      userPublished: ({uid}) => {
	    console.log("RTC SDK 监听用户发布", uid);
	    if (Store.Mode == 0) {
		    uni.showLoading({
			    title: