クライアントの観測可能性：ウェブ

Vonage Video SDKは、ほとんどのユースケースで推奨される高レベルの統計APIを通じて、詳細なストリーム品質メトリクスを公開します。このAPIは、音声、ビデオ、ネットワーク、および送信者側の統計を、ピア接続の遷移をまたいで安定したまま、統一されたセッション認識形式で提供します。高度なデバッグのために、SDKは未処理のピア接続データを反映する生のWebRTC統計レポートへのアクセスも提供します。

SDKはまた、パブリッシャーとサブスクライバーの両方に対して、接続の健全性をハイレベルで評価するネットワーク・コンディション・メトリクスを公開します。これらのメトリクスには、ネットワーク・コンディション・スコア、そのスコアの理由、およびサブスクライバについては、観察された問題の原因が接続のどちらにあるかを示すデグラデーション・ソースが含まれます。参照 ネットワークの状態と劣化の原因 詳細はこちら。

オーディオ、ビデオ、メディアリンク統計API

Vonage Video Web SDKは、パブリッシャーとサブスクライバーの両方に対して、オーディオ、ビデオ、メディアリンクの統計情報を定期的に送信します。これらには、パケット数、ビットレート、フレームレートデータ、一時停止/フリーズメトリクス、コーデック情報、および帯域幅推定やネットワーク状態スコアリングなどのトランスポートレベルのネットワークメトリクスが含まれます。

出版社の統計を取る

について Publisher.getStats() メソッドは オブジェクトの配列を提供します。 ルーティングされたセッション( オープントーク メディア・ルーター)、この配列には1つのオブジェクトが含まれ、Vonage Video Media Routerに送信される単一のオーディオ・ビデオ・ストリームの統計情報を定義します。 この配列には、Vonage Video Media Router に送信される単一のオーディオ・ビデオ・ストリームの統計情報を定義する 1 つのオブジェクトが含まれます。中継セッションの場合、 には、公開ストリームの加入者ごとのオブジェクトが含まれます。

以下のコードでは、パブリッシャーのストリームのメトリクスを毎秒ログしています：

window.setInterval(() => {
  publisher.getStats((error, statsArray) => {
    if (error) {
      console.error(error);
      return;
    }

    statsArray.forEach(statsContainer => {
      const stats = statsContainer.stats;
      const connectionId = stats.connectionId || 'routed';

      console.log(`\nStats for ${connectionId}`);
      if (stats.video) {
        const video = stats.video;

        if (video.layers && video.layers.length > 0) {
          console.log(`Video layers: ${video.layers.length}`);

          video.layers.forEach((layer, index) => {
            console.log(` Layer ${index}: ${layer.width}x${layer.height}`);
            console.log(`   encodedFrameRate: ${layer.encodedFrameRate} fps`);
            console.log(`   bitrate: ${layer.bitrate} bps`);
            console.log(`   totalBitrate: ${layer.totalBitrate} bps`);
            console.log(`   codec: ${layer.codec}`);
            console.log(`   scalabilityMode: ${layer.scalabilityMode}`);
            if (layer.qualityLimitationReason) {
              console.log(`   qualityLimitationReason: ${layer.qualityLimitationReason}`);
            }
          });
        }

        console.log('transport estimated bandwidth:', stats.mediaLink.transport.connectionEstimatedBandwidth, 'bps');
        console.log('network condition:', stats.mediaLink.transport.networkCondition);
        console.log('network condition reason:', stats.mediaLink.transport.networkConditionReason);
      }
    });
  });
}, 1000);

パブリッシャーでのビデオ品質イベントの受信

との統計ポーリングに加え Publisher.getStats()を購読することで、パブリッシャーがビデオの品質に意味のある変化を検出したときに、リアルタイムで通知を聞くことができます。 videoQualityChanged イベントを開催する：

publisher.on('videoQualityChanged', ({ reason, statsContainer }) => {
  console.log('Video quality change reason:', reason);

  const { stats } = statsContainer;

  if (stats.video && stats.video.layers) {
    stats.video.layers.forEach((layer) => {
      console.log(
        `Resolution: ${layer.width}x${layer.height}, FPS: ${layer.frameRate}`
      );
    });
  }
});

