Tips

Plugin の使い方

Core ライブラリでは Plugin を使って追加の機能を利用できます。

現在提供されている Plugin は以下の 1 種類です。

  • SFU Bot

SFU Bot を例に Plugin の登録方法を以下に示します。

// SkyWayContextを作成する const context = await SkyWayContext.Create(tokenString); // pluginのインスタンスを作成する const plugin = new SfuBotPlugin(); // SkyWayContextにpluginを登録する context.registerPlugin(plugin);

各 Plugin の詳しい使い方は各 Plugin の API リファレンスを参照してください。

カメラやマイクの切り替え

Publication の replaceStream API を使うことで、Publication の Stream を変更できます。

Stream を Publish した後に Publication の Stream を別のデバイスのカメラの Stream に入れ替える方法を以下に示します。

const devices = await SkyWayStreamFactory.enumerateInputVideoDevices(); const camera = await SkyWayStreamFactory.createCameraVideoStream({ deviceId: devices[0].id }); const publication = await person.publish(camera); const anotherCamera = await SkyWayStreamFactory.createCameraVideoStream({ deviceId: devices[1].id }); publication.replaceStream(anotherCamera);

メディア通信の状態取得(getStats)

メディア通信(WebRTC)の状態を取得する方法について説明します。

※状態取得 API の形式は今後変更される予定があります。

LocalStream

ユーザーが送信する側の Stream(LocalStream)の通信状態を取得する方法

// subscriberIdはLocalStreamを受信しているMemberのID // subscriberIdのMemberとの通信状態が取得できる const stats = await localStream.getStats(subscriberId);

RemoteStream

ユーザーが受信している Stream(RemoteStream)の通信状態を取得する方法

const stats = await remoteStream.getStats();

リモートの Member に Publication を Subscribe させる

Token の members scope を次のように設定することで、リモートの Member に任意の Publication を Subscribe させたり Unsubscribe させることができます。

const members = [ { id: "*", name: "*", actions: ["write"], publication: { actions: ["write"], }, subscription: { actions: ["write"], }, }, ];

サンプルコード

//... const person: LocalPerson = await channel.join({ name: "alice" }); const video = await SkyWayStreamFactory.createCameraVideoStream(); const publication = await localPerson.publish(video); const remoteMember = channel.members.find((member) => member.name === "bob"); const remoteSubscription = await remoteMember.subscribe(publication);

リモートのメンバーの Subscription の stream を参照することはできません(stream プロパティの中身は常に undefined になります)

一時的なネットワーク切断時のハンドリング

通話中に一時的なネットワーク切断が生じた際、JavaScript SDKは自動的に再接続処理を行います。

この時に生じる通信状態の変化を Publication.onConnectionStateChanged または Subscription.onConnectionStateChanged イベントから取得することができます。

Publicationの場合

const publication = await localMember.publish(video); publication.onConnectionStateChanged.add(({state, remoteMember}) => { // 通信状態が変化した際に実施したい処理 });

※SFU をご利用の場合はremoteMemberを取得することはできません。

Subscriptionの場合

const { stream, subscription } = await localMember.subscribe(publication.id); subscription.onConnectionStateChanged.add((state) => { // 通信状態が変化した際に実施したい処理 });

上記の例において、引数として渡される state が通信状態を示します。通信状態は以下のように変化します。

  • connected
    • 接続が完了している状態
  • reconnecting
    • 再接続処理中
  • disconnected
    • 通信が切断され、再接続処理が行われない状態

reconnecting に遷移した後、再接続が完了した場合はconnetedの状態に戻ります。 reconnecting に遷移してから一定時間内に再接続が完了しない場合は disconnected に遷移し、再接続処理は行われない状態になります。その場合は以下の項目の手順から再接続処理を行ってください。

state の持つそれ以外の状態に関しては https://javascript-sdk.api-reference.skyway.ntt.com/core/modules.html#TransportConnectionState を参照してください。

長時間ネットワークが切断された場合(onFatalError)のハンドリング

JavaScript SDK では短時間のネットワーク切断時に自動的に再接続処理を行っています。 しかし長時間ネットワークが切断されたなどの理由で onFatalError が呼ばれるとこの処理が中断されます。 再度接続を行いたい場合はアプリケーション側での実装が必要です。

onFatalError をうけて再接続を行う例を以下に示します。変数名はご自身のアプリケーションの定義で読み替えてください。

  • SkyWayContext.onFatalError を受け取った場合、以下の操作を実施する
    • SkyWayContext.dispose で SkyWay の利用を停止する
    • SkyWayContext.Create を実施して SkyWay の利用を再開する
    • SkyWayRoom.FindOrCreate で以前入っていた Room を取得する( Room ライブラリを利用している場合)
    • room.join で Room に再参加する
/* ... // 事前のroom.join処理 let context = await SkyWayContext.Create(tokenString); let room = await SkyWayRoom.FindOrCreate(context, { type: "p2p", name: "YourRoomName", }); let me = await room.join(); ... */ context.onFatalError.add(async () => { context.dispose(); context = await SkyWayContext.Create(tokenString); room = await SkyWayRoom.FindOrCreate(context, { type: "p2p", name: "YourRoomName", }); me = await room.join(); });

ログレベルの設定と種類

SkyWayContext を作成する際に、SDK が出力するログのログレベルが設定できます。

const context = await SkyWayContext.Create(tokenString, { log: { level: "debug" } });

設定可能なログレベルと説明については、JavaScript SDK リファレンスを参照してください。

アプリケーション開発時は、不具合の調査やサポートとのやり取りを円滑に行うために、ログレベルを debug に設定することをおすすめします。 アプリケーションをプロダクションで運用する際は、ログレベルを error に設定することをおすすめします。