iOS
業務フロー
この部分では、ライブコマースシナリオによくある業務フローをまとめて、全体のシナリオの実装プロセスをよりよく理解するのに役立ちます。
下図は、アンカー(ルームマスター)のローカルプレビュー、ルームの作成、ルームへの入室と配信開始、ルームからの退室と配信終了のプロセスを示しています。


下図は、アンカーAがアンカーBを招待してクロスルームPKでのコラボ配信を行うプロセスを示しています。クロスルームPK交流のプロセス中、2つのルームの視聴者は両方のルームマスターがPK交流配信している画面を見ることができます。


下図は、RTCリアルタイムインタラクティブライブルームで視聴者がルームに入る、マイクオンを申請する、マイクオフをする、ルームから退出するプロセスを示しています。


下図は、ライブ通販シナリオでホストが商品を編集・掲載し、視聴者が商品を閲覧・購入する流れを示しています。


アクセスの準備
ステップ1:サービスを利用する
ECライブ配信シーンでは、通常RTC Engine、美顔 AR、プレイヤー SDKなどの有料PaaSサービスを利用して構築します。このうち、RTC Engineはリアルタイム・オーディオ・ビデオインタラクション機能を提供し、美顔ARは美顔エフェクト機能を提供し、プレイヤーはライブ配信とオンデマンド再生機能を提供します。実際の業務ニーズに応じて、上記サービスを自由に選択して利用できます。
1. まず、RTC Engine コンソールにログインしてアプリケーションを作成する必要があります。必要に応じてRTC Engineアプリケーションバージョンをアップグレードできます。例えば、プロフェッショナル版ではより多くの付加価値機能サービスを利用できます。


説明:
テスト環境と本番環境に使用するアプリケーションをそれぞれ作成することをお勧めします。1年間に各Tencent Cloudアカウント(UIN)に毎月10,000分間の無料時間が提供されます。
RTC Engineの月額プランは体験版(デフォルト)、軽量版、標準版、プロフェッショナル版に分かれており、さまざまな付加価値機能サービスを利用できます。詳細はバージョン機能と月額プランの説明をご参照ください。
2. アプリケーションが作成された後、アプリケーション管理-アプリケーション概要セクションでそのアプリケーションの基本情報を確認できます。その中で、後で使用するためにSDKAppIDとSDKSecretKeyを大切に保管してください。同時に、キーの漏洩はトラフィックの不正利用に繋がりますのでご注意ください。


1. 美顔 AR コンソール > モバイル端末 Licenseにログインし、新しいテスト Licenseを作成をクリックします(テスト版Licenseは無料で14日間有効、1回更新可能、合計28日間)。モバイルを選択し、実際の必要に応じてAppName、Package Name、BundleIDを入力します。試用したい機能:全ての美顔機能、仮想背景、顔認識、ジェスチャー認識、ギフトアニメーション効果にチェックを入れ、そして確認をクリックします。


2. 有効化後、現在のページで情報を確認し、上記の統合ガイドを参照して統合できます。統合ガイドでLicense KeyとLicense URLの使用方法を確認できます。


1. Video on DemandコントロールパネルまたはCSSコントロールパネル→License管理→モバイル版Licenseにログインし、Licenseテスト新規作成をクリックします。


2. 必要に応じて
App Name、Package Name、Bundle IDを記入し、プレーヤー高級版を選択し、確定をクリックします。

3. テスト版Licenseが作成された後、生成されたLicenseの情報がページに表示されます。SDK初期化にLicense KeyとLicense URLの2つのパラメータを渡す必要があるため、下記の情報を大切に保管してください。


注意:
同じアプリケーションのLicense URLとKeyは唯一であり、テスト版Licenseが正式版にアップグレードされた後もLicense URLとKeyは変わりません。
ステップ2:SDKをインポートする
RTC Engine SDKと美顔 AR SDKはCocoaPodsライブラリに公開されており、CocoaPodsを通じて統合できます。
1. CocoaPodsのインストール。ターミナルウィンドウで以下のコマンドを入力してください(Macで事前にRuby環境をインストールする必要があります)。
sudo gem install cocoapods
2. Podfileを作成。プロジェクトのパスに移動し、以下のコマンドラインを入力すると、プロジェクトのパスにPodfileが表示されます。
pod init
3. Podfileを編集。プロジェクトのニーズに応じて適切なバージョンを選択し、Podfileファイルを編集してください。
platform :ios, '8.0'target 'App' do# フル機能版SDK# RTC Engine、ライブプレーヤー(TXLivePlayer)、RTMPプッシュ(TXLivePusher)、オンデマンドプレーヤー(TXVodPlayer)、ショートビデオ録画・編集(UGSV)など、多数の機能を含みます。pod 'TXLiteAVSDK_Professional', :podspec => 'https://liteav.sdk.qcloud.com/pod/liteavsdkspec/TXLiteAVSDK_Professional.podspec'# 美顔AR SDK 例:S1-07プランは以下の通りpod 'TencentEffect_S1-07'end
注意:
ECライブ配信シーンの実現には、通常、RTC Engine、プレイヤーなどの複数の機能の組み合わせが必要です。個別統合によるシンボル衝突の問題を避けるため、フル機能版SDKの統合をお勧めします。
4. SDKを更新してインストール
ターミナルウィンドウで以下のコマンドを入力して、ローカルレポジトリーファイルを更新し、SDKをインストールしま。
pod install
あるいは以下のコマンドを使用して、ローカルレポジトリーのバージョンを更新してください。
pod update
pod命令を実行した後、SDKが統合された.xcworkspaceの拡張子を持つプロジェクトファイルが生成され、ダブルクリックで開けます。
説明:
podの検索に失敗した場合、podのローカルrepoキャッシュを更新することをお勧めします。更新コマンドは以下の通りです。
pod setuppod repo updaterm ~/Library/Caches/CocoaPods/search_index.json
推奨される自動ロード方式に加えて、SDKをダウンロードして手動でインポートすることもできます。詳細はRTC Engine SDK の手動統合 と 美顔 AR SDKの手動統合 をご参照ください。
5. 実際のプロジェクトに顔加工リソースを追加する
5.1 対応するプランのSDKと顔加工リソースをダウンロードして解凍し、resources/motionResフォルダ内のbundleリソースを実際のプロジェクトに追加してください。
5.2 Build SettingsのOther Linker Flagsの中に
-ObjCを追加します。6. Bundle Identifierを申請されたテスト権限と一致させてください。
ステップ3:プロジェクトの設定
1. 権限設定
ライブコマースシナリオLiteAVSDKおよびTencent Effect SDKは、以下の権限が必要です。AppのInfo.plistに以下の2項目を追加してください。それぞれマイクとカメラがシステムの承認ダイアログをポップアップする際のプロンプト情報に対応しています。
Privacy - Microphone Usage Description、そしてマイク使用目的も入力してください。
Privacy - Camera Usage Description、そしてカメラ使用目的も入力してください。