パブリッシャーでのネットワーク状況イベントの受信

パブリッシャーのネットワーク状態変化イベントを受け取るには networkConditionChanged イベントを開催する：

publisher.on('networkConditionChanged', ({ reason, statsContainer }) => {
  const { stats } = statsContainer;
  console.log('Network condition changed.');
  console.log(`Network Condition: ${stats.mediaLink.transport.networkCondition}, Reason: ${stats.mediaLink.transport.networkConditionReason}`);
});

このイベントは、パブリッシャーに対してネットワーク状態の重大な変化が検知されたときにトリガーされる。このイベントは statsContainer オブジェクトには、影響を受けたサブスクライバのメディアリンク統計が含まれます。リレーされたセッションでは、影響を受けたサブスクライバの統計のみがイベントに含まれます。

購読者の統計情報の取得

について getStats() メソッドは、サブスクライバのストリームに関する情報を提供します。 サブスクライバのストリームに関する情報を提供します。

以下のコードは、加入者のストリームについて、1秒ごとにいくつかのメトリクスを記録する：

window.setInterval(() => {
  subscriber.getStats((error, stats) => {
    if (error) {
      console.error('Error getting subscriber stats: ', error.message);
      return;
    }

    const video = stats.video;

    if (video) {
      console.log('video bitrate:', video.bitrate, 'bps');
      console.log('video totalBitrate:', video.totalBitrate, 'bps');
      console.log('decoded frame rate:', video.decodedFrameRate, 'fps');
      console.log('codec:', video.codec);
      console.log('res:', `${video.width}x${video.height}`);

      console.log('freezeCount:', video.freezeCount);
      console.log('totalFreezesDuration:', video.totalFreezesDuration, 'ms');
      console.log('pauseCount:', video.pauseCount);
      console.log('totalPausesDuration:', video.totalPausesDuration, 'ms');
    }
  });
}, 1000);

加入者のビデオ品質イベントの受信

を聴くことができる。 videoQualityChanged イベントで、ビデオ画質の著しい中断や変化が検出されたときに通知されます。

subscriber.on('videoQualityChanged', ({ reason, stats }) => {
  if (reason === 'videoInterruption') {
    console.warn('Video playback was interrupted');

    if (stats.video.freezeCount > 0) {
      console.log(`Freeze count: ${stats.video.freezeCount}`);
    }

    if (stats.video.pauseCount > 0) {
      console.log(`Pause count: ${stats.video.pauseCount}`);
    }
  }
});

加入者のネットワーク状態イベントの受信

サブスクライバーのネットワーク条件変更イベントを受け取るには、以下のようにリッスンする。 networkConditionChanged イベントを開催する：

subscriber.on('networkConditionChanged', ({ reason, stats }) => {
  console.log('Network condition changed.');
  console.log(`Degradation source: ${stats.mediaLink.networkDegradationSource}`);
  if (stats.mediaLink.networkDegradationSource === 'local') {
    console.log(`Network Condition: ${stats.mediaLink.transport.networkCondition}, Reason: ${stats.mediaLink.transport.networkConditionReason}`);
  } else if (stats.mediaLink.networkDegradationSource === 'remote') {
    console.log(`Network Condition: ${stats.mediaLink.remotePublisherTransport.networkCondition}, Reason: ${stats.mediaLink.remotePublisherTransport.networkConditionReason}`);
  }
});

このイベントは、サブスクライバーまたはリモートパブリッシャーのネットワーク状 態の重大な変化が検知されたときにトリガーされる。このイベントは stats オブジェクトには、ローカルおよびリモートのトランスポート・メトリクスと劣化ソースを含むメディアリンク統計が含まれます。

既知の問題

品質制限のトリガーとなる実際の値や条件は実装に固有であり、ブラウザやプラットフォームによって異なる場合があります。例えば

