購読する基本

このガイドでは、セッションで利用可能なストリームを検出し、サブスクライブし、終了したらサブスクライブを解除する方法を示します。新しいストリームをリッスンし、それらを UI にアタッチし、正しくクリーンアップします。

ストリームを検出する

セッション内の新しいストリームをリッスンすることで、ストリームが表示されたときに購読することができます。

について <OTSession> コンポーネントは streamCreated イベントは、セッションに新しいストリーム(自分のストリーム以外)が作成されたときに発生します。ストリームは、クライアントがセッションにストリームをパブリッシュしたときに作成されます。ストリームは streamCreated イベントは、セッション内の各既存ストリームに対しても、最初の接続時にディスパッチされます。streamCreated イベントオブジェクトには、接続データ、ビデオソースの種類('camera' または 'screen')など、ストリームの詳細が含まれます。

新しいストリームを検出したら、次のセクションで説明するように、そのストリームを購読する。

ストリームを購読する

セッションを使ってリモートストリームを購読し、それをUIでレンダリングする。

セッション内のすべてのストリームをサブスクライブするには、OTSubscriber オブジェクトを OTSession オブジェクトのチリとして追加します:

<OTSession
  applicationId="the Application ID"
  sessionId="the session ID"
  token="the token">
  <OTSubscriber/>
</OTSession>

クライアントがセッションに接続した後、OTSubscriber オブジェクトは、セッション内で他のクライアントのストリームが利用可能になると、サブスクライバービデオのビューを追加する。

をディスパッチします。 connected イベントをディスパッチします。サブスクライバが正常にストリーミングを開始すると、エラーイベントがディスパッチされます。 error 購読するを設定する。 eventHandlers OTSubscriberコンポーネントのプロパティを設定し connected そして error プロパティをコールバック関数に渡す:

<OTSubscriber
eventHandlers={{
  connected: () => {
    console.log('The subscriber started streaming.');
  },
  error: () => {
    console.log('The subscriber failed.');
  }
}}/>

配信停止(JavaScript)

購読しているストリームの再生を停止する:

session.unsubscribe(subscriber);

サブスクライバー・オブジェクトは破棄され、ストリーム表示は HTML DOM から削除されます。