Web コストリーミング SDK API リファレンス - ApsaraVideo Live - ApsaraVideo Live

ApsaraVideo Live Web 共同ストリーミング SDK のストリームインジェストとストリームのプル用のクラス、メソッド、イベントを一覧表示します。

基本クラス

クラス			説明
AlivcLivePusher			ストリームインジェストのクラスです。説明 window.AlivcLivePush.AlivcLivePusher からアクセスします。
AlivcLivePlayer			ストリームのプルのクラスです。説明 window.AlivcLivePush.AlivcLivePlayer からアクセスします。

AlivcLivePusher (ストリームインジェスト)

メソッドの一覧

メソッド			説明
getCameras			カメラを取得します。静的メソッドです。
getMicrophones			マイクを取得します。静的メソッドです。
getPlayoutDevices			再生デバイスを取得します。静的メソッドです。
checkSystemRequirements			WebRTC の要件を確認します。静的メソッドです。
checkScreenShareSupported			画面共有がサポートされているかを確認します。静的メソッドです。
init			ストリームインジェストのパラメータを初期化します。
destroy			ストリームインジェストのインスタンスを解放します。
startPreview			プレビューを開始します。
stopPreview			プレビューを停止します。
startPush			ストリームインジェストを開始します。
restartPush			ストリームインジェストを再開します。
reconnectPush			再接続してストリームインジェストを継続します。
stopPush			ストリームインジェストを停止します。
startMicrophone			マイクをオンにするか、別のマイクに切り替えます。
stopMicrophone			マイクをオフにします。
getCurrentMicDeviceId			マイクのデバイス ID を取得します。
startCamera			カメラをオンにするか、別のカメラに切り替えます。
stopCamera			カメラをオフにします。
getCurrentCameraDeviceId			カメラのデバイス ID を取得します。
startScreenShare			画面共有を開始します。
stopScreenShare			画面共有を停止します。
startCustomStream			カスタムセカンダリストリームのインジェストを開始します。
stopCustomStream			カスタムセカンダリストリームのインジェストを停止します。
mute			ストリームをミュートまたはミュート解除します (ストリームインジェストは停止しません)。
muteVideo			ストリームを表示または非表示にします (ストリームインジェストは停止しません)。
getLivePushStatsInfo			最後にレポートされたストリームインジェストの統計情報を取得します。
getPushUrl			インジェスト URL を取得します。
getChannelId			チャンネル ID を取得します。
getUserId			ユーザー ID を取得します。
setLiveMixTranscodingConfig			ストリームリレーとミキシングのレイアウトを更新します。
getResolution			解像度を取得します。
changeResolution			解像度を更新します。
getFps			フレームレートを取得します。
changeFps			フレームレートを更新します。
getPublishMediaStream			現在のストリームの MediaStream 情報を取得します。
getLiveTraceId			トレース ID を取得します。
updateScreenVideoProfile			画面トラックの幅、高さ、ビットレート、フレームレートを設定します。

詳細

getCameras：カメラを取得します。静的メソッドです。

/**
 * カメラを取得します。
 * @return {Promise<MediaDeviceInfo[]>}
 */
const cameras = await AlivcLivePusher.getCameras();

getMicrophones：マイクを取得します。静的メソッドです。

/**
 * マイクを取得します。
 * @return {Promise<MediaDeviceInfo[]>}
 */
const microphones = await AlivcLivePusher.getMicrophones();

getPlayoutDevices：再生デバイスを取得します。静的メソッドです。

/**
 * 再生デバイスを取得します。
 * @return {Promise<MediaDeviceInfo[]>}
 */
const playoutDevices = await AlivcLivePusher.getPlayoutDevices();

checkSystemRequirements：WebRTC の要件をチェックします。静的メソッドです。

/**
 * WebRTC の要件が満たされているかどうかをチェックします。
 * @param {('sendonly' | 'recvonly' | 'sendrecv')} [direction]
 * @return {Promise<CheckResult>}
 */
