更新记录

1.0.0（2025-05-02）

• 音视频通话
• 切换麦克风
• 切换摄像头

平台兼容性

基于livekit的webrtc的音视频通话，无需打洞

功能

• 音视频通话
• 切换麦克风
• 切换摄像头

快速跑通demo

1. 集成插件步骤请参考https://www.cnblogs.com/wenrisheng/p/18323027
2. 安装部署livekit服务器

• 安装livekit服务https://github.com/livekit/livekit 安装成功后，命名行执行启动服务命令，启动后会有API Key和API Secret, key和secret用于生成token时使用：

// 启动服务：
livekit-server --dev --bind 0.0.0.0

• 安装livekit命令https://github.com/livekit/livekit-cli 使用cli名称生成两个用户的token用以测试，实际项目的token由后端，后端生成token文档参考https://github.com/livekit/livekit里的Server SDKs cli生成user1和user2的token:

// 用户user1
lk token create \
    --api-key devkey --api-secret secret \
    --join --room my-first-room --identity user1 \
    --valid-for 999h

//用户user2
lk token create \
     --api-key devkey --api-secret secret \
     --join --room my-first-room --identity user2 \
     --valid-for 999h

3. 修改demo的url和token,自定义基座运行后点击加入房间，需要渲染视频画面的页面要用nvue

接口

import {
    UTSLiveKitRoom
} from "@/uni_modules/wrs-uts-livekit"
let room = new UTSLiveKitRoom()

• 设置回调

room.onCallback((resp) => {
    this.showMsg(JSON.stringify(resp))
    let opt = resp.opt
    switch (opt) {
        case "didConnect": {
            // 成功加入房间

        }
        break;
        case "didPublishTrack": {
            // 本地音视频推流
            let kind = resp.participant.kind
            switch (kind) {
                // 音频Track
                case 0: {

                }
                break;
                // 视频Track
                case 1: {
                    switch (uni.getSystemInfoSync().platform) {
                        case 'android': {
                            this.localIdentity = "123456"
                        }
                        break;
                        case 'ios': {
                            this.showMsg("didPublishTrack video:" + resp.participant.identity)
                            this.localIdentity = resp.participant.identity
                        }
                        break;
                        default:
                            break;
                    }

                }
                break;
                default:
                    break;
            }
        }
        break;
        case "participantDidConnect": {
            // iOS端：其他人加入房间时会回调
            this.showMsg("participantDidConnect")
        }
        break;
        case "participantDidDisconnect": {
            this.showMsg("participantDidDisconnect")
        }
        break;
        case "didUpdateName": {
            // iOS端：其他人加入房间时会回调
        }
        break;
        // 收到其他人发布的音频、视频流
        case "didSubscribeTrack": {

            // 其他人音视频推流
            let kind = resp.publication.kind
            switch (kind) {
                // 音频Track
                case 0: {

                }
                break;
                // 视频Track
                case 1: {
                    let remoteIdentify = resp.participant.identity
                    this.showMsg("收到其他人加入的视频:" + remoteIdentify)

                    this.remoteArray.push(remoteIdentify)
                }
                break;
                default:
                    break;
            }
        }
        default:
            break;
    }

})

• 初始化，调用一次就可以

room.initRoom()

• 进入连接房间

let params = {}
params.url = "ws://192.168.2.73:7880"
params.token = "xxx"
room.connect(params, (resp) => {
    console.log("nvue room.connect:" + JSON.stringify(resp))
    let flag = resp.flag
    if(flag) {
        // 先调用连接接口后才能打开摄像头
        this.openCameraMic()
    } else {
        this.showMsg("连接失败:" + JSON.stringify(resp))
    }

})

• 打开相机和麦克风，连接房间后再打开

let position = "front"
if(this.isFrontCamera) {
    position = "front"
} else {
    position = "back"
}
let params = {}
params.camera = {
    enable: true,
    position: position, // front、back
    fps: 30
}
params.mic = {
    enable: true
}
room.setCameraMic(params, ()=>{
    if(this.isAndroid) {
        this.localIdentity = new Date().getTime() + ""
    }

    console.log("nvue room.setCameraMic callback")
})

• 离开房间

room.disConnect(() => {

})

• 切换摄像头

room.switchCamera((resp) => {
    if (resp.flag) {

    } else {
        this.showMsg("切换失败:" + JSON.stringify(resp))
    }
})

• 开启/关闭麦克风

let params = {}
params.enabled = true // true、false
params.captureOptions = { // captureOptions仅对iOS生效
    noiseSuppression: false,
    highpassFilter: false
}
room.setMicrophone(params, (resp) => {
    console.log(JSON.stringify(resp))
    if (resp.flag) {

    } else {
        this.showMsg("切换失败:" + JSON.stringify(resp))
    }
})

• 渲染本地视频

    <wrs-uts-livekit ref='localView' :style="'width:'+width+'px;height:'+height+'px;'" @onLoadView="onLoadView"
    :localIdentity="localIdentity"></wrs-uts-livekit>

• localIdentity：本地视频标识

  1. iOS的localIdentity在回调didPublishTrack里可以获取到
  2. android调用打开相机接口后就可以设置一个随机数就可以

• 渲染房间里其他人的视频画面

<wrs-uts-livekit :style="'width:'+width+'px;height:'+height+'px;'" :remoteIdentity="remoteIdentity">

</wrs-uts-livekit>

• remoteIdentity：用户标识，在回调didSubscribeTrack可以获取到