• 画面共有のビデオストリームは videoQualityChanged イベントを開催する。
• Firefoxは以下をサポートしていません。 qualityLimitationReasonそのため、このプロパティはパブリッシャーの統計には存在しない。また videoQualityChanged 理由のある出来事 bandwidth, cpu そして other はこのブラウザではサポートされていません。
• ハードウェアアクセラレーションによるビデオエンコーディングと専用ビデオエンコーダーが、macOSのトリガーを防ぐ cpu 制限がある。

統計データ構造

このセクションでは、Video API が提供する構造体とプロパティの概要を説明します。すべての Video SDK プラットフォームが同じ統計情報セットを公開していますが、各プラットフォームで個々のフィールドの構造や名前の付け方に若干の違いがある場合があります。これらの違いは、基本的なメトリクスの違いではなく、プラットフォーム固有の SDK の設計規約を反映しています。

利用可能な統計とそれが表すものについてのプラットフォームに依存しない説明については、以下を参照のこと。 顧客の観測可能性の概要.

出版社統計 (stats)

出版社に関する統計情報を提供します。

• connectionId - のidプロパティと一致する、クライアント接続の一意なID。 connection プロパティの connectionCreated セッションオブジェクトがリモートクライアントにディスパッチしたイベント(リレーされたセッションでのみ使用可能)。
• subscriberId - のidプロパティと一致する、購読者の一意なID。 Subscriber オブジェクトをサブスクライブしているクライアントのアプリで使用することができます（リレーセッションでのみ使用可能）。

出版社オーディオ統計 (stats.audio)

パブリッシャーのオーディオトラックに関する統計を提供します。

• bytesSent - 送信されたオーディオ・バイトの合計。
• packetsLost - 加入者またはメディア・ルーターに到達しなかったオーディオ・パケットの合計。
• packetsSent - 送信されたオーディオパケットの合計。
• timestamp - 統計情報が収集されたUnixタイムスタンプ（ms）。

出版社ビデオ統計 (stats.video)

これらのフィールドは、パブリッシャーの現在のビデオパフォーマンスを表しています：

• bytesSent - 送信されたビデオ・バイトの合計。
• packetsLost - 加入者またはメディアルーターに到達しなかったビデオパケットの合計。
• packetsSent - 送信されたビデオパケットの合計。
• layers - アクティブなビデオエンコーディングレイヤーを高解像度から低解像度の順に並べたリスト。

パブリッシャービデオレイヤー統計 (stats.video.layers)

1つのサイマルキャスト・レイヤーまたはSVCレイヤーを表す。

• width - エンコードされた幅（ピクセル）。
• height - エンコードされた高さをピクセルで表す。
• encodedFrameRate- このレイヤーの実際のエンコードフレームレート。
• bitrate - ペイロードのビットレート（bps）。
• totalBitrate - RTPヘッダーとパディングを含むビットレート（bps）。
• scalabilityMode- スケーラビリティ設定（例：SVCの場合は「L1T3」、サイマルキャストの場合は「L3T3」）。
• codec - このレイヤーに使用されるコーデック。
• qualityLimitationReason - エンコーダーが品質を調整した理由 (「帯域幅」、「CPU」、「その他」)。

出版社メディアリンク統計 (stats.mediaLink.transport)

について transport オブジェクトは、個々のトラックやレイヤーではなく、オーディオビデオトランスポート全体に適用されるピアコネクションレベルのネットワーク推定メトリクスを提供する。

• connectionEstimatedBandwidth - 接続で利用可能なアップリンク帯域幅の推定値（bps）。
• networkCondition - 現在のネットワーク・コンディション・スコア"unknown", "critical", "warning", "fair", "good"あるいは "excellent").
• networkConditionReason - ネットワーク状況に影響を与える主な理由"none", "unknown", "bandwidth"あるいは "packetLoss").

加入者ビデオ統計 (stats.video)

これらのフィールドは、加入者のリアルタイムのビデオ受信およびデコード性能を示す：