const checkResult = await AlivcLivePusher.checkSystemRequirements();
// checkResult.support: boolean; 要件が満たされているかどうかを示します。
// checkResult.detail.isBrowserSupported: boolean; ブラウザがサポートされているかどうかを示します。
// checkResult.detail.isH264DecodeSupported: boolean; H.264 デコーディングがサポートされているかどうかを示します。
// checkResult.detail.isH264EncodeSupported: boolean; H.264 エンコーディングがサポートされているかどうかを示します。
// checkResult.detail.isWebRTCSupported: boolean; WebRTC がサポートされているかどうかを示します。

checkScreenShareSupported：画面共有のサポート状況をチェックします。静的メソッドです。

/**
 * 画面共有がサポートされているかどうかをチェックします。
 * @returns {boolean}
 */
const isScreenShareSupported = AlivcLivePusher.checkScreenShareSupported();

init：RTC エンジンを初期化します。

/**
 * RTC エンジンを初期化します。
 * @param config パラメーターを設定します。すべてのパラメーターは任意です。
 * config.resolution: AlivcResolutionEnum; 解像度。
 * config.fps: AlivcFpsEnum; フレームレート。単位：フレーム/秒 (FPS)。
 * config.logLevel: LogLevel; ログレベル。デフォルト値：ERROR。
 * config.connectRetryCount: number; 再接続の最大試行回数。
 * config.audio: boolean; 音声を有効にするかどうかを指定します。
 * config.audioId: string; デフォルトの音声デバイスの ID。
 * config.video: boolean; カメラをオンにするかどうかを指定します。
 * config.cameraId: string; デフォルトのカメラのデバイス ID。
 * config.screen: boolean; 画面共有を有効にするかどうかを指定します。
 */
const pusher = new AlivcLivePusher();
pusher.init({
  resolution: AlivcResolutionEnum.RESOLUTION_720P
});

destroy：アップストリーミングインスタンスを破棄します。

// アップストリーミングインスタンスを破棄します。破棄後はインスタンスを使用できません。
pusher.destroy()

startPreview：プレビューを開始します。

/**
 * ビデオプレビューを開始します。
 * @param {string | HTMLVideoElement} elementOrId ビデオのノードまたはビデオの ID。
 * @param {boolean} secondary セカンダリストリームをプレビューするかどうかを指定します。このパラメーターは任意です。デフォルトでは、プライマリストリームのみがプレビューされます。
 * @return {Promise<MediaStream>}
 */
const stream = pusher.startPreview(elementOrId);

stopPreview：プレビューを停止します。

/**
 * ビデオプレビューを停止します。
 * @param {string | HTMLVideoElement} elementOrId ビデオのノードまたはビデオの ID。このパラメーターは任意です。このパラメーターを指定しない場合、すべてのビデオのプレビューが停止されます。
 */
pusher.stopPreview(elementOrId);

startPush：アップストリーミングを開始します。
```
/**
 * アップストリーミングを開始します。
 * @param {string} url アップストリーミング URL。例：artc://live.aliyun.com/push/....
 * @return {Promise}
 */
await pusher.startPush(url);
```
重要
共同ストリーミングに使用されるアップストリーミング URL を指定する必要があります。共同ストリーミング用の URL の生成方法については、「共同ストリーミング URL ジェネレーター」をご参照ください。

restartPush：現在のアップストリーミング URL を使用してアップストリーミングを再開します。

/**
 * 現在のアップストリーミング URL を使用してアップストリーミングを再開します。
 * @return {Promise}
 */
await pusher.restartPush();

reconnectPush：再接続してアップストリーミングを継続します。

/**
 * 再接続してアップストリーミングを継続します。
 * @param {string} url 新しいアップストリーミング URL。例：artc://live.aliyun.com/push/....
 * @return {Promise}
 */
await pusher.reconnectPush(url);

stopPush：アップストリーミングを停止します。

/**
 * アップストリーミングを停止します。
 * @return {Promise}
 */
await pusher.stopPush(url);

startMicrophone：マイクをオンにするか、別のマイクに切り替えます。

/**
 * マイクをオンにするか、別のマイクに切り替えます。
 * @param {string} deviceId マイクのデバイス ID。このパラメーターは任意です。
 * @return {Promise}
 */
await pusher.startMicrophone(deviceId);

