腾讯云多人音视频房间SDK快速接入 (Flutter)_音视频解决方案_同尘科技

本文将指导您如何在最短时间内完成TUIRoomKit组件的接入。遵循本文档的步骤，您将在一个小时内完成以下关键步骤，并最终实现一个具备完整 UI 界面的音视频会议功能。

环境准备

步骤一：开通服务

在使用TUIRoomKit前，您需要开通TUIRoomKit专属的多人音视频互动服务，详细步骤如下：1. 登录 腾讯云视立方 SDK 控制台，单击创建项目 ，选择多人音视频互动场景和集成方式。2. 在选定接入场景和集成方式以后，您需要开通多人音视频房间 SDK 使用的两项腾讯云基础的 PaaS 能力，即 即时通信 IM 和 实时音视频 TRTC，开通后，单击创建项目并下一步。3. 在项目创建完成以后，您需要为该项目匹配一个 IM 应用。因为多人音视频房间 SDK 依赖了 IM SDK 提供的基础能力，在这里可以创建或者管理已有的 IM 应用。关联成功后，可以领取7天的免费体验版，用于后续的开发调试工作。如果您之前已经体验过，可以直接在该页面单击 购买正式版本。4. 单击前往集成，选择项目配置。查看详细的配置页面，找到SDKAppID和密钥并记录下来。它们会在后续的 步骤三：登录 TUIRoomKit 组件 中被用到，至此多人音视频房间 SDK 服务开通完成。

步骤二：集成 TUIRoomKit 组件

在您的工程pubspec.yaml文件中，添加 rtc_conference_tui_kit 插件依赖，或进入您的工程目录下执行如下命令添加依赖。

dependencies:       rtc_conference_tui_kit: 最新版本

执行以下命令安装组件：

flutter pub get

步骤三：完成工程配置

由于 rtc_conference_tui_kit 组件使用了GetX状态管理库进行导航，您需要在您的应用程序中使用GetMaterialApp来代替MaterialApp。或者您也可以将您MaterialApp中的navigatorKey属性设置为Get.key以实现相同的效果。使用 Xcode 打开您的工程，选择项目 > Building Settings > Deployment，将其下的Strip Style设置为Non-Global Symbols，以保留所需要的全局符号信息。如您需要在iOS端使用音视频功能，需要授权麦克风和摄像头的使用权限（Android端已在 SDK 中声明相关权限，您无需手动进行相关配置）。在 App 的Info.plist中添加以下两项，分别对应麦克风和摄像头在系统弹出授权对话框时的提示信息。

NSCameraUsageDescriptionTUIRoom需要访问您的相机权限NSMicrophoneUsageDescriptionTUIRoom需要访问您的麦克风权限

完成以上添加后，在您的 ios/Podfile 中添加以下预处理器定义，用于启用相机与麦克风权限。

post_install do |installer|  installer.pods_project.targets.each do |target|    flutter_additional_ios_build_settings(target)      target.build_configurations.each do |config|        config.build_settings['GCC_PREPROCESSOR_DEFINITIONS'] ||= [      '$(inherited)',      'PERMISSION_MICROPHONE=1',      'PERMISSION_CAMERA=1',      ]    end  endend

步骤四：登录组件

在您的项目中添加如下代码，它的作用是通过调用TUIRoomKit中的相关接口完成组件的初始化。这个步骤非常关键，因为只有在初始化后才能正常使用 TUIRoomKit的各项功能，故请您耐心检查相关参数是否配置正确：