• bytesReceived - 受信したビデオ・バイトの合計。
• packetsLost - 加入者に届かなかったビデオパケットの合計。
• packetsReceived - 受信したビデオパケットの合計。
• timestamp - 統計情報が収集されたUnixタイムスタンプ（ms）。
• decodedFrameRate - デコーダーが生成する実際のフレームレート（fps）。
• bitrate - ペイロードのビットレート（ビット/秒）。
• totalBitrate - RTPヘッダーとパディングを含むビットレート（bps）。
• codec - この加入者に使用されているコーデック。
• pauseCount - 5秒以上フレームがレンダリングされなかったポーズの数。
• totalPausesDuration - 全休止の累積時間（ms）。
• freezeCount - 短いフリーズの数（WebRTC統計の定義より）。
• totalFreezesDuration - すべてのフリーズの累積時間（ms）。

加入者送信側推定(stats.senderStats)

これらのメトリクスは、送信者の送信接続について報告される帯域幅の推定値を提供する：

• connectionMaxAllocatedBitrate - 送信側に割り当てられた最大ビットレート（bps）。
• connectionEstimatedBandwidth - 送信側の現在の推定アップリンク帯域幅（bps）。

加入者メディアリンク統計 (stats.mediaLink)

について mediaLink オブジェクトは、サブスクライバーの接続に対するトランスポートレ ベルとネットワークのデグレード情報を提供する。これはパブリッシャーの mediaLink.transport ローカルとリモートのトランスポートに加え、劣化ソースのインジケーターがある：

• transport - このサブスクライバーのダウンリンク接続のローカルトランスポート統計（パブリッシャーの stats.mediaLink.transport).送信側の統計や音声フォールバックが無効になっている場合、制限されることがある。
• remotePublisherTransport - アップリンク接続のリモートパブリッシャートランスポート統計（パブリッシャーの stats.mediaLink.transport).送信側の統計や音声フォールバックが無効になっている場合、制限されることがある。
• networkDegradationSource - もしあれば、どちらの側がネットワークの劣化を引き起こしたかを示す。取り得る値： "none", "local", "remote"あるいは "bothOrUnclear".送信側の統計や音声フォールバックが無効になっている場合、制限されることがあります。

通話品質モニタリング

コア統計APIに加え、OpenTok.jsは通話品質の変化を監視し、対応するための追加機能を提供します。これらの機能は、アプリケーションがデバイスの制約やネットワーク状況に適応してパフォーマンスを最適化するのに役立ちます。

CPUパフォーマンス監視

アプリケーションは、プラットフォームの異なる様々なモバイルデバイスやデスクトップデバイス上で実行される可能性がある。さらに、デバイスのハードウェア仕様は均一ではない。例えば、あるモバイル・デバイスは多くのデスクトップ・デバイスよりもCPU性能が優れているかもしれないし、その逆かもしれない。

CPU、GPU、RAM、ハードウェア・エンコーダ/デコーダなど、多数のハードウェア構成が可能なため、チューニングが必要になる場合があります。性能の低いデバイスは、CPUに負荷のかかる機能を無効にするように設定でき、性能の高いデバイスは、より没入感のある体験をデフォルトにすることができます。

CPUパフォーマンスの変化の検出

セッションをモニターすることで、デバイスのCPU負荷の変化を検出することができます。 cpuPerformanceChanged イベントを含む。このイベントには cpuPerformanceState プロパティに設定される：

• 'nominal' - この装置は追加の仕事を引き受けることができる。
• 'fair' - さらに、ファンを搭載したデバイスの場合、ファンが作動し、音が聞こえるようになることがある。
• 'serious' - デバイスはストレスを受けているため、リソース（CPUなど）のスロットルが発生する可能性がある。
• 'critical' - デバイスには非常に大きなストレスがかかっており、これを軽減しないと問題が発生する可能性がある。

詳しくは このW3C仕様.

CPUパフォーマンスの変化に基づくアプリケーションの最適化

このイベントに応答して、アプリケーションはユーザーにリソースの消費を通知したり などの計算量の多いプロセスを無効にすることができる。 ビデオトランス. セッションを見る cpuPerformanceChanged.

以下のコードは、CPUが 'critical' パフォーマンス状態と に戻ったら、再び有効にします。 'fair' またはそれ以上：