stopMicrophone：マイクをオフにします。

/**
 * マイクをオフにします。
 * @return {Promise}
 */
await pusher.stopMicrophone();

getCurrentMicDeviceId：マイクのデバイス ID を取得します。

/**
 * マイクのデバイス ID を取得します。
 * @return {string | undefined} マイクのデバイス ID。
 */
const micId = pusher.getCurrentMicDeviceId();

startCamera：カメラをオンにするか、別のカメラに切り替えます。

/**
 * カメラをオンにするか、別のカメラに切り替えます。
 * @param {string} deviceId カメラのデバイス ID。このパラメーターは任意です。
 * @return {Promise}
 */
await pusher.startCamera(deviceId);

stopCamera：カメラをオフにします。

/**
 * カメラをオフにします。
 * @return {Promise}
 */
await pusher.stopCamera();

getCurrentCameraDeviceId：カメラのデバイス ID を取得します。

/**
 * カメラのデバイス ID を取得します。
 * @return {string | undefined} カメラのデバイス ID。
 */
const cameraId = pusher.getCurrentCameraDeviceId();

startScreenShare：画面共有を開始します。

/**
 * 画面共有を開始します。
 * @return {Promise}
 */
await pusher.startScreenShare();

stopScreenShare：画面共有を停止します。

/**
 * 画面共有を停止します。
 * @return {Promise}
 */
await pusher.stopScreenShare();

startCustomStream：カスタムセカンダリストリームのアップストリーミングを開始します。

/**
 * カスタムセカンダリストリームのアップストリーミングを開始します。
 * @param mediaStream カスタムセカンダリストリーム。
 * @return {Promise<MediaStream>}
 */
await pusher.startCustomStream(mediaStream);

stopCustomStream：カスタムセカンダリストリームのアップストリーミングを停止します。

/**
 * カスタムセカンダリストリームのアップストリーミングを停止します。
 * @return {Promise<void>}
 */
await pusher.stopCustomStream();

mute：ストリームをミュートまたはミュート解除します。（アップストリーミングは停止しません。）

/**
 * ストリームをミュートまたはミュート解除します。
 * @param {boolean} ストリームをミュートするかどうかを指定します。
 * @returns {AlivcLivePusher} メソッドチェーン用の pusher インスタンスを返します。
 */
pusher.mute(true);

muteVideo：ストリームの表示を有効または無効にします。（アップストリーミングは停止しません。）

/**
 * ストリームの表示を有効または無効にします。
 * @param mute ストリームの表示を無効にするかどうかを指定します。有効な値：true と false。
 * @returns {AlivcLivePusher} メソッドチェーン用の pusher インスタンスを返します。
 */
pusher.muteVideo(true);

getLivePushStatsInfo：最後に報告されたアップストリーミング統計を取得します。

/**
 * 最後に報告されたアップストリーミング統計を取得します。
 * @return {StatsInfo} アップストリーミング統計。
 */
const statsInfo = pusher.getLivePushStatsInfo();

getPushUrl：アップストリーミング URL を取得します。

/**
 * アップストリーミング URL を取得します。
 * @return {string | undefined} 現在のアップストリーミング URL。
 */
const url = pusher.getPushUrl();

getChannelId：チャンネル ID を取得します。

/**
 * チャンネル ID を取得します。
 * @return {string | undefined} 現在のチャンネル ID。
 */
const channelId = pusher.getChannelId();

getUserId：ユーザー ID を取得します。

/**
 * ユーザー ID を取得します。
 * @return {string | undefined} 現在のユーザー ID。
 */
const userId = pusher.getUserId();

setLiveMixTranscodingConfig：ストリームリレーとミキシングのレイアウトを更新します。

/**
 * ストリームリレーとミキシングのレイアウトを更新します。
 * @param {AlivcLiveTranscodingConfig} config このパラメーターは任意です。このパラメーターを指定しない場合、ストリームリレーとミキシングは停止されます。詳細については、AlivcLiveTranscodingConfig クラスの詳細をご確認ください。
 * @return {Promise} 操作の結果。
 */
const response = await pusher.setLiveMixTranscodingConfig(config);

getResolution：解像度を取得します。