import 'package:rtc_room_engine/rtc_room_engine.dart';
var result = await TUIRoomEngine.login(    SDKAPPID, // 请替换为您的SDKAPPID    'userId', // 请替换为您的User ID    'userSig',// 请替换为您的userSig    );
if (result.code == TUIError.success) {      // login success} else {      // login error}

参数说明
这里详细介绍一下 login 函数中所需要用到的几个关键参数：SDKAppID：在 步骤一 中的第4步中您已经获取到，这里不再赘述。UserID：当前用户的 ID，字符串类型，只允许包含英文字母（a-z 和 A-Z）、数字（0-9）、连词符（-）和下划线（_）。UserSig：使用 步骤一 的第4步中获取的 SecretKey 对 SDKAppID、UserID 等信息进行加密，就可以得到 UserSig，它是一个鉴权用的票据，用于腾讯云识别当前用户是否能够使用 TRTC 的服务。您可以通过控制台中的 辅助工具 生成一个临时可用的 UserSig。更多信息请参见 如何计算及使用 UserSig。注意：这个步骤也是目前我们收到的开发者反馈最多的步骤，常见问题如下：SDKAppID设置错误，国内站的SDKAppID一般是以140开头的10位整数。UserSig被错配成了加密密钥（SecretKey），UserSig是用SecretKey把SDKAppID、UserID以及过期时间等信息加密得来的，而不是直接把SecretKey配置成UserSig。UserID被设置成“1”、“123”、“111”等简单字符串，由于 TRTC 不支持同一个 UserID 多端登录，所以在多人协作开发时，形如 “1”、“123”、“111” 这样的UserID很容易被您的同事占用，导致登录失败，因此我们建议您在调试的时候设置一些辨识度高的UserID。Github中的示例代码使用了genTestUserSig函数在本地计算 UserSig 是为了更快地让您跑通当前的接入流程，但该方案会将您的 SecretKey暴露在 App 的代码当中，这并不利于您后续升级和保护您的 SecretKey，所以我们强烈建议您将UserSig的计算逻辑放在服务端进行，并由 App 在每次使用TUIRoomKit组件时向您的服务器请求实时计算出的 UserSig。

步骤五：使用组件

设置用户信息

通过调用TUIRoomKit的setSelfInfo即可设置用户的用户名、头像。

import 'package:rtc_conference_tui_kit/rtc_conference_tuikit.dart';
var roomKit = TUIRoomKit.createInstance();roomKit.setSelfInfo(userName, avatarURL);

创建房间

通过调用TUIRoomKit的createRoom方法，便可以创建房间。

import 'package:rtc_conference_tui_kit/rtc_conference_tuikit.dart';
var roomKit = TUIRoomKit.createInstance();TUIRoomInfo roomInfo = TUIRoomInfo(roomId: '您的roomId');var result = await roomKit.createRoom(roomInfo);if (result.code == TUIError.success) {        // create room success} else {       // create room error}

注意：在调用createRoom方法创建房间后，并不会自动进入房间，您需要手动调用进入房间接口enterRoom后才能进入房间。

加入房间

通过调用TUIRoomKit的enterRoom函数并指定房间号，便可以进入指定房间。(调用该接口后会为您拉起UI界面进入房间)

import 'package:rtc_conference_tui_kit/rtc_conference_tuikit.dart';
var roomKit = TUIRoomKit.createInstance();var result = await roomKit.enterRoom('roomId',         // 您的room id                                     isOpenMicrophone, // 进房是否开启麦克风                                     isOpenCamera,     // 进房是否开启摄像头                                     userSpeaker);     // 进房是否使用扬声器播放声音if (result.code == TUIError.success) {    // enter room success} else {        // enter room success}

更多功能

TUIRoomEngine SDK 提供了丰富音视频房间功能，具体内容请参考 API 概览。

交流与反馈

如果您在使用过程中有遇到什么问题，欢迎提交 issue，我们也欢迎您加入我们的 开发者社群 进行技术交流和反馈问题.

对音视频的解决方案有疑惑？想了解解决方案收费？ 联系解决方案专家

腾讯云限时活动1折起，即将结束： 马上收藏

同尘科技为腾讯云授权服务中心，购买腾讯云享受折上折，更有现金返利:同意关联，立享优惠

阿里云解决方案也看看？： 点击对比阿里云的解决方案