REACT ROOM の機能
アプリのためのルーム
ルームのライフサイクル
- ルームの作成と参加
- 退出と終了の処理
ライブでの会話
- 参加者ビデオを連携
- カメラとマイクを操作
参加者の体験
- ルームメンバーを表示
- ルーム状態の変化を反映
アプリの ID
- 独自のユーザー ID を連携
- サーバー発行の UserSig で認証
プラットフォーム連携
- ブラウザーのワークスペース
- ネイティブ・ブラウザーの権限に対応
製品のフロー
- ルームをナビゲーションに連携
- 業務データはアプリで管理
React 会議コンポーネントを見る
ルーム体験とそのコードをご覧ください。
会議画面
みんなの居場所
React ビデオ会議 UI Kit で会議画面を配置。アプリが認証済みユーザーとルーム ID を提供します。
import { UIKitProvider } from '@tencentcloud/uikit-base-component-react';
import { ConferenceMainView } from '@tencentcloud/roomkit-web-react';
export default function App() {
return (
<UIKitProvider theme="light" language="en-US">
<ConferenceMainView />
</UIKitProvider>
);
}始める
最初のルームを動かす
- 01
- 02
- 03
npm install @tencentcloud/roomkit-web-react tuikit-atomicx-react @tencentcloud/uikit-base-component-react @tencentcloud/universal-apiimport { UIKitProvider } from '@tencentcloud/uikit-base-component-react';
import { ConferenceMainView } from '@tencentcloud/roomkit-web-react';
export default function App() {
return (
<UIKitProvider theme="light" language="en-US">
<ConferenceMainView />
</UIKitProvider>
);
}React ビデオ会議 UI Kit のよくある質問
React ビデオ会議 UI Kit には何が含まれますか？
React ビデオ会議 UI Kit は入室、映像表示、参加者操作を備えた会議画面を提供。ID と業務フローはアプリで管理します。
React ビデオ会議 UI Kit の導入方法は？
React ビデオ会議 UI Kit のログイン方法は？
SDKAppID、ユーザー ID、サーバー生成の UserSig を使用。アプリの秘密鍵をブラウザー・モバイルコードに含めず、入室前に認証失敗を処理します。
会議体験をカスタマイズできますか？
文書化されたコンポーネントと設定を製品に調整。ネイティブ UI Kit ソースにはルーム画面とツールバーがあります。対応項目はガイドで確認してください。
コースやワークスペースのシステムを置き換えますか？
コース内容、ワークスペース権限、支払い、業務記録はアプリで管理。会議コンポーネントがリアルタイム通信を追加します。
React で React ビデオ会議 UI Kit を導入する方法は？
React ビデオ会議 UI Kit の画面をカスタマイズする方法は？
@tencentcloud/uikit-base-component-react の UIKitProvider に theme と language を設定します。映像の配置を変更するには、tuikit-atomicx-react/room から RoomLayoutTemplate を取得し、conference.setFeatureConfig({ layoutTemplate: RoomLayoutTemplate.SidebarLayout }) を呼び出します。これはサポートされているレイアウトの選択であり、すべてのルームコンポーネントを自由に置き換える設定ではありません。内蔵の招待相手選択機能は IM の友だち関係を使用します。業務上の連絡先が必要な場合は、ドキュメントに記載されたサーバー API で同期してください。