/**
 * 解像度を取得します。
 * @return {AlivcResolutionEnum | undefined} 解像度。
 */
const resolution = pusher.getResolution();

changeResolution：解像度を更新します。

/**
 * 解像度を更新します。
 * @param resolutionEnum 使用する解像度。このパラメーターを Custom に設定した場合は、カスタム解像度を指定します。
 * @param width 幅。カスタム解像度を指定する場合に必須です。
 * @param height 高さ。カスタム解像度を指定する場合に必須です。
 * @param bitrate 最大ビットレート。
 * @return {Promise}
 */
await pusher.changeResolution(AlivcResolutionEnum.RESOLUTION_720P);

getFps：フレームレートを取得します。

/**
 * フレームレートを取得します。
 * @return {AlivcFpsEnum | undefined} 現在のフレームレート。
 */
const fps = pusher.getFps();

changeFps：フレームレートを更新します。

/**
 * フレームレートを更新します。
 * @param {AlivcFpsEnum} fps 使用するフレームレート。
 * @return {Promise}
 */
await pusher.changeFps(AlivcFpsEnum.FPS_30);

getPublishMediaStream：現在のストリームの MediaStream 情報を取得します。

/**
 * 現在のストリームの MediaStream 情報を取得します。
 * @return {MediaStream | undefined} ストリームの MediaStream 情報。
 */
const mediaStream = pusher.getPublishMediaStream();

getLiveTraceId：トレース ID を取得します。

/**
 * トレース ID を取得します。
 * @return {string} トレース ID
 */
pusher.getLiveTraceId();

updateScreenVideoProfile：画面トラックの幅、高さ、ビットレート、フレームレートを設定します。

/**
 * 画面トラックの幅、高さ、ビットレート、フレームレートを設定します。(ブラウザの制約により、指定した幅と高さは適用されません。)
 * @param width 
 * @param height 
 * @param rate 
 * @param fps 
 * @return {Promise}
 */
await pusher.updateScreenVideoProfile(width,height,rate,fps);

AlivcLiveTranscodingConfig

パラメーターの一覧

パラメーター			説明
width			中継ストリームの幅。
height			中継ストリームの高さ。
backgroundColor			16 進数形式の背景色。例： 0x000000。
cropMode			AlivcLiveTranscodingCropModeEnum AlivcLiveTranscodingCropModeCrop：クロップモード。 AlivcLiveTranscodingCropModeFill：パディングモード。
mixStreams			AlivcLiveMixStream[]：ミックス内の各ストリームのレイアウト設定。

AlivcLiveMixStream

パラメーターの一覧

パラメーター			説明
userId			ストリームミキシングに参加するユーザー ID。
x			ミクストストリームにおける X 軸オフセット (ピクセル)。
y			ミクストストリームにおける Y 軸オフセット (ピクセル)。
width			ミクストストリームにおけるビデオ画面の幅 (ピクセル)。
height			ミクストストリームにおけるビデオ画面の高さ (ピクセル)。
zOrder			レイヤー順。値が大きいほど前面に表示されます。
sourceType			ビデオソースタイプ。有効な値： 0：カメラ 1：画面共有デフォルト値：0。

AlivcLivePusher.info

イベント			説明
bye			視聴者がルームを退出しました。他の視聴者との入れ替わり、またはストリーマーによる削除が原因です。
プッシュスタティスティクス			インジェストストリームのスタティスティクスで、2 秒ごとに発生します。

サンプルコード：

pusher.info.on('bye', (_code, reason) => {
  // console.log ('ルームから退出しました。理由：${reason}');
});
pusher.info.on('pushstatistics', _stat => {
  // 統計情報を出力します。
  // console.log(_stat);
});

AlivcLivePusher.error

イベント			説明
システム			システムエラーです。
SDK			SDK 内部エラーです。

サンプルコード：

pusher.error.on('system', error => {
  // console.log(error);
});
pusher.error.on('sdk', error => {
  // console.log(error);
});

AlivcLivePusher.network

イベント			説明
connectionlost			切断されました。
networkrecovery			ネットワークが回復しました。
reconnectstart			再接続が開始されました。
reconnectfail			再接続に失敗しました。
reconnectsucceed			再接続に成功しました。

