概要

2019/2/19にagora.io WebSDK2.5.1がリリースされました。
多くの機能追加がありましたのでピックアップして紹介します。
公式リリースノート(英文)

統計情報取得関連

1.ビデオ通話の統計情報取得
以下のコードで通話時間、参加人数、送受信データ量が取得できます。
(Chromeのみサポートしています)

function getSessionStats(){
  client.getSessionStats((stats) => {
    console.log(`Current Session Duration: ${stats.Duration}`); 
    console.log(`Current Session UserCount: ${stats.UserCount}`);
    console.log(`Current Session SendBytes: ${stats.SendBytes}`);
    console.log(`Current Session RecvBytes: ${stats.RecvBytes}`);
    console.log(`Current Session SendBitrate: ${stats.SendBitrate}`);
    console.log(`Current Session RecvBitrate: ${stats.RecvBitrate}`);
  });
}

2.ネットワーク品質の情報取得
以下のコードでUp/Downのネットワーク品質が6段階で取得できます。

client.on('network-quality', function(stats) {
  console.log('downlinkNetworkQuality', stats.downlinkNetworkQuality);
  console.log('uplinkNetworkQuality', stats.uplinkNetworkQuality);
});

3.リモート拠点のオーディオ情報取得
リモート拠点のオーディオコーデック、パケットロス、帯域等が取得できます。

client.getRemoteAudioStats((remoteAudioStatsMap) => {
  for(var uid in remoteAudioStatsMap){
    console.log(`Audio CodecType from ${uid}: ${remoteAudioStatsMap[uid].CodecType}`);
    console.log(`Audio End2EndDelay from ${uid}: ${remoteAudioStatsMap[uid].End2EndDelay}`);
    console.log(`Audio MuteState from ${uid}: ${remoteAudioStatsMap[uid].MuteState}`);
    console.log(`Audio PacketLossRate from ${uid}: ${remoteAudioStatsMap[uid].PacketLossRate}`);
    console.log(`Audio RecvBitrate from ${uid}: ${remoteAudioStatsMap[uid].RecvBitrate}`);
    console.log(`Audio RecvLevel from ${uid}: ${remoteAudioStatsMap[uid].RecvLevel}`);
    console.log(`Audio TotalFreezeTime from ${uid}: ${remoteAudioStatsMap[uid].TotalFreezeTime}`);
    console.log(`Audio TotalPlayDuration from ${uid}: ${remoteAudioStatsMap[uid].TotalPlayDuration}`);
    console.log(`Audio TransportDelay from ${uid}: ${remoteAudioStatsMap[uid].TransportDelay}`);
  }
});

同様にClient.getRemoteVideoStatsでリモートのビデオ情報、Client.getLocalVideoStatsでローカルのビデオ情報、Client.getTransportStatsでネットワークの種別情報等が取得できます。

映像/音声の受信処理

今までは映像と音声の取得についてはまとめられていましたが、Client.subscribeにoptionが追加され、映像のみ取得、音声のみ取得という処理が可能になりました。

//映像のみ取得
client.subscribe(stream, {video: true, audio: false});

//音声のみ取得
client.subscribe(stream, {video: false, audio: true});

CDN等からの外部映像取得

RTMPやHLS等、CDNから配信されている映像ストリームを再生できます。
(Nativeに既に実装済みの機能となります）

var InjectStreamConfig = {
  width: 0,
  height: 0,
  videoGop: 30,
  videoFramerate: 15,
  videoBitrate: 400,
  audioSampleRate: 44100,
  audioChannels: 1,
};
client.addInjectStreamUrl("rtmp://SERVER/APP/STREAM", InjectStreamConfig);

ユーザー権限

配信者か視聴者の権限付与ができます。視聴者は映像配信はできず、受信のみ可能になります。

client.setClientRole('host', function() {
  console.log("setHost success");
}, function(e) {
  console.log("setHost failed", e);
});

Agoraサーバーとの接続状況確認

Agoraサーバーとの接続状況が確認できます。

client.getConnectionState()

Chrome70以上とSafariの自動再生ポリシー対策

Chrome 70+およびSafariでは、音声付きの映像ストリームは、ユーザーの操作によってトリガーされるまで再生されません。ユーザーの操作なしで映像を再生したい場合は、ミュートフラグをtrueに設定すると、映像は自動的に無音で再生されます。

  client.on('stream-subscribed', function (evt) {
    var stream = evt.stream;
    console.log("Subscribe remote stream successfully: " + stream.getId());
    if ($('div#video #agora_remote'+stream.getId()).length === 0) {
      $('div#video').append('<div id="agora_remote'+stream.getId()+'" style="float:left; width:810px;height:607px;display:inline-block;"></div>');
    }
    stream.play('agora_remote' + stream.getId(),{muted:true});
  });

最後に

agora.ioに関するお問い合わせはこちらから