RTC Engine
  • Overview
  • Web
    • Demo のクイックスタート
    • SDK クイックスタート
    • 基本機能
      • 画面共有
      • ライブブロードキャスト
      • メディアデバイス
      • 音量
      • エンコーディング構成ファイルの設定
      • ネットワーク品質の検出
      • 検出能力
    • 高度な機能
      • AI ノイズ低減の有効化
      • ミキシングを有効にします
      • ウォーターマークを有効にします
      • Enable Virtual Background
      • 美顔とエフェクトの有効化
      • データメッセージ
      • キャプチャーとレンタリングのカスタマイズ
    • インターフェースリスト
    • リリース説明
    • 対応するプラットホーム
    • Web に関するよくあるご質問
      • 複数人でのビデオ通話を最適化
      • 制限付き自動再生の処理
      • ファイアウォール制限への対応
      • その他
  • Android
    • Run Sample Code
    • Integration
    • インテグレーション
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. ビデオ品質の設定
      • 10. ビデオの回転
    • Advanced Features
      • ネットワーク品質のテスト
      • キャプチャーとレンタリングのカスタマイズ
      • オーディオキャプチャーと再生のカスタマイズ
    • 顧客インターフェース
      • Overview
      • TRTCCloud
      • TRTCStatistics
      • TRTCCloudListener
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • タイプ定義
      • 廃棄インタフェース
      • エラーコード
    • ソリューション
      • リアルタイムコーラス (TUIKaraoke)
        • クイックインテグレーション
        • 実施ステップ
        • 曲の同期
        • 歌詞の同期
        • 音声同期
        • ミクスストリーミングソリューション
        • TRTCKaraoke 関連インターフェース
        • よくあるご質問
    • リリース説明
  • iOS
    • Run Sample Code
    • Integration
    • インテグレーション
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. ビデオ品質の設定
      • 10. ビデオの回転
    • Advanced Features
      • ネットワーク品質のテスト
      • キャプチャーとレンタリングのカスタマイズ
      • オーディオキャプチャーと再生のカスタマイズ
    • 顧客インターフェース
      • Overview
      • TRTCCloud
      • TRTCCloudDelegate
      • TRTCStatistics
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • タイプ定義
      • 廃棄インタフェース
      • ErrorCode
    • ソリューション
      • クイックインテグレーション
      • 実施ステップ
      • 曲の同期
      • 歌詞の同期
      • 音声同期
      • ミクスストリーミングソリューション
      • TRTCKaraoke 関連インターフェース
      • よくあるご質問
    • リリース説明
  • macOS
    • Run Sample Code
    • Integration
    • インテグレーション
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. パソコンサウンドの共有
      • 10. ビデオ品質の設定
      • 11. ビデオの回転
    • Advanced Features
      • ハードウェアデバイスのテスト
      • ネットワーク品質のテスト
      • キャプチャーとレンタリングのカスタマイズ
      • オーディオキャプチャーと再生のカスタマイズ
    • 顧客インターフェース
      • Overview
      • TRTCCloud
      • TRTCCloudDelegate
      • TRTCStatistics
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • タイプ定義
      • 廃棄インタフェース
      • ErrorCode
      • リリース説明
    • リリース説明
  • Windows
    • Run Sample Code
    • Integration
    • インテグレーション
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. ビデオ品質の設定
      • 10. ビデオの回転
    • Advanced Features
      • ハードウェアデバイスのテスト
      • ネットワーク品質のテスト
      • キャプチャーとレンタリングのカスタマイズ
      • オーディオキャプチャーと再生のカスタマイズ
    • 顧客インターフェース
      • Overview
      • ITRTCCloud
      • ITRTCStatistics
      • TRTCCloudCallback
      • ITXAudioEffectManager
      • ITXDeviceManager
      • タイプ定義
      • 廃棄インタフェース
      • エラーコード
    • リリース説明
  • Electron
    • インテグレーション
      • 1. インターフェースの例
      • 2. SDK のインポート
      • 3. ルームに入る
      • 4. オーディオ・ビデオストリームのサブスクリプション
      • 5. オーディオ・ビデオストリームのリリース
      • 6. ルームからの退出
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. パソコンサウンドの共有
      • 10. ビデオ品質の設定
      • 11. ビデオの回転
    • 顧客インターフェース
      • Overview
      • エラーコード
  • Flutter
    • インテグレーション
      • 1. インターフェースの例
      • 2. SDK のインポート
      • 3. ルームに入る
      • 4. オーディオ・ビデオストリームのサブスクリプション
      • 5. オーディオ・ビデオストリームのリリース
      • 6. ルームからの退出
      • 7. ネットワーク品質の検出
      • 8. 画面共有の有効化
      • 9. パソコンサウンドの共有
      • 10. ビデオ品質の設定
      • 11. ビデオの回転
    • 顧客インターフェース
      • Overview
      • エラーコード
  • Unity
    • インテグレーション
      • 1. インターフェースの例
      • 2. SDK のインポート
    • 顧客インターフェース
      • Overview
      • エラーコード
  • QT
    • インテグレーション
      • 1. SDK のインポート
  • Overview
    • Overview
  • 概念
  • Features
  • 性能統計
  • 価格
    • 無料時間
    • RTC-Engine パッケージ
    • サブスクリプションパッケージ期間の課金説明
    • 従量課金
      • 音声・ビデオ時間の課金説明
      • クラウド録画の課金説明
      • ミックストランスコーディングとCDNへのリレーの課金説明
  • よくあるご質問
    • 初心者のよくあるご質問
    • マイグレーションガイド
      • Twilio Video から TRTC への移行
      • 課金
      • Features
      • UserSig
      • ファイアウォール制限
      • インストールパッケージを削減する方法
      • TRTCCalling Web 関連
      • オーディオ・ビデオの品質
      • その他
