语音沙龙(Android)

最后更新时间:2021-08-27 16:32:16

    效果展示

    您可以 下载 安装我们的 App 体验语音沙龙的能力,包括语音聊天、上下麦、低延时语音互动等 TRTC 在语音聊天场景下的相关能力。

    如需快速接入语音沙龙功能,您可以直接基于我们提供的 App 进行修改适配,也可以使用我们提供的 TRTCChatSalon 组件并实现自定义 UI 界面。

    复用 App 的 UI 界面

    步骤1:创建新的应用

    1. 登录实时音视频控制台,选择【开发辅助】>【快速跑通Demo】。
    2. 输入应用名称,例如 TestChatSalon ,单击【创建】。
    3. 单击【已下载,下一步】,跳过此步骤。

    注意:

    本功能同时使用了腾讯云 实时音视频 TRTC即时通信 IM 两个基础 PaaS 服务,开通实时音视频后会同步开通即时通信 IM 服务。 即时通信 IM 属于增值服务,详细计费规则请参见 即时通信 IM 价格说明

    步骤2:下载 App 源码

    单击进入 TUIChatSalon,Clone 或者下载源码。

    步骤3:配置 App 工程文件

    1. 进入修改配置页,根据您下载的源码包,选择相应的开发环境。
    2. 找到并打开 Android/Debug/src/main/java/com/tencent/liteav/debug/GenerateTestUserSig.java 文件。
    3. 设置 GenerateTestUserSig.java 文件中的相关参数:
      • SDKAPPID:默认为占位符(PLACEHOLDER),请设置为实际的 SDKAppID。
      • SECRETKEY:默认为占位符(PLACEHOLDER),请设置为实际的密钥信息。
    4. 粘贴完成后,单击【已复制粘贴,下一步】即创建成功。
    5. 编译完成后,单击【回到控制台概览】即可。
    注意:

    • 本文提到的生成 UserSig 的方案是在客户端代码中配置 SECRETKEY,该方法中 SECRETKEY 很容易被反编译逆向破解,一旦您的密钥泄露,攻击者就可以盗用您的腾讯云流量,因此该方法仅适合本地跑通 App 和功能调试
    • 正确的 UserSig 签发方式是将 UserSig 的计算代码集成到您的服务端,并提供面向 App 的接口,在需要 UserSig 时由您的 App 向业务服务器发起请求获取动态 UserSig。更多详情请参见 服务端生成 UserSig

    步骤4:运行 App

    使用 Android Studio(3.5以上的版本)打开源码工程 TUIChatSalon,单击【运行】即可开始调试本 App。

    步骤5:修改 App 源代码

    源码中的 Source 文件夹包含两个子文件夹 ui 和 model,ui 文件夹中均为界面代码,如下表格列出了各个文件或文件夹及其所对应的 UI 界面,以便于您进行二次调整:

    文件或文件夹 功能描述
    base UI 使用的基础类。
    list 创建房间页。
    room 主房间页面,包括房主和听众两种界面。
    widget 通用控件。

    体验应用

    注意:

    体验应用至少需要两台设备。

    用户 A

    1. 输入用户名(请确保用户名唯一性,不能与其他用户重复)并登录,如图示:
    2. 进入后,单击【创建房间】,如下图示:
    3. 输入房间主题,单击【开始交谈】。

    用户 B

    1. 输入用户名(请确保用户名唯一性,不能与其他用户重复)并登录,如图示:
    2. 输入用户 A 创建的房间号,单击【进入房间】。
    注意:

    房间号在用户 A 的房间顶部查看,如下图示:

    实现自定义 UI 界面

    源码 中的 Source 文件夹包含两个子文件夹 ui 和 model,model 文件夹中包含可重用的开源组件 TRTCChatSalon,您可以在 TRTCChatSalon.java 文件中看到该组件提供的接口函数,并使用对应接口实现自定义 UI 界面。

    步骤1:集成 SDK

    语音沙龙组件 Source 依赖 TRTC SDK 和 IM SDK,您可以按照如下步骤将两个 SDK 集成到项目中。

    方法一:通过 Maven 仓库依赖

    1. 在 dependencies 中添加 TRTCSDK 和 IMSDK 的依赖。
      dependencies {
      complie "com.tencent.liteav:LiteAVSDK_TRTC:latest.release"
      complie 'com.tencent.imsdk:imsdk:latest.release'
      compile 'com.google.code.gson:gson:2.3.1'
      }
      >?两个 SDK 的最新版本号,可以在 [TRTC](https://github.com/tencentyun/TRTCSDK) 和 [IM](https://github.com/tencentyun/TIMSDK) 的 GitHub 首页获取。
    2. 在 defaultConfig 中,指定 App 使用的 CPU 架构。
      defaultConfig {
      ndk {
      abiFilters "armeabi-v7a"
      }
      }
    3. 单击【Sync Now】,自动下载 SDK 并集成到工程里。

    方法二:通过本地 AAR 依赖

    若您的开发环境访问 Maven 仓库较慢,您可以直接下载 ZIP 包,并按照集成文档手动集成到您的工程中。

    SDK下载页面集成指引
    TRTC SDK DOWNLOAD 集成文档
    IM SDK DOWNLOAD 集成文档

    步骤2:配置权限及混淆规则

    在 AndroidManifest.xml 中配置 App 的权限,SDK 需要以下权限(6.0以上的 Android 系统需要动态读取存储权限):

    <uses-permission android:name="android.permission.INTERNET">
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE">
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE">
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE">
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE">
    <uses-permission android:name="android.permission.RECORD_AUDIO">
    <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS">
    <uses-permission android:name="android.permission.BLUETOOTH">
    <uses-permission android:name="android.permission.READ_PHONE_STATE">

    在 proguard-rules.pro 文件,将 SDK 相关类加入不混淆名单:

    -keep class com.tencent.** { *; }

    步骤3:导入 TRTCChatSalon 组件

    拷贝以下目录中的所有文件到您的项目中:

    Source/src/main/java/com/tencent/liteav/trtcchatsalon/model

    步骤4:创建并登录组件

    1. 调用 sharedInstance 接口可以创建一个 TRTCChatSalon 组件的实例对象。
    2. 调用 setDelegate 函数注册组件的事件通知。
    3. 调用 login 函数完成组件的登录,请参考下表填写关键参数:
      参数名作用
      sdkAppId 您可以在 实时音视频控制台 中查看 SDKAppID。
      userId 当前用户的 ID,字符串类型,只允许包含英文字母(a-z、A-Z)、数字(0-9)、连词符(-)和下划线(_)。
      userSig 腾讯云设计的一种安全保护签名,获取方式请参考 如何计算 UserSig
      callback 登录回调,成功时 code 为0。
      TRTCChatSalon mTRTCChatSalon = TRTCChatSalon.sharedInstance(this);
      mTRTCChatSalon.setDelegate(this);
      mTRTCChatSalon.login(SDKAPPID, userId, userSig, new TRTCChatSalonCallback.ActionCallback() {
      @Override
      public void onCallback(int code, String msg) {
      if (code == 0)
      {
      //登录成功
      }
      }
      });

    步骤5:房主端开播

    1. 房主执行 步骤4 登录后,可以调用 setSelfProfile 设置自己的昵称和头像。
    2. 房主调用 createRoom 创建新的语音沙龙,此时传入房间 ID、上麦是否需要房主确认、房间类型等房间属性信息。
    3. 房主会收到有成员进入的 onAnchorEnterSeat 的事件通知,此时会自动打开麦克风采集。

    // 1.房主设置昵称和头像
    mTRTCChatSalon.setSelfProfile("my_name", "my_face_url", null);

    // 2.房主调用 createRoom 创建房间
    final TRTCChatSalonDef.RoomParam roomParam = new TRTCChatSalonDef.RoomParam();
    roomParam.roomName = "房间名称";
    roomParam.needRequest = true; // 上麦是否需要房主确认
    roomParam.coverUrl = "房间封面图的 URL 地址";
    mTRTCChatSalon.createRoom(mRoomId, roomParam, new TRTCChatSalonCallback.ActionCallback() {
    @Override
    public void onCallback(int code, String msg) {
    if (code == 0)
    {
    // 3.占座位
    mTRTCChatSalon.enterSeat(new TRTCChatSalonCallback.ActionCallback() {
    @Override
    public void onCallback(int code, String msg) {
    if (code == 0)
    {
    }
    }
    });
    }
    }
    });

    // 4.占座成功后, 收到 onAnchorEnterSeat 事件通知
    @Override
    public void onAnchorEnterSeat(TRTCChatSalonDef.UserInfo userInfo) {
    }

    步骤6:听众端观看

    1. 听众端执行 步骤4 登录后,可以调用 setSelfProfile 设置自己的昵称和头像。
    2. 听众端向业务后台获取最新的语音沙龙房间列表。
      说明:

      App 中的语音沙龙列表仅做演示使用,语音沙龙列表的业务逻辑千差万别,腾讯云暂不提供语音沙龙列表的管理服务,请自行管理您的语音沙龙列表。

    3. 听众端调用 getRoomInfoList 获取房间的详细信息,该信息是在房主端调用 createRoom 创建语音沙龙时设置的简单描述信息。
      注意:

      如果您的语音沙龙列表包含了足够全面的信息,可跳过调用 getRoomInfoList 相关步骤。

    4. 听众选择一个语音沙龙,调用 enterRoom 并传入房间号即可进入该房间。
    5. 进房后会收到组件的 onRoomInfoChange 房间属性变化事件通知,此时可以记录房间属性并做相应改变,例如 UI 展示房间名、记录上麦是否需要请求房主同意等。
    6. 进房后还会收到麦位表有主播进入的 onAnchorEnterSeat 的事件通知。

    // 1.听众设置昵称和头像
    mTRTCChatSalon.setSelfProfile("my_name", "my_face_url", null);

    // 2.假定您从业务后台获取房间列表为 roomList
    List<integer> roomList = GetRoomList();

    // 3.通过调用 getRoomInfoList 获取房间的详细信息
    mTRTCChatSalon.getRoomInfoList(roomList, new TRTCChatSalonCallback.RoomInfoCallback() {

    @Override
    public void onCallback(int code, String msg, List<trtcchatsalondef.roominfo> list) {
    if (code == 0)
    {
    // 此时可以刷新您自己的 UI 房间列表
    }
    }

    });

    // 4.传入 roomId 进入房间
    mTRTCChatSalon.enterRoom(roomId, new TRTCChatSalonCallback.ActionCallback() {
    @Override
    public void onCallback(int code, String msg) {
    if (code == 0)
    {
    //进房成功
    }
    }
    });

    // 5.进房成功后,收到 onRoomInfoChange 事件通知
    @Override
    public void onRoomInfoChange(TRTCChatSalonDef.RoomInfo roomInfo) {
    mNeedRequest = roomInfo.needRequest;
    mRoomName = roomInfo.roomName;
    // UI 可以展示标题等
    }

    // 6.收到 onAnchorEnterSeat 事件通知
    @Override
    public void onAnchorEnterSeat(TRTCChatSalonDef.UserInfo userInfo) {
    }

    步骤7:上下麦

    1. pickSeat 传入听众 userId, 可以抱人上麦,房间内所有成员会收到 onAnchorEnterSeat 的事件通知。
    2. kickSeat 传入对应用户的 userId 后,可以踢人下麦,房间内所有成员会收到 onAnchorLeaveSeat 的事件通知。


    麦位操作后的事件通知顺序如下:callback > onAnchorEnterSeat 等独立事件。

    // 1.房主抱人上麦位
    mTRTCChatSalon.pickSeat("123", new TRTCChatSalonCallback.ActionCallback() {
    @Override
    public void onCallback(int code, String msg) {
    // 2.收到 callback 回调
    if (code == 0) {
    }
    }
    });

    // 3.听众成为主播,进入麦位通知,可以在这里判断听众是不是真的上麦成功
    public void onAnchorEnterSeat(TRTCChatSalonDef.UserInfo user) {
    }

    步骤8:邀请信令的使用

    如果您的 App 需要对方同意才能进行下一步操作的业务流程,那么邀请信令可以提供相应支持。

    1. 听众端调用 sendInvitation 传入房主的 userId 和业务的自定义命令字等,此时函数会返回一个 inviteId,记录该 inviteId。
    2. 房主端收到 onReceiveNewInvitation 的事件通知,此时 UI 可以弹窗并询问房主是否同意。
    3. 房主选择同意后,调用 acceptInvitation 并传入 inviteId。
    4. 听众端收到 onInviteeAccepted 的事件通知,调用 enterSeat 进行上麦。

    // 听众端视角
    // 1.调用 sendInvitation,请求上麦
    String inviteId = mTRTCChatSalon.sendInvitation("ENTER_SEAT", ownerUserId, "123", null);

    // 2.收到邀请的同意请求, 正式上麦
    @Override
    public void onInviteeAccepted(String id, String invitee) {
    if(id.equals(inviteId))
    {
    mTRTCChatSalon.enterSeat(null);
    }
    }

    // 房主端视角
    // 1.房主收到请求
    @Override
    public void onReceiveNewInvitation(final String id, String inviter, String cmd, final String content) {
    if (cmd.equals("ENTER_SEAT"))
    {
    // 2.房主同意听众请求
    mTRTCChatSalon.acceptInvitation(id, null);
    }
    }

    步骤9:实现文字聊天和弹幕消息

    • 通过 sendRoomTextMsg 可以发送普通的文本消息,所有在该房间内的主播和听众均可以收到 onRecvRoomTextMsg 回调。
      即时通信 IM 后台有默认的敏感词过滤规则,被判定为敏感词的文本消息不会被云端转发。
      // 发送端:发送文本消息
      mTRTCChatSalon.sendRoomTextMsg("Hello Word!", null);
      // 接收端:监听文本消息
      mTRTCChatSalon.setDelegate(new TRTCChatSalonDelegate() {
      @Override
      public void onRecvRoomTextMsg(String message, TRTCChatSalonDef.UserInfo userInfo) {
      Log.d(TAG, "收到来自" + userInfo.userName + "的消息:" + message);
      }
      });
    • 通过 sendRoomCustomMsg 可以发送自定义(信令)的消息,所有在该房间内的主播和听众均可以收到 onRecvRoomCustomMsg 回调。
      自定义消息常用于传输自定义信令,例如用于点赞消息的发送和广播。
      // 发送端:您可以通过自定义 Cmd 来区分弹幕和点赞消息
      // eg:"CMD_DANMU"表示弹幕消息,"CMD_LIKE"表示点赞消息
      mTRTCChatSalon.sendRoomCustomMsg("CMD_DANMU", "Hello world", null);
      mTRTCChatSalon.sendRoomCustomMsg("CMD_LIKE", "", null);
      // 接收端:监听自定义消息
      mTRTCChatSalon.setDelegate(new TRTCChatSalonDelegate() {
      @Override
      public void onRecvRoomCustomMsg(String cmd, String message, TRTCChatSalonDef.UserInfo userInfo) {
      if ("CMD_DANMU".equals(cmd))
      {
      // 收到弹幕消息
      Log.d(TAG, "收到来自" + userInfo.userName + "的弹幕消息:" + message);
      } else if ("CMD_LIKE".equals(cmd)) {
      // 收到点赞消息
      Log.d(TAG, userInfo.userName + "给您点了个赞!");
      }
      }
      });