实时语音通话(Flutter)

最后更新时间:2021-08-27 14:26:31

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

    复用 Demo 的 UI 界面

    步骤1:创建新的应用

    1. 登录实时音视频控制台,选择【开发辅助】>【快速跑通Demo】。
    2. 输入应用名称,例如 TestAudioCall ,单击【创建】。
    注意:

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

    步骤2:下载 SDK 和 Demo 源码

    1. 根据实际业务需求下载 SDK 及配套的 Demo 源码
    2. 下载完成后,单击【已下载,下一步】。

    步骤3:配置 Demo 工程文件

    1. 进入修改配置页,根据您下载的源码包,选择相应的开发环境。
    2. 找到并打开 /example/lib/debug/GenerateTestUserSig.dart 文件。
    3. 设置 GenerateTestUserSig.dart 文件中的相关参数:
    • SDKAPPID:默认为 PLACEHOLDER ,请设置为实际的 SDKAppID。
    • SECRETKEY:默认为 PLACEHOLDER ,请设置为实际的密钥信息。


    4. 粘贴完成后,单击【已复制粘贴,下一步】即创建成功。
    5. 编译完成后,单击【回到控制台概览】即可。

    注意:

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

    步骤4:运行 Demo

    注意:

    Android 端需要在真机下运行,不支持模拟器调试。

    1. 执行 flutter pub get
    2. 编译运行调试:
      1. 执行 flutter run
      2. 使用 Android Studio(3.5及以上的版本)打开源码工程,单击【运行】即可。

    步骤5:修改 Demo 源代码

    源码 文件夹 TRTCCallingDemo 中包含两个子文件夹 ui 和 model,其中 ui 文件夹中均为界面代码:

    文件或文件夹 功能描述
    TRTCCallingVideo.dart 展示音视频通话的主界面,通话的接听和拒绝就是在这个界面中完成的
    TRTCCallingContact.dart 用于展示选择联系人的界面,可以通过此界面搜索已注册用户,发起通话

    实现自定义 UI 界面

    源码 文件夹 TRTCCallingDemo 中包含两个子文件夹 ui 和 model,其中 model 文件夹中包含了我们实现的可重用开源组件 TRTCCalling,您可以在 TRTCCalling.dart 文件中看到该组件提供的接口函数。

    您可以使用开源组件 TRTCCalling 实现自己的 UI 界面,即只复用 model 部分,自行实现 UI 部分。

    步骤1:集成 SDK

    音视频通话组件 TRTCCalling 依赖 TRTC SDKIM SDK,您可以通过配置 pubspec.yaml 自动下载更新。

    在项目的 pubspec.yaml 中写如下依赖:

    dependencies:
     tencent_trtc_cloud: 最新版本号
     tencent_im_sdk_plugin: 最新版本号
    

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

    需要在 Info.plist 中加入对相机和麦克风的权限申请:

    <key>NSMicrophoneUsageDescription</key>
    <string>授权麦克风权限才能正常语音通话</string>
    

    步骤3:导入 TRTCCalling 组件

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

    /lib/TRTCCallingDemo/model
    

    步骤4:初始化并登录组件

    1. 调用 TRTCCalling.sharedInstance() 获取组件实例。
    2. 调用 login(SDKAppID, userId, userSig) 完成组件的登录,其中几个关键参数的填写请参考下表:
      参数名作用
      SDKAppID 您可以在 实时音视频控制台 中查看 SDKAppID。
      userId 当前用户的 ID,字符串类型,只允许包含英文字母(a-z 和 A-Z)、数字(0-9)、连词符(-)和下划线(_)。
      userSig 腾讯云设计的一种安全保护签名,计算方式请参考 如何计算 UserSig
      // 初始化
      sCall = await TRTCCalling.sharedInstance();
      sCall.login(1400000123, "userA", "xxxx");

    步骤5:实现 1v1 语音通话

    1. 发起方:调用 TRTCCallingcall() 方法发起通话的请求, 并传入用户 ID(userid)和通话类型(type),通话类型参数传入 TRTCCalling.typeAudioCall
    2. 接收方:当接收方处于已登录状态时,会收到名为 onInvited() 的事件通知,回调中 callType 的参数是发起方填写的通话类型,您可以通过此参数启动相应的界面。
    3. 接收方:如果希望接听电话,接收方可以调用 accept() 函数,并同时调用 openCamera() 函数打开自己本地的摄像头。接收方也可以调用 reject() 拒绝此次通话。
    4. 当双方的音视频通道建立完成后,通话的双方都会接收到名为 onUserVideoAvailable() 的事件通知,表示对方的视频画面已经拿到。此时双方用户均可以调用 startRemoteView() 展示远端的视频画面。远端的声音默认是自动播放的。

    组件 API 列表

    TRTCCalling 组件的 API 接口列表如下:

    接口函数 接口功能
    registerListener 增加 TRTCCalling 监听器,用户可以通过该监听器获取状态通知
    unRegisterListener 移除监听器
    destroy 销毁实例
    login 登录 IM,所有功能需要先进行登录后才能使用
    logout 登出 IM,登出后无法再进行拨打操作
    call C2C 邀请通话,被邀请方会收到 onInvited 的事件通知
    accept 作为被邀请方接听来电
    reject 作为被邀请方拒绝来电
    hangup 结束通话
    setMicMute 是否静音 mic
    setHandsFree 是否开启免提