本文にスキップする
Version: 5.3

カスタムメディアストリーム

WebPlanetKitは、通話開始時に基本的にマイクとカメラデバイスでMediaStreamを生成して通話に使用します。ただし、アプリケーションの要求事項によっては、これを変更する必要があります。ユーザーのビデオの代わりに、外部ソースから取得したビデオを画面に表示するのが一例です。

このような要求を満たすために、WebPlanetKitは、希望するMediaStreamを直接供給できるカスタムメディアストリーム（custom media stream）機能を提供します。この機能を利用することで、ユーザーが希望するMediaStreamを直接WebPlanetKitモジュールにレンダリングし、相手に伝えることができます。

対応する通話タイプSDKの最低バージョン
1対1通話、グループ通話（カンファレンス）WebPlanetKit 5.3
Note

バーチャル背景機能を使用するときは、カスタムメディアストリームを設定できません。

実装手順​

カスタムメディアストリーム機能を利用して外部ソースから取得したビデオを画面に表示する方法は、次のとおりです。

外部ビデオソースからカスタムメディアストリームを準備する​

部ビデオソースを使用してカスタムメディアストリームに設定するMediaStreamを準備してください。

// Example of video source
const videoElement = document.createElement('video');
videoElement.src = '/sample_video.mp4';
videoElement.loop = true;
videoElement.width = 1280;
videoElement.height = 720;
videoElement.autoplay = true;
videoElement.playsInline = true;

// MediaStream of video source
const sampleCustomMediaStream = videoElement.captureStream();

カスタムメディアストリームで通話を開始する​

準備したカスタムメディアストリームで通話を開始できます。MakeCallParamsやVerifyCallParams、またはConferenceParamsのcustomMediaStreamに準備したカスタムメディアストリームを設定します。

const conferenceParams = {
    ...,
    customMediaStream: sampleCustomMediaStream
}

planetKit.joinConference(conferenceParams);

通話中にカスタムメディアストリームを設定する​

通話中に準備したカスタムメディアストリームを設定して使用するには、カスタムメディアストリームを引数として入れてsetCustomMediaStream()を呼び出します。

planetKit.setCustomMediaStream(sampleCustomMediaStream)
    .then(() => {
        // Successfully set custom media stream
    })
    .catch((error) => {
        // Failed to set custom media stream
    });
Note
  • カスタムメディアストリームのビデオが設定されているとき、pauseMyVideo()を呼び出すとresumeMyVideo()を呼び出してもビデオは再生されません。ただし、このときカスタムメディアストリームの設定が解除されることはありません。
  • disableVideo()やchangeVideoInputDevice()を呼び出してビデオソースを変更する場合、カスタムメディアストリームのビデオ設定は解除されます。

カスタムメディアストリームを解除する​

カスタムメディアストリームを使用している最中、再びマイクとカメラデバイスで生成されたMediaStreamを使用するには、unsetCustomMediaStream()を呼び出します。

planetKit.unsetCustomMediaStream()
    .then(() => {
        // Successfully unset custom media stream
    })
    .catch((error) => {
        // Failed to unset custom media stream
    });

通話にカスタムメディアストリームのビデオが設定されているかを確認する​

通話にカスタムメディアストリームのビデオが設定されているかを確認するには、hasSetCustomMediaStreamWithVideo()を呼び出します。

if (planetKit.hasSetCustomMediaStreamWithVideo()) {
    // Currently custom media stream with video is set
}

活用例​

以下のようなアプリケーションの要求事項がある場合、カスタムメディアストリームを活用して実装できます。

  • 映像ファイルをビデオソースとして使用したいとき
  • ウェブストリーミングを受けてビデオソースとして使用したいとき
  • アプリケーションで直接MediaStreamを構成して使用したいとき