UPRTC

各平台SDK集成Demo演示 #

需要在开发者控制台为Demo创建应用，来指定Demo中需要配置AppId，AppKey等参数。

C++ #

  • C++ 作为底层模块，提供网络支持，核心功能，跨平台支持等
  • Qt,IOS,Android都依赖C++模块
  • 开发环境搭建，音视频通讯/编解码/渲染，底层接口等对开发者不太友好，所以不直接提供底层C++ SDK
  • Qt是C++顶级跨平台应用程序框架，我们把Qt作为应用层和底层C++整合，提供了UPRTC Qt平台的SDK
  • 其他平台独有C++应用框架，如windows的MFC，macOS的Cocoa，linux的GTK(跨平台)等，定制提供SDK

Qt #

SDK默认提供64位Windows和macOS版本，Linux SDK联系客户获取，暂不提供任何系统的32位SDK。

  1. 下载Demo (opens new window)，再把SDK解压后直接放到工程目录下，目录结构如下：
├── mainwindow.cpp
├── mainwindow.h
├── mainwindow.ui
├── ui_mainwindow.h
├── uprtc
│   ├── Darwin
│   │   └── uprtc-qt-sdk.framework
│   └── Windows
│       ├── debug
│       │   ├── uprtc-qt-sdk.dll
│       │   └── uprtc-qt-sdk.lib
│       ├── include
│       │   ├── ... ...
│       └── release
│           ├── uprtc-qt-sdk.dll
│           └── uprtc-qt-sdk.lib
├── uprtc-qt-demo.pro
  1. 使用Qt Creator打开项目，打开mainwindow.cpp，修改如下宏定义，编译运行。如何使用
#define APP_ID ""
#define APP_KEY ""
#define PACKAGE_NAME ""
#define SERVER_URL ""


Android #

  1. 下载Demo (opens new window)。

  2. 用Android Studio导入工程，打开app下build.gradle，添加uprtc依赖

dependencies {
  ...
  implementation 'com.cmcim.uprtc.android:uprtc:2.2.3@aar'
  ...
}
  1. 打开MainActivity.java在onCreate配置/修改appId, appKey。也可以放到Application的onCreate方法中。
UPRTCClient.init(this, "xxxxxx", "xxxxxxxxxxxxxxx");

  1. 启动运行后，点击设置，配置服务器地址，房间ID，用户ID

  2. 加入房间成功后，demo会默认打开摄像机和麦克风


IOS #

  1. 下载Demo (opens new window)。
  2. 添加UPRTCSDK.framework
  • 使用pod方式，在Podfile文件中添加
pod 'UPRTC', '~> 2.2.0'
  • 直接引用famework，在开发者控制台下载画面中下载SDK，解压得到UPRTCSDK.xcframework，添加到XCode中。
  • SDK支持在模拟器运行，但模拟器不支持摄像头采集，如果要采集摄像头需要真机调试。
  1. 在AppDelegate.m中配置appId,appKey
[UPRTCClient initializedWithAppId:@"xxxxxx" appKey:@"xxxxxxxxxxxxxxxxxxxxxx"];
  1. 启动运行。点击设置，配置服务器地址，房间ID，用户ID

屏幕分享 #

IOS屏幕分享具有其系统特性，请按照如下步骤操作

  1. 创建扩展程序

  2. 创建完成，记录扩展程序的BundleId

  3. 配置工程后台运行模式，实际使用中分享屏幕需要把APP退到后台，要保持正常通话状态，需要按照下图配置。

  4. 使用UShareScreenHandler实现扩展进程Handler，在类中定义UShareScreenHandler属性对象，然后按下图填入即可。

5，加入房间后调用 - (void) shareScreen:(NSString*) extensionBundleId; 参数extensionBundleId就是2中BundleId。


