腾讯云实时合唱

更新记录

2.0.0（2023-03-09）

升级IM SDK至版本7.0.3754;
升级TRTC SDK至版本10.9.0;

1.0.0（2022-04-26）

新增在线实时合唱功能；

平台兼容性

Android	Android CPU类型	iOS
适用版本区间：4.4 - 12.0	armeabi-v7a：未测试，arm64-v8a：未测试，x86：未测试	适用版本区间：9 - 16

原生插件通用使用流程：

购买插件，选择该插件绑定的项目。
在HBuilderX里找到项目，在manifest的app原生插件配置中勾选模块，如需要填写参数则参考插件作者的文档添加。
根据插件作者的提供的文档开发代码，在代码中引用插件，调用插件功能。
打包自定义基座，选择插件，得到自定义基座，然后运行时选择自定义基座，进行log输出测试。
开发完毕后正式云打包

付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios

注意事项：使用HBuilderX2.7.14以下版本，如果同一插件且同一appid下购买并绑定了多个包名，提交云打包界面提示包名绑定不一致时，需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择

为您的应用添加在线合唱场景，体验低延时合唱、麦位管理、收发礼物、文字聊天等 TRTC 在合唱场景下的相关能力。

技术支持

建议扫码添加我们技术支持，协助接入和测试。

联系我们	微信号	更多功能
	ruanyunkeji006	麦位管理连麦邀请

快速开始

步骤1: 插件加载

加载插件

首先，uniapp平台的原生插件，需要自定义基座后才能使用，您可以按照自定义基座文档进行自定义基座操作。

新建nvue文件，注意该模块必须在nvue中使用。

插件名称为: RY-TencentTrtcChorus，使用标签

<view>
        <RY-TencentTrtcChorus class="trtc" ref="chorus" v-bind:style = "{ width: playerWidth, height: playerHeight }"></RY-TencentTrtcChorus>
<view>

腾讯云配置

注册或登录腾讯云账号，并进行实名认证；
点击实时音视频，点击"创建应用"创建实时音视频应用。

生成签名

手动签名点击 UserSig生成&校验选择对应的sdkAppId的应用，输入userId，获取对应的用户签名userSig；

如果您需要【自动签名】，联系我们（微信号: ruanyunkeji006）获取。

步骤2: 插件初始化

必须调用 [init]() 函数后，才可以使用插件个各个功能。

this.$refs.chorus.init({}, ret => {
    console.log(ret);
});

步骤3: 设置监听

调用 [setKaraokeListener]() 函数注册组件的[事件回调]()。

this.$refs.chorus.setKaraokeListener({}, ret => {
    console.log(ret);
});

步骤4: 登录

调用 [login]() 函数完成组件的登录，请参考下表填写关键参数

this.$refs.chorus.login({
    sdkAppId: 1400xxx416,
    userId: 'test001', 
    userSig: 'flkdjslfaxxxxljfdksaf'
}, ret => {
        console.log(ret);
});

步骤5: 实现实时合唱场景

主播创建房间 [createRoom]();

this.$refs.chorus.createRoom({
    roomId: "房间Id", 
    roomParam: {
        roomName: '房间名称',
        needRequest: false, // 上麦是否需要房主确认
        coverUrl: '房间封面图URL',
        seatCount: 2, 
        rtmpPushUrl: 'rtmp://xxxx.xxx.xxx',
        rtmpPlayUrl: 'flv://xxx.xxx.xxx'
    }
}, ret => {
    console.log(ret);
});

听众进入房间 [enterRoom]()

this.$refs.chorus.enterRoom({
        roomId: "房间Id"
    }, ret => {
        console.log(ret);
    }
});

听众主动上麦成为副唱

this.$refs.chorus.enterSeat({
    seatIndex: 1
}, ret => {
    console.log(ret);
});

this.$refs.chorus.setChorusListener({}, ret => {
    if (ret.hasOwnProperty('eventType')) {
        // 4.收到 onSeatListChange 回调，刷新您的麦位列表
        if ('onSeatListChange' == ret.eventType) {

        }
    }
});

实现音乐播放并合唱

您可以根据自己的业务获取音乐 ID 和 URL 链接播放歌曲并合唱，相关接口说明请参见 TUIChorus 音乐播放接口

// 播放音乐
this.$refs.chorus.startPlayMusic({
    musicId: 1,
    url: 'http://xxx.xxx.xxx/xxx.mp3'
}, ret => {
    console.log(ret);
});

步骤6: 文字聊天功能（可选）

如果您需要实现主播、副唱以及听众之间聊天的功能，可以通过以下方法发送或接收聊天信息。

// 发送端：发送文本消息
this.$refs.chorus.sendRoomTextMsg({
    msg: 'Hello World!'
}, ret => {
    console.log(ret);
});

this.$refs.chorus.setKaraokeListener({}, ret => {
    if (ret.hasOwnProperty('eventType')) {
        // 接收端：监听文本消息
        if ('onRecvRoomTextMsg' == ret.eventType) { 
            console.log("收到来自: " + ret.userInfo.userName + "的消息: " + ret.message);
        }
    }
})

步骤7: 礼物发送功能（可选）

如果您需要实现礼物发送和接收功能，可以通过以下方法发送礼物或接收礼物并展示。

// 发送端：通过自定义 "IMCMD_GIFT" 来区分礼物消息
this.$refs.chorus.sendRoomCustomMsg({
    cmd: 'IMCMD_GIFT', 
    msg: 'hello world'
}, ret => {
    console.log(ret);
});

this.$refs.chorus.setChorusListener({}, ret => {
    if (ret.hasOwnProperty('eventType')) {
        // 接收端：监听自定义消息
        if ('onRecvRoomCustomMsg' == ret.eventType) {
            if ('IMCMD_GIFT' == ret.cmd) {
                // 收到礼物消息
                console.log("收到来自: " + ret.userInfo.userName + "的礼物: " + ret.message);
            }
        }
    }
});