let isVideoDisabledByCPU = false;

session.on('cpuPerformanceChanged', (event) => {
  if (event.cpuPerformanceState === 'critical') {
    // The application should alert the user why their video is being disabled
    publisher.publishVideo(false);
    isVideoDisabledByCPU = true;
  } else if (event.cpuPerformanceState === 'nominal' || event.cpuPerformanceState === 'fair') {
    if (isVideoDisabledByCPU) {
      publisher.publishVideo(true);
      isVideoDisabledByCPU = false;
    }
  }
})

平均意見スコア（MOS）

ユーザーがサービスから感じる経験の質は、以下の方法で評価することができる。 平均意見スコア (MOS）。

格付けシステム

MOSは正の数で表される。スコアは1（最も品質が悪い）から5（最も品質が良い）の間である：

• 5（Excellent） - ユーザーが体験できる最高の品質に対する仮想的な上限。
• 4 (Good) - より達成可能な評価。Vonageユーザーはこのレベルの品質を期待できます。
• 3 (Fair) - 品質は問題ない。
• 2 (Poor) - 品質が受け入れがたい。
• 1（悪い） - 品質は最悪。

アルゴリズム

MOSレーティングは、ユーザーエクスペリエンスに影響を与える（そして低下させうる）いくつかの要素を考慮に入れています。これらの要因には以下のものが含まれます（ただし、これらに限定されるものではありません）：

• パケットロス - パケットロスがメディアの品質を劣化させる
• ビットレート - ビットレートが高いほど、メディアの忠実度は高くなる。
• ネットワーク遅延 - 到着が遅すぎるパケットはドロップされる可能性があり、音声の欠落や映像の乱れにつながります。

通話品質の変化に基づくアプリケーションの最適化

サブスクライバーを使う クオリティスコア変更 イベントで、オーディオとビデオの品質の変化を監視する。しかし、メディア品質の変化を監視するだけでは不十分です。通話アプリケーションのリアルタイムの性質を考えると、最高のユーザー体験を継続的に提供するためにアプリケーションをチューニングすることによって、観察された変化に対応することも必要です。

単純なヒューリスティックを以下に示す。アプリケーションはリソース制約に基づいて動的に最適化される。

// We want to know if the CPU is overloaded. If it is, then we
// can disable certain features so that the best call possible
// can still take place.
let isCpuOverloaded = false;

session.on('cpuPerformanceChanged', (event) => {
  isCpuOverloaded = event.cpuPerformanceState === 'critical';
});

// We monitor for changes in call quality. This allows us to
// tune our application, taking into account multiple factors
// (inlined below)
subscriber.on('qualityScoreChanged', (event) => {
  const { qualityScore } = event;
  const isVideoQualityBad = qualityScore.video < 2;

  if (!isVideoQualityBad && !isCpuOverloaded) {
    // Subscribe to the highest quality video since the CPU isn't taxed
    // and the quality received is good
    subscriber.setPreferredResolution('1280x720');
    subscriber.setPreferredFrameRate(30);
  }
  else if (isVideoQualityBad && !isCpuOverloaded) {
    // Even though the CPU isn't taxed, the video quality received is
    // bad. This might be due to (hopefully) intermittent network issues, so
    // we subscribe to lower quality video.
    subscriber.setPreferredResolution('320x180');
    subscriber.setPreferredFrameRate(7);
  }
  else if (isVideoQualityBad && isCpuOverloaded) {
    // The video quality received is bad and the CPU not being overloaded.
    // Let's disable video for now.
    // We can enable video once conditions improve. See statement below.
    subscriber.subscribeToVideo(false);
  }
  else {
    // Enable video
    subscriber.subscribeToVideo(true);
  }
});

通話前テストにおける通話品質の推定

Vonageビデオ ウェブ用ネットワーク・テスト・ライブラリ を使用して、クライアントがオーディオとビデオの公開をサポートしているかどうかを確認し、クライアントの公開ストリームのオーディオとビデオの推定MOSスコアを報告します。このライブラリは Publisher.getRtcStatsReport() そして Subscriber.subscriber.getStats() の方法でMOSスコアを算出する。

送信側統計

参照 送信側統計の概要.

送信側統計の有効化

送信者側の統計情報は、購読者が受け取る。送信者側の統計情報を受け取るには、ストリームのパブリッシャーに publishSenderStats プロパティを true での OT.initPublisher コール：

const publisher = OT.initPublisher({
  publishSenderStats: true
});

もし publishSenderStats が有効でない場合、このパブリッシャーに対して送信者統計チャンネルは発行されません。デフォルト値は false.

送信側統計の受信

パブリッシャーが送信者側の統計情報を有効にしている場合、購読者は自動的に Subscriber.getStats() 前述.その senderStats プロパティは2つの指標を提供します：

• connectionMaxAllocatedBitrate - 接続時に推定可能な最大ビットレート（bps）
• connectionEstimatedBandwidth - 現在の推定接続帯域幅 (bps)

これらのメトリクスは、オーディオ・ビデオ・バンドルごとに計算されるため、ビデオとオーディオの両方の統計に同じ値が表示されます。最初の getStats ネットワーク遅延のため、送信者統計が含まれない場合がある。

subscriber.getStats((stats) => {
  if (stats.senderStats) {
    console.log(`Connection max allocated bitrate: ${stats.senderStats.connectionMaxAllocatedBitrate} bps`);
    console.log(`Connection current estimated bandwidth: ${stats.senderStats.connectionEstimatedBandwidth} bps`);
  }
});

既知の問題

セッションがリレーされている場合、または参加者が2人だけの特定のルーティング・セットアップで、パブリッシャーがFirefoxを使用している場合、ブラウザの制限により送信側の統計が利用できないことがあります。

ネットワークの状態と劣化の原因

SDKは、パブリッシャーとサブスクライバーの両方に対して、コンディションのスコア、そのスコアを駆動する理由、サブスクライバーの劣化ソースを含むリアルタイムのネットワーク・コンディション・メトリクスを提供します。ネットワーク・コンディション・モデル、スコア、理由、およびそれを有効にする方法の詳細については 顧客の観測可能性の概要.

ネットワーク・コンディション・データは2つのチャンネルから入手できる：

• 定期的な統計： メディアリンク統計イベントには、以下のトランスポートメトリクスが含まれます。 connectionEstimatedBandwidth, networkCondition そして networkConditionReason.加入者の統計も公開 remotePublisherTransport そして networkDegradationSource.
• ネットワーク状態の変更イベント： 両国の専用イベント 出版社 そして 契約者 は、ネットワーク状態の重大な変化が検出されたときにトリガーされる。

以下の例では、加入者ネットワークの状態データを使用して、劣化の原因を特定する方法を示しています：

subscriber.on('networkConditionChanged', ({ reason, stats }) => {
  console.log('Network condition changed.');
  console.log(`Degradation source: ${stats.mediaLink.networkDegradationSource}`);
  if (stats.mediaLink.networkDegradationSource === 'local') {
    console.log(`Network Condition: ${stats.mediaLink.transport.networkCondition}, Reason: ${stats.mediaLink.transport.networkConditionReason}`);
  } else if (stats.mediaLink.networkDegradationSource === 'remote') {
    console.log(`Network Condition: ${stats.mediaLink.remotePublisherTransport.networkCondition}, Reason: ${stats.mediaLink.remotePublisherTransport.networkConditionReason}`);
});

RTC統計レポート

パブリッシャーの低レベルのピア接続統計を取得するには Publisher.getRtcStatsReport() メソッドを呼び出す。このメソッドはプロミスを返す。 RtcStatsReport オブジェクトを返します：

publisher.getRtcStatsReport()
  .then((stats) => stats.forEach(console.log))
  .catch(console.log);

サブスクライバの低レベルのピア接続統計を取得するには Subscriber.getRtcStatsReport() メソッドを呼び出す。このメソッドはプロミスを返す。 RtcStatsReport オブジェクトを返します：

subscriber.getRtcStatsReport()
  .then((stats) => stats.forEach(console.log))
  .catch(console.log);