RTC Engine
このページは現在英語版のみで提供されており、日本語版も近日中に提供される予定です。ご利用いただきありがとうございます。

Twilio Video から TRTC への移行

Overview

Welcome to our comprehensive guide designed to assist developers in migrating from Twilio Video to Tencent RTC (TRTC) on the Web platform. This document provides a detailed comparison at the API level between Twilio and TRTC, and outlines each step required to implement basic RTC video functionality.
For those planning to develop a new application, you can directly visit the Tencent RTC website and documentation for all the necessary resources and information.

Create a TRTC Application

Create a new application of Tencent RTC (TRTC), then you can get the following necessary information for the authentication of TRTC service.

SDKAppID

SDKAppID is used to uniquely identify a TRTC application. It is generated automatically when an application is created.

SDKSecretKey

SDKSecretKey is one of the key parameters to be used to generate the security signature. The generated signature ensures the access of TRTC service when calling the initialization and login API of the SDK.

Install and Set Up the SDK

By npm

1. Use npm to install trtc-sdk-v5 package in your project.
npm install trtc-sdk-v5 --save
2. Import the module in the project script.
import TRTC from 'trtc-sdk-v5';

By script

Download SDK file trtc.js from Github and add the following code to your webpage:
<script src="trtc.js"></script>

Join a Room

Twilio
// Replace Twilio Video import import * as TwilioVideo from 'twilio-video' var twilioVideo = TwilioVideo var twilioRoom twilioRoom = await twilioVideo.connect(TOKEN, { name: 'yourName', audio: false, video: false, dominantSpeaker: true
TRTC
const trtc = TRTC.create(); try { await trtc.enterRoom({ roomId: 8888, scene:'rtc', sdkAppId, userId, userSig }); console.log('Entered the room successfully'); } catch (error) { console.error('Failed to enter the room ' + error); }

Publish Local Video/Audio

Twilio
// video let localVideoTrack = await twilioVideo.createLocalVideoTrack({ height: { ideal: 720, min: 480, max: 1080 }, width: { ideal: 1280, min: 640, max: 1920 }, aspectRatio: 16/9, }) twilioRoom.localParticipant.publishTrack(localVideoTrack) const localMediaContainer = document.getElementById('video-container-div') localMediaContainer!.appendChild(localVideoTrack.attach()) // audio let localAudioTrack = await twilioVideo.createLocalAudioTrack() twilioRoom.localParticipant.publishTrack(localAudioTrack); const audioElement = localAudioTrack.attach(); document.body.appendChild(audioElement);
TRTC
const view = document.getElementById('localVideo'); const cameraList = await TRTC.getCameraList(); if (cameraList[0]) { await trtc.startLocalVideo({ view, option: { cameraId: cameraList[0].deviceId, } }); } // To preview the camera image, you need to place an HTMLElement in the DOM, which can be a div tag, assuming its id is local-video. const view = 'local-video'; await trtc.startLocalVideo({ view }); await trtc.startLocalAudio();

Subscribe Remote Video/Audio

Twilio
twilioRoom.on('participantConnected', (participant) => { participant.on('trackSubscribed', (track) => { // a user turned on their video, render it document.getElementById('remote-video-container-div').appendChild(track.attach()); }); participant.on('trackUnsubscribed', (track) => { // a user turned off their video, stop rendering it var selfTwilioVideo = document.getElementById('remote-video-container-div') selfTwilioVideo.querySelector('video').remove() }) })
TRTC
// Listen for the TRTC.EVENT.REMOTE_VIDEO_AVAILABLE event before entering the room to receive all remote user video publishing events. trtc.on(TRTC.EVENT.REMOTE_VIDEO_AVAILABLE, ({ userId, streamType }) => { // To play the video image, you need to place an HTMLElement in the DOM, which can be a div tag, assuming its id is `${userId}_${streamType}` const view = `${userId}_${streamType}`; trtc.startRemoteVideo({ userId, streamType, view }); });

Leave a Room

Twilio
twilioVideo.disconnect()
TRTC
await trtc.exitRoom(); // After the exit is successful, if you do not need to use the trtc instance later, you can call the trtc.destroy method to destroy the instance and release related resources in a timely manner. The destroyed trtc instance cannot be used again and a new instance needs to be created. trtc.destroy();

Conclusion

Compared to Twilio Video, this migration guide outlines how to use Tencent RTC (TRTC) to build a basic video RTC experience for the Android platform. The API level "mapping" for each step in this guide will facilitate the developers to switch from Twilio Video to TRTC in a quick and straightforward way.
TRTC has more feature sets that can help developers implement cost-effective, low-latency and high-quality interactive audio/video services. For comprehensive details on TRTC features and the implementation specification, please refer to the Tencent RTC website. If you require developer support or any further assistance regarding the TRTC integration, feel free to contact us, or you can join our Discord and Telegram. We will ensure a smooth integration and address any queries you may have.