2. バックグラウンドでApp関連機能を継続して実行する必要がある場合は、XCodeで現在のプロジェクトを選択し、Capabilitiesで設定項目Background ModesをONに設定し、Audio, AirPlay and Picture in Pictureにチェックを入れてください。以下の図に示されたように。


ステップ4:認証とライセンス
UserSigは、Tencent Cloudが設計したセキュリティ保護署名であり、悪意のある攻撃者によるクラウドサービスの使用権の盗用を防ぐことを目的としています。RTC Engineは入室時にこの認証資格情報を検証します。
デバッグフェーズ:クライアントサンプルコードとコントロールパネル取得の2つの方法でUserSigを計算生成でき、デバッグテストのみに使用します。
本番フェーズ:クライアントのリバースエンジニアリングによるキーの漏洩を防ぐため、より高いセキュリティレベルのサーバー側UserSig計算を推奨します。
具体的な実装の流れは以下の通りです。
1. AppがSDKの初期化関数を呼び出す前に、最初にサーバーにUserSigをリクエストします。
2. サーバーはSDKAppIDとUserIDに基づいてUserSigを計算します。
3. サーバーは計算されたUserSigをAppに返します。
4. Appは、特定のAPIを通じてSDKにUserSigを伝達します。
5. SDKがSDKAppID + UserID + UserSigをTencent Cloudのクラウドサーバーに提出して検証します。
6. Tencent CloudはUserSigを検証し、合法性を確認します。
7. 検証が完了すると、RTC Engine SDKにリアルタイム・オーディオ・ビデオサービスを提供します。


