mediasoupClient研究ノート[4]消費者データ消費者

以前にプロデューサーを紹介しました。今日はコンシューマーについて話しましょう。正式に入る前に、
プロデューサーとコンシューマーはここではユーザーではありません。同じユーザーがコンシューマーとプロデューサーを作成できます
たとえば、WeChatボイスチャット、2人同時に話すことができ、お互いの言葉を聞くこともできます。
これが考え方を変える必要性です。

注目に値するもう1つのポイントは、公式デモ全体で、シグナリングサービスはデータ送信のみを行うため、トランスポートと混同ないでください。

全体的なプロセスとプロセス(プロセスには重要なリンクのみがリストされます)

  1. (プロデューサー側)クライアントの初期化
  2. (プロデューサー側)トランスポートの作成; createSendTransportが作成され、関連イベントをリッスンします。接続イベントとプロデュースイベントは、WebSocketを介して関連データを送信する必要があります。
  3. 前の記事で説明したproduce()は、トランスポートのproduceイベントをトリガーし、シグナリングサービスを介して関連データを送信します
  4. (コンシューマー)createRecvTransportイベントは、上記と同じ手順で接続をリッスンします
  5. (シグナリングサービス)接続と生成の作成チャネルおよびサーバーのメディアスープ操作を受信した後、生成されたデータもコンシューマーに転送します(これについては記事の後半で詳しく説明します)。
  6. (消費者)シグナリングサービスのデータを受信して​​消費する

ここに書かれている完全なプロセスは比較的簡単です。技術的な詳細が必要な場合は、コードを分析する必要があります。

この記事のトピックに戻る

実際、これは上記の6番目のステップです。クライアント
シグナリングサーバーがプロデューサーデータを受信した、対応するコンシューマーを見つけてデータを転送する必要があります。

公式ウェブサイトで提供されているコードは、実際には非常に短く明確であることがわかります。ここで指摘します。

mySignaling.on('newConsumer', async (data) =>
{
    
    
  const consumer = await transport.consume(
    {
    
    
      id            : data.id,
      producerId    : data.producerId,
      kind          : data.kind,
      rtpParameters : data.rtpParameters
    });

  // Render the remote video track into a HTML video element.
  const {
    
     track } = consumer;

  videoElem.srcObject = new MediaStream([ track ]);
});

  • トランスポートは実際にはコンシューマチャネルですcreateRecvTransport()
  • 変換中のメディアデータ消費の取得を追跡する

実際、消費の難しさはそれほど多くありません。前の記事とこの記事は、クライアントのいくつかの関連する知識ポイントに属しています。後で、サーバーの関連する処理手順を更新する時間があります。

コードワードは簡単ではありません、あなたのサポートに感謝します

おすすめ

転載: blog.csdn.net/uk_51/article/details/111568543