WEB/JS #

  1. 下载Demo (opens new window)，兼容支持websocket，webrtc的所有浏览器。
  2. Demo使用vue开发，同样也适用与React,Anguler的前端项目，推荐使用是VS Code编辑此项目，点击底部面板TERMINAL(终端)，来到项目根目录执行如下命令安装依赖。
# node v12.4.0 (非必须)
npm install 或者 npm install --registry=https://registry.npm.taobao.org # (国内推荐)

给已经存在的项目单独安装sdk，也可在开发者控制台直接下载，建议通过npm方式或其他依赖管理方式下载。

# latest verion 2.2.4 (webpack5) 或 2.1.5 (webpack4)
npm install uprtc-web-client
  1. 打开App.vue，配置packageName,appId,appKey
UPRTCClient.configUPRTC('xxxx.xxxx.xxxx', 'xxxxxx', 'xxxxxxxxxxxxxxxx')
  1. 启动: npm run serve


Electron #

  1. 下载Demo (opens new window)，支持electron >= 2.x。分享桌面功能低版本的elecron不提供窗口应用图标。
  2. Demo使用electron-vue (opens new window)开发，同样也适用于其他electron框架，推荐使用是VS Code编辑此项目，点击底部面板TERMINAL(终端)，来到项目根目录执行如下命令安装依赖。
# node v14.16.0 (非必须)
npm install 或者 npm install --registry=https://registry.npmmirror.com # (国内推荐)

给已经存在的项目单独安装sdk，也可在开发者控制台直接下载，建议通过npm方式或其他依赖管理方式下载。

# latest verion 2.2.5 (webpack5) 或 2.1.19 (webpack4)
npm install uprtc-electron-client
  1. 打开src/main/index.js，配置packageName,appId,appKey
UPRTCClient.configUPRTC('xxxx.xxxx.xxxx', 'xxxxxx', 'xxxxxxxxxxxxxxxx')
  1. 启动: npm run dev

Demo使用 #

  • UPRTC是跨平台开发框架，平台互通，所有不同平台Demo可以相互通信。
  • 确保服务端已经正常启动
  • 下载指定平台的Demo，确定本地有指定平台的开发环境，并在开发者控制台创建对应的应用
  • 选用擅长的方式调用服务端接口，curl或postman等

不搭建服务器，不编译demo，参照快速体验

以下对Demo的操作只为展示功能接口，并不代表实际业务流程，开发者需根据真实业务场景设计具体的接口调用时序

多方会话 #

  1. 调用服务端接口创建会话房间。
  2. 根据1.应答内容在客户端填写房间地址、房间ID，用户ID可以是请求参数中的masterId，也可以是memberIds的其中一个，如果都不是就需要使用邀请码加入房间（房间地址为serverUrl + invitationCode）
  3. 所有客户端点击加入房间，就可以互相视频通话了
  4. 不在memberIds中，也不使用邀请码的用户ID无法加入到房间。
  5. 调用服务端接口添加会话成员可添加新的成员。
  6. 所有成员离开会自动关闭房间，或者调用服务端接口关闭房间。

直播 #

  1. 调用服务端接口创建直播间。
  2. masterId(主播)先加入到房间，其他客户端的用户ID可随意填写但不能重复，加入房间后可看到主播画面。
  3. 选择已经加入房间的任意用户ID作为连麦对象，调用服务端连麦接口，主播和其他用户可见连麦用户画面，请求参数设为audio时只能听到声音。
  4. 客户端直接关闭媒体输出(参照demo源码)或退出房间可结束连麦，也可调用服务端接口关闭连麦。
  5. 主播互动，例如上面创建叫房间A，再创建直播房间B，另外打开客户端加入到房间B，调用服务端接口连接直播间，A,B的观众客户端能接收它们媒体流，也就是能看到2个主播在互动。
  6. 结束互动，调用服务端接口分离直播间，A的观众只能看见A，B的观众只能看见B
上次更新: 8/27/2024, 7:32:11 PM