注意:
デバッグフェーズのローカルUserSig計算方式をオンライン環境に適用することは推奨しません。逆コンパイルによって容易に解読され、キーが漏洩する可能性があります。
複数の言語(Java/Go/PHP/Node.js/Python/C#/C++)のUserSigサーバーサイド計算のソースコードを提供しています。詳細はサーバーサイドUserSig計算を参照してください。
美顔 AR を使用する前に、Tencent Cloudにライセンス証明を検証する必要があります。Licenseを設定するには、License KeyとLicense URLが必要です。サンプルコードは以下の通りです。
[TELicenseCheck setTELicense:LicenseURL key:LicenseKey completion:^(NSInteger authresult, NSString * _Nonnull errorMsg) {if (authresult == TELicenseCheckOk) {NSLog(@"認証成功");} else {NSLog(@"認証失敗");}}];
注意:
関連業務モジュールの初期化コードで認証許可をトリガーすることをお勧めします。これにより、使用直前にLicenseをダウンロードすることを避けることができます。また、認証時にはネットワーク権限が必要です。
実際のアプリケーションのBundle IDは、License作成時にバインドされたBundle IDと完全に一致していなければならず、そうでない場合はLicenseの検証に失敗し、詳細は認証エラーコードを参照してください。
ライブ再生、オンデマンド再生機能はプレーヤーのLicense認証を設定した後にのみ再生成功でき、そうでない場合は再生に失敗し(黒い画面が表示されます)、グローバルで一度だけ設定すれば十分です。もしまだLicenseを取得していない場合は、正常に再生するために無料でテスト版Licenseを申し込むことができます。正式版Licenseは購入が必要です。License申請成功後、2つの文字列:License URLとLicense Keyを得られます。
アプリがSDK関連機能を呼び出す前に、
- [AppDelegate application:didFinishLaunchingWithOptions:]クラスで以下の設定をすることをお勧めします。- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {NSString * const licenceURL = @"<取得したlicenseUrl>";NSString * const licenceKey = @"<取得したkey>";// TXLiveBaseはヘッダーファイル"TXLiveBase.h"にあります。[TXLiveBase setLicence:licenceURL key:licenceKey];[TXLiveBase setObserver:self];NSLog(@"SDK Version = %@", [TXLiveBase getSDKVersionStr]);return YES;}#pragma mark - TXLiveBaseDelegate- (void)onLicenceLoaded:(int)result Reason:(NSString *)reason {NSLog(@"onLicenceLoaded: result:%d reason:%@", result, reason);// resultが0でない場合、設定に失敗したことを意味し、再試行が必要if (result != 0) {[TXLiveBase setLicence:licenceURL key:licenceKey];}}@end
License設定が成功した後(少し時間がかかります。具体的な時間はネットワークの状況によって異なります)、以下のメソッドでLicense情報を確認できます:
NSLog(@"%@", [TXLiveBase getLicenceInfo]);
注意:
実際のアプリケーションのBundle IDは、License作成時にバインドされたBundle IDと完全に一致していなければならず、そうでない場合はLicenseの検証に失敗します。
Licenseは強いオンライン検証のロジックであり、アプリが初めて起動した後にTXLiveBase#setLicenceを呼び出す際には、ネットワークが利用可能であることを確認する必要があります。アプリが初めて起動された時には、まだインターネットアクセスの権限が与えられていない可能性があるため、インターネットアクセスの権限が与えられた後に、再度TXLiveBase#setLicenceを呼び出す必要があります。
TXLiveBase#setLicenceの読み込み結果をリスニング:onLicenceLoadedインターフェース。失敗した場合は実際の状況に応じて対応するリトライやガイダンスを行い、何度か失敗した後には、頻度を制限し、業務を補助する製品ポップアップなどのガイダンスを用いて、ユーザーにネットワーク状況の確認を促します。
TXLiveBase#setLicenceは複数回呼び出すことができ、正常にロードされることを確認するため、アプリのメイン画面に入る際にTXLiveBase#setLicenceを呼び出すことをお勧めします。
マルチプロセスのアプリに対して、プレーヤーを使用したプロセスを起動する際には、必ずTXLiveBase#setLicenceを呼び出すようにしてください。例えば:Android端末で独立したプロセスでビデオを再生するアプリの場合、バックグラウンド再生時にプロセスがシステムによってkillされて再起動した時も、TXLiveBase#setLicenceを呼び出す必要があります。
ステップ5:SDKの初期化
// RTC Engine SDK インスタンスの作成(シングルトンパターン)self.trtcCloud = [TRTCCloud sharedInstance];// イベントリスナーを設定するself.trtcCloud.delegate = self;// SDKからの各種イベント通知(例:エラーコード、警告コード、オーディオ・ビデオの状態パラメータなど)- (void)onError:(TXLiteAVError)errCode errMsg:(nullable NSString *)errMsg extInfo:(nullable NSDictionary *)extInfo {NSLog(@"%d: %@", errCode, errMsg);}- (void)onWarning:(TXLiteAVWarning)warningCode warningMsg:(nullable NSString *)warningMsg extInfo:(nullable NSDictionary *)extInfo {NSLog(@"%d: %@", warningCode, warningMsg);}// イベントリスナーを削除self.trtcCloud.delegate = nil;// RTC Engine SDK インスタンスの破棄(シングルトンパターン)[TRTCCloud destroySharedIntance];
説明:
// 顔加工関連リソースを読み込むNSDictionary *assetsDict = @{@"core_name":@"LightCore.bundle",@"root_path":[[NSBundle mainBundle] bundlePath]};// Tencent Effect SDKの初期化self.beautyKit = [[XMagic alloc] initWithRenderSize:previewSize assetsDict:assetsDict];// Tencent Effect SDKをリリース[self.beautyKit deinit];
説明:
オンデマンド再生シナリオのSDK初期化。
// 1.SDKアクセス環境を設定// もしグローバルのユーザーがサービス対象の場合、SDKアクセス環境をグローバルアクセス環境に設定してください。[TXLiveBase setGlobalEnv:"GDPR"];// 2.Player作成TXVodPlayer *_txVodPlayer = [[TXVodPlayer alloc] init];// 3.レンダリングViewに関連付ける[_txVodPlayer setupVideoWidget:_myView insertIndex:0];// 4.プレーヤーパラメータの設定TXVodPlayConfig *_config = [[TXVodPlayConfig alloc]init];[_config setEnableAccurateSeek:true]; // 精密seekするか、デフォルトはtrue[_config setMaxCacheItems:5]; // キャッシュファイルの数を5に設定[_config setProgressInterval:200]; // 進行状況のコールバック間隔を設定、単位はミリ秒[_config setMaxBufferSize:50]; // 最大プリロードサイズ、単位はMB[_txVodPlayer setConfig:_config]; // configを_txVodPlayerに渡す// 5.プレーヤーイベントリスニング- (void)onPlayEvent:(TXVodPlayer *)player event:(int)EvtID withParam:(NSDictionary*)param {if (EvtID == PLAY_EVT_VOD_PLAY_PREPARED) {//プレーヤー準備完了のイベントを受信する際に、pause、resume、getWidth、getSupportedBitratesなどのインターフェースを使用可能} else if (EvtID == PLAY_EVT_PLAY_BEGIN) {// 開始再生イベントを受信} else if (EvtID == PLAY_EVT_PLAY_END) {// 開始終了イベントを受信}}
ライブ再生シナリオのSDK初期化。
// 1.Player作成V2TXLivePlayer *_txLivePlayer = [[V2TXLivePlayer alloc] init];// 2.レンダリングViewに関連付ける[_txLivePlayer setRenderView:_myView];// 3.プレーヤーイベントリスニング[_txLivePlayer setObserver:self];- (void)onVideoLoading:(id<V2TXLivePlayer>)player extraInfo:(NSDictionary *)extraInfo {// ビデオ読み込みイベント}- (void)onVideoPlaying:(id<V2TXLivePlayer>)player firstPlay:(BOOL)firstPlay extraInfo:(NSDictionary *)extraInfo {// ビデオ再生イベント}
アクセスの流れ
APIタイムライン図

ステップ1:アンカーが入室、プッシュを開始する
1. アンカーが入室する前に、ローカルビデオのプレビューとオーディオのキャプチャーを開始します。
// アンカーのローカル画面のプレビューを表示するためのビデオレンダリングコントロールを取得@property (nonatomic, strong) UIView *anchorPreviewView;@property (nonatomic, strong) TRTCCloud *trtcCloud;- (void)setupTRTC {self.trtcCloud = [TRTCCloud sharedInstance];self.trtcCloud.delegate = self;// ビデオエンコードのパラメータを設定し、リモートのユーザーが見る画面の品質を決定TRTCVideoEncParam *encParam = [[TRTCVideoEncParam alloc] init];encParam.videoResolution = TRTCVideoResolution_960_540;encParam.videoFps = 15;encParam.videoBitrate = 1300;encParam.resMode = TRTCVideoResolutionModePortrait;[self.trtcCloud setVideoEncoderParam:encParam];// ビデオキャプチャーには、isFrontCameraでフロント/アウトカメラを指定できます。[self.trtcCloud startLocalPreview:self.isFrontCamera view:self.anchorPreviewView];// ここでは音声品質を指定。低いから高い順:SPEECH/DEFAULT/MUSIC[self.trtcCloud startLocalAudio:TRTCAudioQualityDefault];}
注意:
業務のニーズに応じて、ビデオエンコーディングのパラメータTRTCVideoEncParamを自由に設定できます。各グレードの最適な解像度とビットレートの組み合わせの詳細は、解像度ビットレート参照表を参照してください。
enterRoomの前に、上記のインターフェースを呼び出すと、SDKはカメラのプレビューとオーディオのキャプチャーのみを開始し、enterRoomを呼び出した後にのみプッシュを開始します。enterRoomの後に、上記のインターフェースを呼び出すと、SDKはカメラのプレビューとオーディオのキャプチャーを開始し、自動的にプッシュを開始します。2. アンカーはローカル画面のレンダリングパラメータと、エンコーダー出力画面モード(任意項目)を設定します。
- (void)setupRenderParams {TRTCRenderParams *params = [[TRTCRenderParams alloc] init];// イメージモードparams.mirrorType = TRTCVideoMirrorTypeAuto;// フィルモードparams.fillMode = TRTCVideoFillMode_Fill;// 回転角度params.rotation = TRTCVideoRotation_0;// ローカル画面のレンダリングパラメータを設定[self.trtcCloud setLocalRenderParams:params];// エンコーダー出力のイメージモードを設定[self.trtcCloud setVideoEncoderMirror:YES];// ビデオエンコーダーの出力する画像の向きを設定[self.trtcCloud setVideoEncoderRotation:TRTCVideoRotation_0];}
注意:
ローカル画面のレンダリングパラメータの設定は、ローカル画面のレンダリング効果にのみ影響します。
エンコーダーの出力モードを設定すると、ルームの他のユーザーが見る(およびクラウドに録画されたファイルの)画面効果に影響します。
3. アンカーが正式にライブを開始し、入室しプッシュします。
- (void)enterRoomByAnchorWithUserId:(NSString *)userId roomId:(NSString *)roomId {TRTCParams *params = [[TRTCParams alloc] init];// 文字列のルーム番号を例にparams.strRoomId = roomId;params.userId = userId;// 業務バックエンドから取得したUserSigparams.userSig = @"userSig";// 自分のSDKAppIDに置き換えるparams.sdkAppId = 0;// アンカーロール指定params.role = TRTCRoleAnchor;// インタラクティブライブシナリオで入室[self.trtcCloud enterRoom:params appScene:TRTCAppSceneLIVE];}// 入室結果イベントコールバック- (void)onEnterRoom:(NSInteger)result {if (result > 0) {// resultは入室にかかった時間(ミリ秒)NSLog(@"Enter room succeed!");} else {// result入室失敗のエラーコードNSLog(@"Enter room failed!");}}
注意:
RTC Engineのルーム番号は整数型の
roomIdと文字列型のstrRoomIdに分かれており、2種類のルームは相互接続されません。ルーム番号のタイプを統一することをお勧めします。RTC Engineのユーザーロールは配信者と視聴者に分かれており、配信者のみがストリーミング権限を持ちます。入室時にはユーザーロールを指定する必要があり、指定がない場合はデフォルトで配信者ロールになります。
ライブコマースシナリオでは、入室モードは
TRTCAppSceneLIVEを選択することをお勧めします。ステップ2:視聴者が入室してプル
1. 視聴者がRTC Engine ルームに入室。
- (void)enterRoomByAudienceWithUserId:(NSString *)userId roomId:(NSString *)roomId {TRTCParams *params = [[TRTCParams alloc] init];// 文字列のルーム番号を例にparams.strRoomId = roomId;params.userId = userId;// 業務バックエンドから取得したUserSigparams.userSig = @"userSig";// 自分のSDKAppIDに置き換えるparams.sdkAppId = 0;// 指定視聴者ロールparams.role = TRTCRoleAudience;// インタラクティブライブシナリオで入室[self.trtcCloud enterRoom:params appScene:TRTCAppSceneLIVE];}// 入室結果イベントコールバック- (void)onEnterRoom:(NSInteger)result {if (result > 0) {// resultは入室にかかった時間(ミリ秒)NSLog(@"Enter room succeed!");} else {// result入室失敗のエラーコードNSLog(@"Enter room failed!");}}
2. 視聴者がアンカーのオーディオ・ビデオストリームを購読します。
- (void)onUserAudioAvailable:(NSString *)userId available:(BOOL)available {// リモートユーザーが自分のオーディオをパブリッシュ/キャンセル// 自動購読モードでは、何も操作する必要はありません。SDKはリモートユーザーのオーディオを自動的に再生します。}- (void)onUserVideoAvailable:(NSString *)userId available:(BOOL)available {// リモートユーザーがメインビデオ画面をパブリッシュ/キャンセルif (available) {// リモートユーザーのビデオストリームを購読し、ビデオレンダリングコントロールにバインド[self.trtcCloud startRemoteView:userId streamType:TRTCVideoStreamTypeBig view:self.remoteView];} else {// リモートユーザーのビデオストリームの購読を停止し、レンダリングコントロールをリリース[self.trtcCloud stopRemoteView:userId streamType:TRTCVideoStreamTypeBig];}}
3. 視聴者がリモート画面のレンダリングモードを設定します(任意項目)。
- (void)setupRemoteRenderParams {TRTCRenderParams *params = [[TRTCRenderParams alloc] init];// イメージモードparams.mirrorType = TRTCVideoMirrorTypeAuto;// フィルモードparams.fillMode = TRTCVideoFillMode_Fill;// 回転角度params.rotation = TRTCVideoRotation_0;// リモート画面のレンダリングモードを設定[self.trtcCloud setRemoteRenderParams:@"userId" streamType:TRTCVideoStreamTypeBig params:params];}
ステップ3:視聴者の交流インタラクション
1. 視聴者がアンカーロールに切り替わります。
- (void)switchToAnchor {// アンカーロールに切り替え[self.trtcCloud switchRole:TRTCRoleAnchor];}// ロール切り替えイベントコールバック- (void)onSwitchRole:(TXLiteAVError)errCode errMsg:(NSString *)errMsg {if (errCode == ERR_NULL) {// ロールの切り替えに成功}}
2. 視聴者がローカルのオーディオ・ビデオのキャプチャーおよびプッシュを開始します。
- (void)setupTRTC {// ビデオエンコードのパラメータを設定し、リモートのユーザーが見る画面の品質を決定TRTCVideoEncParam *encParam = [[TRTCVideoEncParam alloc] init];encParam.videoResolution = TRTCVideoResolution_480_270;encParam.videoFps = 15;encParam.videoBitrate = 550;encParam.resMode = TRTCVideoResolutionModePortrait;[self.trtcCloud setVideoEncoderParam:encParam];// ビデオキャプチャーには、isFrontCameraでフロント/アウトカメラを指定できます。[self.trtcCloud startLocalPreview:self.isFrontCamera view:self.audiencePreviewView];// ここでは音声品質を指定。低いから高い順:SPEECH/DEFAULT/MUSIC[self.trtcCloud startLocalAudio:TRTCAudioQualityDefault];}
注意:
業務のニーズに応じて、ビデオエンコーディングのパラメータTRTCVideoEncParamを自由に設定できます。各グレードの最適な解像度とビットレートの組み合わせの詳細は、解像度ビットレート参照表を参照してください。
3. 視聴者がマイクオフにし、プッシュを停止します。
- (void)switchToAudience {// 視聴者ロールに切り替える[self.trtcCloud switchRole:TRTCRoleAudience];}// ロール切り替えイベントコールバック- (void)onSwitchRole:(TXLiteAVError)errCode errMsg:(NSString *)errMsg {if (errCode == ERR_NULL) {// カメラのキャプチャーのパブリッシュを停止[self.trtcCloud stopLocalPreview];// マイクのキャプチャー及びパブリッシュを停止[self.trtcCloud stopLocalAudio];}}
ステップ4:ルームの退出および削除
1. ルームから退出。
- (void)exitRoom {[self.trtcCloud stopLocalAudio];[self.trtcCloud stopLocalPreview];[self.trtcCloud exitRoom];}// 退室イベントコールバック- (void)onExitRoom:(NSInteger)reason {if (reason == 0) {NSLog(@"exitRoomアクティブコールでルーム退出します");} else if (reason == 1) {NSLog(@"現在のルームからサーバーによってキックされました");} else if (reason == 2) {NSLog(@"現在のルームは解散されました");}}
注意:
SDKが使うすべてのリソースがリリースされた後、SDKは
onExitRoomコールバック通知をスローして知らせます。再度
enterRoomを呼び出す場合や他のオーディオ・ビデオSDKに切り替える場合は、onExitRoomコールバックが終わるまで関連操作を行わないでください。そうしないと、カメラやマイクが強制的に使用されるなど、さまざまな異常が発生する可能性があります。2. ルームを解散する
サーバー側のルーム解散
RTC Engineは、サーバー側で数字型ルーム解散API
DismissRoom と文字列型ルーム解散API DismissRoomByStrRoomId を提供しています。サーバー側のルーム解散インターフェースを呼び出すことで、ルーム内のすべてのユーザーをルームから退室させ、ルームを解散することができます。クライアントのルーム解散
クライアント側にはルームを直接解散するAPIがなく、各クライアントがexitRoomを呼び出してルームを退室する必要があります。ルーム内のすべての配信者と視聴者が退室すると、RTC Engineのルームライフサイクルルールに従ってルームは自動的に解散されます。詳細はRTC Engine ルーム退室をご参照ください。
注意:
ライブ配信が終了した後、サーバー側でAPIを呼び出してルームを確実に解散することをお勧めします。一部のユーザーが予定通りに退室しないことによってルームが存続し、予期しない費用が発生するのを防げます。
詳細設定
商品情報ポップアップ
カスタムメッセージ
カスタムメッセージはTencent CloudのChatの機能に依存しています。事前にサービスを有効化し、Chat SDKをインポートする必要があります。詳細な手順については音声チャットルーム導入ガイド-導入準備をご参照ください。
1. カスタムメッセージの送信
方法1:配信者がクライアントから商品ポップアップに関連するグループカスタムメッセージを送信します。
// 商品ポップアップメッセージのボディーNSDictionary *msgDict = @{@"itemNumber": @1, // 商品番号@"itemPrice": @199.0, // 商品価格@"itemTitle": @"xxx", // 商品タイトル@"itemUrl": @"xxx" // 商品画像URL};NSDictionary *dataDict = @{@"cmd": @"item_popup_msg",@"msg": msgDict};NSError *error;NSData *data = [NSJSONSerialization dataWithJSONObject:dataDict options:0 error:&error];// グループカスタムメッセージを送信(「商品ポップアップ」メッセージは高優先度に設定することをお勧めします)[[V2TIMManager sharedInstance] sendGroupCustomMessage:data to:groupID priority:V2TIM_PRIORITY_HIGH succ:^{// 商品ポップアップメッセージの送信に成功// ローカルでの「商品ポップアップ」エフェクトのレンダリング} fail:^(int code, NSString *desc) {// 商品ポップアップメッセージの送信に失敗}];
方法2:バックエンドの運営がサーバーから商品ポップアップに関連するグループカスタムメッセージを送信します。
リクエストURLサンプル:
https://xxxxxx/v4/group_open_http_svc/send_group_msg?sdkappid=88888888&identifier=admin&usersig=xxx&random=99999999&contenttype=json
リクエストボディサンプル:
{"GroupId": "@TGS#12DEVUDHQ","Random": 2784275388,"MsgPriority": "High", // メッセージの優先度、商品ポップアップメッセージは高優先度設定を推奨"MsgBody": [{"MsgType": "TIMCustomElem","MsgContent": {// itemNumber: 商品番号; itemPrice: 商品価格; itemTitel: 商品タイトル; itemUrl: 商品画像URL"Data": "{\"cmd\": \"item_popup_msg\", \"msg\": {\"itemNumber\": 1, \"itemPrice\": 199.0, \"itemTitle\": \"xxx\", \"itemUrl\": \"xxx\"}}"}}]}
2. カスタムメッセージの受信
ルーム内の他のユーザークライアントがグループカスタムメッセージのコールバックを受信し、メッセージを解析して商品ポップアップエフェクトをレンダリングします。
// グループカスタムメッセージを受信[[V2TIMManager sharedInstance] addSimpleMsgListener:self];- (void)onRecvGroupCustomMessage:(NSString *)msgID groupID:(NSString *)groupID sender:(V2TIMGroupMemberInfo *)info customData:(NSData *)data {if (data.length > 0) {NSError *error;NSDictionary *dataDict = [NSJSONSerialization JSONObjectWithData:data options:0 error:&error];if (!error) {NSString *command = dataDict[@"cmd"];NSDictionary *msgDict = dataDict[@"msg"];if ([command isEqualToString:@"item_popup_msg"]) {NSNumber *itemNumber = msgDict[@"itemNumber"]; // 商品番号NSNumber *itemPrice = msgDict[@"itemPrice"]; // 商品価格NSString *itemTitle = msgDict[@"itemTitle"]; // 商品タイトルNSString *itemUrl = msgDict[@"itemUrl"]; // 商品画像URL// 商品番号、商品価格、商品タイトル、商品画像URLに基づいて、商品ポップアップ効果をレンダリング}} else {NSLog(@"解析エラー:%@", error.localizedDescription);}}}
SEI情報
SEI情報は配信者のビデオストリームに挿入されて伝送され、商品情報のポップアップとホストのライブ画面を正確に同期させることができます。
1. SEI情報の送信。配信者がRTC Engineクライアントで商品ポップアップ関連のSEIメッセージを送信します。
// 商品ポップアップメッセージのボディーNSDictionary *msgDict = @{@"itemNumber": @1, // 商品番号@"itemPrice": @199.0, // 商品価格@"itemTitle": @"xxx", // 商品タイトル@"itemUrl": @"xxx" // 商品画像URL};NSDictionary *dataDict = @{@"cmd": @"item_popup_msg",@"msg": msgDict};NSError *error;NSData *data = [NSJSONSerialization dataWithJSONObject:dataDict options:0 error:&error];// SEI情報の送信[self.trtcCloud sendSEIMsg:data repeatCount:1];
2. SEI情報の受信
視聴者がRTC EngineクライアントでSEIメッセージを受信し、メッセージを解析して商品ポップアップ効果をレンダリングします。
// TRTCイベントリスナーを設定するself.trtcCloud.delegate = self;// SEIメッセージを受信- (void)onRecvSEIMsg:(NSString *)userId message:(NSData *)message {if (message.length > 0) {NSError *error;NSDictionary *dataDict = [NSJSONSerialization JSONObjectWithData:message options:0 error:&error];if (!error) {NSString *command = dataDict[@"cmd"];NSDictionary *msgDict = dataDict[@"msg"];if ([command isEqualToString:@"item_popup_msg"]) {NSNumber *itemNumber = msgDict[@"itemNumber"]; // 商品番号NSNumber *itemPrice = msgDict[@"itemPrice"]; // 商品価格NSString *itemTitle = msgDict[@"itemTitle"]; // 商品タイトルNSString *itemUrl = msgDict[@"itemUrl"]; // 商品画像URL// 商品番号、商品価格、商品タイトル、商品画像URLに基づいて、商品ポップアップ効果をレンダリング}} else {NSLog(@"解析エラー:%@", error.localizedDescription);}}}
商品説明のリプレイ
事前に録画された商品説明動画を再生することで、商品説明のリプレイ機能を実現します。
// URLビデオリソースを再生NSString* url = @"http://1252463788.vod2.myqcloud.com/xxxxx/v.f20.mp4";[_txVodPlayer startVodPlay:url];// ローカルのサンドボックスビデオリソースを再生// Documentsのパスを取得NSString *documentPath = [NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES) firstObject];// ローカルビデオのパスを取得NSString *videoPath = [NSString stringWithFormat:@"%@/video1.m3u8",documentPath];[_txVodPlayer startVodPlay:videoPath];
TXPlayerAuthParams *p = [TXPlayerAuthParams new];p.appId = 1252463788;p.fileId = @"4564972819220421305";// psign、つまりプレーヤーの署名、署名の紹介と生成方法はリンクを参照してください:https://cloud.tencent.com/document/product/266/42436p.sign = @"psignxxxxx"; // プレーヤーの署名[_txVodPlayer startVodPlayWithParams:p];
再生制御:プログレス調整、一時停止、再生再開、再生終了。
// プログレス調整(秒)[_txVodPlayer seek:time];// 一時停止[_txVodPlayer pause];// 再生再開[_txVodPlayer resume];// 再生終了[_txVodPlayer stopPlay];
注意:
モリリークや画面のちらつきが発生するため、再生を終了する際、現在のUI画面を閉じる場合は、
removeVideoWidgetでviewコントロールを破棄することを忘れないでください。// viewコントロールを破棄[_txVodPlayer removeVideoWidget];
クロスルームPK
1. 任意の一方がクロスルームPKを発起します。
- (void)connectOtherRoom:(NSString *)roomId {NSMutableDictionary *jsonDict = [[NSMutableDictionary alloc] init];// 数字のルーム番号はroomIdです。[jsonDict setObject:roomId forKey:@"strRoomId"];[jsonDict setObject:self.userId forKey:@"userId"];NSData *jsonData = [NSJSONSerialization dataWithJSONObject:jsonDict options:NSJSONWritingPrettyPrinted error:nil];NSString *jsonString = [[NSString alloc] initWithData:jsonData encoding:NSUTF8StringEncoding];[self.trtcCloud connectOtherRoom:jsonString];}// クロスルームPKのレスポンスコールバック- (void)onConnectOtherRoom:(NSString *)userId errCode:(TXLiteAVError)errCode errMsg:(NSString *)errMsg {// クロスルームアンカーと交流したいユーザーID// エラーコード、ERR_NULLはリクエスト成功// エラーメッセージ}
注意:
クロスルームPKのローカルユーザーとリモートユーザーは両方とも配信者ロールでなければならず、両方ともオーディオ・ビデオのアップストリームが必要です。
ConnectOtherRoom()を数回呼び出すことで、複数のルームのアンカーとクロスルームPKを実現できます。現在、1つのルームは最大で他の3つのルームのアンカーとクロスルーム交流が可能で、1つのルームには最大で10人のアンカーが他のルームのアンカーとクロスルーム交流できます。2. 二つのルームの全てのユーザーは、もう一つのルームからのPKアンカーのオーディオ・ビデオストリームの利用可能コールバックを受け取ります。
- (void)onUserAudioAvailable:(NSString *)userId available:(BOOL)available {// リモートユーザーが自分のオーディオをパブリッシュ/キャンセル// 自動購読モードでは、何も操作する必要はありません。SDKはリモートユーザーのオーディオを自動的に再生します。}- (void)onUserVideoAvailable:(NSString *)userId available:(BOOL)available {// リモートユーザーがメインビデオ画面をパブリッシュ/キャンセルif (available) {// リモートユーザーのビデオストリームを購読し、ビデオレンダリングコントロールにバインド[self.trtcCloud startRemoteView:userId streamType:TRTCVideoStreamTypeBig view:self.remoteView];} else {// リモートユーザーのビデオストリームの購読を停止し、レンダリングコントロールをリリース[self.trtcCloud stopRemoteView:userId streamType:TRTCVideoStreamTypeBig];}}
3. 任意の一方がクロスルームPKを退出します。
// クロスルームPKからの退出[self.trtcCloud disconnectOtherRoom];// クロスルームPKの退出結果コールバック- (void)onDisconnectOtherRoom:(TXLiteAVError)errCode errMsg:(NSString *)errMsg {}
注意:
DisconnectOtherRoom()を呼び出した後、他のすべてのルームのアンカーとのクロスルームPKを退出します。クロスルームPKの発起側と受信側のどちらでも
DisconnectOtherRoom()でクロスルームPKを退出することができます。サードパーティー顔加工アクセス
RTC Engineはサードパーティ製の美顔エフェクト製品の導入をサポートしており、以下では美顔ARを例に、サードパーティ製美顔の導入プロセスを説明します。
1. 美顔AR SDKの統合、License認証の申請については、詳細は導入準備手順を参照して実装してください。
2. SDK素材リソースパスを設定します(存在する場合)。
NSString *beautyConfigPath = [NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES) lastObject];beautyConfigPath = [beautyConfigPath stringByAppendingPathComponent:@"beauty_config.json"];NSFileManager *localFileManager=[[NSFileManager alloc] init];BOOL isDir = YES;NSDictionary * beautyConfigJson = @{};if ([localFileManager fileExistsAtPath:beautyConfigPath isDirectory:&isDir] && !isDir) {NSString *beautyConfigJsonStr = [NSString stringWithContentsOfFile:beautyConfigPath encoding:NSUTF8StringEncoding error:nil];NSError *jsonError;NSData *objectData = [beautyConfigJsonStr dataUsingEncoding:NSUTF8StringEncoding];beautyConfigJson = [NSJSONSerialization JSONObjectWithData:objectDataoptions:NSJSONReadingMutableContainerserror:&jsonError];}NSDictionary *assetsDict = @{@"core_name":@"LightCore.bundle",@"root_path":[[NSBundle mainBundle] bundlePath],@"tnn_"@"beauty_config":beautyConfigJson};// SDKの初期化:widthとheightはそれぞれtextureの幅と高さself.xMagicKit = [[XMagic alloc] initWithRenderSize:CGSizeMake(width,height) assetsDict:assetsDict];
3. サードパーティ製美顔のビデオデータコールバックを設定し、美顔SDKが処理した各フレームのデータ結果をRTC Engine SDK内部に渡してレンダリング処理を行います。
// RTC Engine SDK がサードパーティ製美顔のビデオデータコールバックを設定します[self.trtcCloud setLocalVideoProcessDelegete:self pixelFormat:TRTCVideoPixelFormat_Texture_2D bufferType:TRTCVideoBufferType_Texture];#pragma mark - TRTCVideoFrameDelegate// YTProcessInputを作成しSDKに渡してレンダリング処理を実行- (uint32_t)onProcessVideoFrame:(TRTCVideoFrame *_Nonnull)srcFrame dstFrame:(TRTCVideoFrame *_Nonnull)dstFrame {if (!self.xMagicKit) {[self buildBeautySDK:srcFrame.width and:srcFrame.height texture:srcFrame.textureId];// XMagic SDKを初期化self.heightF = srcFrame.height;self.widthF = srcFrame.width;}if(self.xMagicKit!=nil && (self.heightF!=srcFrame.height || self.widthF!=srcFrame.width)){self.heightF = srcFrame.height;self.widthF = srcFrame.width;[self.xMagicKit setRenderSize:CGSizeMake(srcFrame.width, srcFrame.height)];}YTProcessInput *input = [[YTProcessInput alloc] init];input.textureData = [[YTTextureData alloc] init];input.textureData.texture = srcFrame.textureId;input.textureData.textureWidth = srcFrame.width;input.textureData.textureHeight = srcFrame.height;input.dataType = kYTTextureData;YTProcessOutput *output = [self.xMagicKit process:input withOrigin:YtLightImageOriginTopLeft withOrientation:YtLightCameraRotation0];dstFrame.textureId = output.textureData.texture;return 0;}
注意:
ステップ1とステップ2は、異なるサードパーティ製美顔製品によって実装方法が異なりますが、ステップ3はRTC Engineがサードパーティ製美顔を統合するための汎用的かつ重要なステップです。
2-wayエンコードモード
2-wayエンコードモードを有効にすると、現在ユーザーのエンコーダーは、「HD大画面」と「SD小画面」の2つのビデオストリームを同時に出力します(ただし、オーディオストリームは1つだけです)。これにより、ルームの他のユーザーは、自分のネットワーク状況や画面のサイズに応じて、「HD大画面」または「SD小画面」を選択して購読できます。
1. 大小画面の2-wayエンコードモードを有効にします。
- (void)enableDualStreamMode:(BOOL)enable {// 小画面のビデオエンコードパラメータ(カスタマイズ可能)TRTCVideoEncParam *smallVideoEncParam = [[TRTCVideoEncParam alloc] init];smallVideoEncParam.videoResolution = TRTCVideoResolution_480_270;smallVideoEncParam.videoFps = 15;smallVideoEncParam.videoBitrate = 550;smallVideoEncParam.resMode = TRTCVideoResolutionModePortrait;[self.trtcCloud enableEncSmallVideoStream:enable withQuality:smallVideoEncParam];}
注意:
2-wayエンコードを開始すると、より多くのCPUとネットワーク帯域幅を消費するため、Mac、Windowsまたは高パフォーマンスのPadでの使用を検討できますが、携帯端末での使用はお勧めしません。
2. リモートユーザーのビデオストリームのプルタイプを選択します。
// リモートユーザーのビデオストリームを購読する際にストリームタイプが選択可能[self.trtcCloud startRemoteView:userId streamType:TRTCVideoStreamTypeBig view:view];// 指定されたリモートユーザーの大画面と小画面をいつでも切り替え可能[self.trtcCloud setRemoteVideoStreamType:userId type:TRTCVideoStreamTypeSmall];
注意:
2-wayエンコードを有効にした後、指定されたビデオストリームタイプ
streamTypeをTRTCVideoStreamTypeSmallに設定することで、低解像度の小画面で視聴することができます。ビューレンダリングコントロール
業務に表示領域の切り替えに関するインタラクティブなシーンが含まれる場合、RTC Engine SDKを使用してローカルプレビュー画面を更新したり、リモートユーザーのビデオレンダリングコントロール機能を実装したりできます。
// ローカルプレビュー画面のレンダリングコントロールを更新[self.trtcCloud updateLocalView:view];// リモートユーザーのビデオレンダリングコントロールを更新[self.trtcCloud updateRemoteView:view streamType:TRTCVideoStreamTypeBig forUser:userId];
注意:
パラメーター
viewにターゲットビデオレンダリングコントロールを渡します。streamTypeはTRTCVideoStreamTypeBigとTRTCVideoStreamTypeSubのみに対応します。例外処理
異常エラー処理
1. UserSig関係。
列挙値 | 取得値 | 説明 |
ERR_TRTC_INVALID_USER_SIG | -3320 | 入室パラメータuserSigが正しくありません。 TRTCParams.userSigが空であるかどうかを確認してください。 |
ERR_TRTC_USER_SIG_CHECK_FAILED | -100018 | UserSig検証失敗、パラメータ TRTCParams.userSigが正しく入力されているか、または期限切れでないかを確認してください。 |
2. 入退室関係
入室に失敗した場合は、まず入室パラメータが正しいかどうかを確認してください。また、入退室インターフェースは必ずペアで呼び出す必要があります。入室に失敗した場合でも、退室インターフェースを呼び出す必要があります。
列挙値 | 取得値 | 説明 |
ERR_TRTC_CONNECT_SERVER_TIMEOUT | -3308 | 入室リクエストがタイムアウトしました。ネットワークが切断されているか、VPNが使用されているかを確認してください。また、4Gに切り替えてテストすることもできます。 |
ERR_TRTC_INVALID_SDK_APPID | -3317 | 入室パラメータsdkAppIdエラー。 TRTCParams.sdkAppIdが空であるかどうか確認してください。 |
ERR_TRTC_INVALID_ROOM_ID | -3318 | 入室パラメータroomIdエラー。 TRTCParams.roomIdまたはTRTCParams.strRoomIdが空であるかどうか確認してください。roomIdとstrRoomIdは混在できません。 |
ERR_TRTC_INVALID_USER_ID | -3319 | 入室パラメータuserIdが正しくありません。 TRTCParams.userIdが空であるかどうかを確認してください。 |
ERR_TRTC_ENTER_ROOM_REFUSED | -3340 | 入室リクエストが拒否されました。 enterRoomで同じIdのルームに連続して入室しようとしていないか確認してください。 |
3. デバイス関係
デバイス関連のエラーをリスニングし、関連するエラーが発生した場合にUIでユーザーに通知します。
列挙値 | 取得値 | 説明 |
ERR_CAMERA_START_FAIL | -1301 | カメラの起動に失敗しました。例えば、WindowsまたはMacデバイスで、カメラの設定プログラム(ドライバー)に異常があります。デバイスを無効にしてから再度有効にするか、マシンを再起動するか、または設定プログラムを更新してください。 |
ERR_MIC_START_FAIL | -1302 | マイクの起動に失敗しました。例えば、WindowsまたはMacデバイスで、マイクの設定プログラム(ドライバー)に異常があります。デバイスを無効にしてから再度有効にするか、マシンを再起動するか、設定プログラムを更新してください。 |
ERR_CAMERA_NOT_AUTHORIZED | -1314 | カメラが許可されていません。これは通常、モバイルデバイスで発生し、ユーザーによって権限が拒否された可能性があります。 |
ERR_MIC_NOT_AUTHORIZED | -1317 | マイクが許可されていません。これは通常、モバイルデバイスで発生し、ユーザーによって権限が拒否された可能性があります。 |
ERR_CAMERA_OCCUPY | -1316 | カメラが使用中です。他のカメラを試してみてください。 |
ERR_MIC_OCCUPY | -1319 | マイクが使用中です。たとえば、モバイルデバイスが通話中の場合、マイクを開くと失敗します。 |
リモートイメージモードが無効の場合
RTC Engine 設定画面ミラーリングは、ローカルプレビューミラーリング
setLocalRenderParams とビデオエンコーダーミラーリングsetVideoEncoderMirrorに分かれており、それぞれローカルプレビュー画面のミラーリング効果と、ビデオエンコード出力画面のミラーリング効果(リモート視聴者およびクラウド録画のミラーリングモード)に影響します。ローカルプレビューのイメージエフェクトをリモートの視聴者側で同時に有効にしたい場合は、以下の方法でエンコードしてください。// ローカル画面のレンダリングパラメータを設定TRTCRenderParams *params = [[TRTCRenderParams alloc] init];params.mirrorType = TRTCVideoMirrorTypeEnable; // イメージモードparams.fillMode = TRTCVideoFillMode_Fill; // フィルモードparams.rotation = TRTCVideoRotation_0; // 回転角度[self.trtcCloud setLocalRenderParams:params];// エンコーダー出力のイメージモードを設定[self.trtcCloud setVideoEncoderMirror:YES];
カメラのズーム/フォーカス/切り替えの問題
ECライブ配信シーンでは、配信者がカメラに対してカスタマイズ調整のニーズを持つ場合があり、RTC Engine SDKのデバイス管理クラスにはこのようなニーズに対応する関連インターフェースも用意されています。
1. カメラのズーム倍率を照会および設定します。
// カメラの最大ズーム倍率を取得する(モバイル端末のみ適用)CGFloat zoomRatio = [[self.trtcCloud getDeviceManager] getCameraZoomMaxRatio];// カメラのズーム倍率を設定する(モバイル端末のみ適用)// 値の範囲1~5、1が最も遠い(通常のカメラ)、5が最も近い(拡大鏡)。推奨最大値は5、5を超えるとビデオデータがぼやけてしまう[[self.trtcCloud getDeviceManager] setCameraZoomRatio:zoomRatio];
2. カメラのフォーカス機能と位置を設定します。
// カメラのオートフォーカス機能をオンまたはオフ(モバイル端末のみ適用)[[self.trtcCloud getDeviceManager] enableCameraAutoFocus:NO];// カメラのフォーカス位置を設定(モバイル端末のみ適用)// このインターフェースを使用する前提条件は、まずenableCameraAutoFocusでオートフォーカス機能をオフにすることです。[[self.trtcCloud getDeviceManager] setCameraFocusPosition:CGPointMake(x, y)];
3. 判断し、インカメラまたはアウトカメラを切り替えます。
// 現在がインカメラかどうかを判断(モバイル端末のみ適用)BOOL isFrontCamera = [[self.trtcCloud getDeviceManager] isFrontCamera];// インカメラとアウトカメラを切り替え(モバイル端末のみ適用)// true: に渡すインカメラに。に渡すfalse: アウトカメラに[[self.trtcCloud getDeviceManager] switchCamera:!isFrontCamera];