サンプルコード：

pusher.network.on('connectionlost', () => {
  // console.log ('ネットワーク例外が発生し、切断されました。');
});

AlivcLivePlayer (ストリームプル)

メソッド一覧

メソッド			説明
startPlay			オーディオとビデオの再生を開始します。
playAnotherElement			別の要素でオーディオとビデオを再生します。
stopPlay			オーディオとビデオの再生を停止します。
pauseAudioPlaying			オーディオの再生を一時停止します。
pauseVideoPlaying			ビデオの再生を一時停止します。
resumeAudioPlaying			オーディオの再生を再開します。
resumeVideoPlaying			ビデオの再生を再開します。
destroy			プレーヤーインスタンスを解放します。

詳細

startPlay：オーディオとビデオの再生を開始します。

/**
 * オーディオストリームとビデオストリームの再生を開始します。
 * @param url ストリーミング URL。例：artc://live.aliyun.com/play/...
 * @param elementOrId メディアリソースのラベルまたは ID。
 * @param secondaryElementOrId セカンダリストリームのメディアリソースのラベルまたは ID。
 * @return {Promise<AlivcLivePlayInfo>} AlivcLivePlayInfo を使用して関連イベントをリッスンできます。
 */
const playInfo = await player.startPlay(url, elementOrId, secondaryElementOrId);

重要

共同ストリーミング用のストリーミング URL を指定する必要があります。共同ストリーミング用の URL の生成方法については、「共同ストリーミング URL ジェネレーター」をご参照ください。
一般視聴者は ApsaraVideo Player SDK for Web を使用してストリームを再生できます。詳細については、「Web プレーヤーへのクイックアクセス」をご参照ください。

playAnotherElement：別の要素でオーディオとビデオを再生します。

/**
 * 別のノードでオーディオストリームとビデオストリームを再生します。
 * @param elementOrId メディアリソースのラベルまたは ID。
 * @param secondary セカンダリストリームを再生するかどうかを指定します。このパラメーターはオプションです。デフォルトでは、プライマリストリームのみが再生されます。
 */
player.playAnotherElement(elementOrId);

stopPlay：オーディオとビデオの再生を停止します。

/**
 * オーディオストリームとビデオストリームの再生を停止します。
 * @param elementOrId メディアリソースのラベルまたは ID。このパラメーターはオプションです。このパラメーターを指定しない場合、すべてのメディアリソースの再生を停止します。
 * @return {Promise} 
 */
await player.stopPlay(elementOrId);

pauseAudioPlaying：オーディオの再生を一時停止します。

/**
 * オーディオストリームの再生を一時停止します。
 */
player.pauseAudioPlaying();

pauseVideoPlaying：ビデオの再生を一時停止します。

/**
 * ビデオストリームの再生を一時停止します。
 */
player.pauseVideoPlaying();

resumeAudioPlaying：オーディオの再生を再開します。

/**
 * オーディオストリームの再生を再開します。
 */
player.resumeAudioPlaying();

resumeVideoPlaying：ビデオの再生を再開します。

/**
 * ビデオストリームの再生を再開します。
 */
player.resumeVideoPlaying();

destroy：プレーヤーインスタンスを破棄します。

/**
 * プレーヤーインスタンスを破棄します。破棄後はインスタンスを使用できません。
 */
player.destroy();

AlivcLivePlayInfo

イベント			説明
canplay			ストリームの再生が可能です。
userleft			リモートユーザーがルームを退出しました。
statistics			再生統計です。
update			リモートストリームが更新されました。

サンプルコード：

playInfo.on('statistics', _stat => {
  // console.log('統計:', _stat);
});
playInfo.on('userleft', () => {
  // console.log('リモートユーザーがルームから退出しました。');
});
playInfo.on('canplay', function () {
  // console.log('リモートストリームを再生できます。');
});
playInfo.on('update', function (previousStatus) {
  // console.log('更新前のメディアストリーム:', previousStatus.mediaStream);
  // console.log('更新前のセカンダリメディアストリーム:', previousStatus.secondaryMediaStream);
});