すべてのプロダクト
Search
ドキュメントセンター

ApsaraVideo VOD:Aliplayer API Reference

最終更新日:Sep 02, 2026

このトピックでは、Aliplayer がサポートするプロパティ、メソッド、およびイベントについて説明します。

説明

Aliplayer の使用中に問題が発生した場合は、「Web プレーヤーに関するよくある質問」または「再生エラーの自己トラブルシューティング」をご参照ください。

プロパティ

Aliplayer を初期化する際に、複数のプロパティを設定できます。これらのプロパティには、ライセンス権限付与、メディアソース情報、プレーヤー UI 設定、再生動作などが含まれます。

名前

タイプ

説明

id

文字列

プレーヤーの外部コンテナの DOM 要素 ID です。

source

文字列

URL ベースの再生を使用する場合、このプロパティで動画の URL を指定します。

説明
  • URL ベースの再生は最も高い優先度を持ちます。VidAuth や VidSts などの他の再生方法をオーバーライドします。`source` を設定すると、VidAuth や VidSts も設定していても、プレーヤーはその URL を使用します。再生方法は 1 つだけ使用してください。

  • URL ベースの再生は複数の解像度をサポートしています。このプロパティを使用して、各解像度の URL を指定します。詳細については、「複数解像度の再生」をご参照ください。例:

    source: '{"HD":"address1","SD":"address2"}'

vid

文字列

ApsaraVideo Media Processing サービスのメディア ID です。

playauth

文字列

再生認証情報です。再生認証情報の取得方法については、「再生認証情報の取得」をご参照ください。

customVodServer

文字列

VOD プロキシ用のカスタムドメインです (VidAuth 再生モードのバージョン 2.32.0 以降でサポート)。専用のリクエストプロキシサービスをデプロイする必要があります。デフォルトの VOD ドメイン (*.aliyuncs.com) が到達不能な場合、プレーヤーは自動的にプロキシサービスにフォールバックします。これにより、ISP ハイジャックを回避し、再生の安定性と成功率を向上させます。

playConfig

JSON

Vid (VidAuth または VidSts) で再生する際に使用するカスタム設定です。これらは VOD API に渡されます。サポートされているフィールドとパラメーターの説明については、「メディア再生のためのカスタム PlayConfig 設定」をご参照ください。値の例:

{"PlayDomain":"vod.test_domain","PreviewTime":"20","MtsHlsUriToken":"yqCD7******oVjslp5Q"}

authTimeout

数値

Vid (VidAuth または VidSts) を使用して取得した動画再生 URL の有効期間です。単位:秒。デフォルト:7200。

再生が終了する前に再生 URL が有効期限切れになるのを防ぐため、この値が実際の動画の長さを超えるようにしてください。

height

文字列

プレーヤーの高さ。有効な値:

  • 100%

  • 100px

width

文字列

プレーヤーの幅。有効な値:

  • 100%

  • 100px

autoSize

ブール値 | 文字列

動画コンテンツに合わせてプレーヤーのサイズを自動的に調整します。有効な値:'height' または 'width'。

例:width: '500px' と autoSize: 'height' を設定します。プレーヤーは 500px の固定幅を維持し、動画のアスペクト比に基づいて高さを調整します。

または、height: '500px' と autoSize: 'width' を設定します。プレーヤーは 500px の固定高さを維持し、動画のアスペクト比に基づいて幅を調整します。

注:autoSize: true は autoSize: 'height' と同等です。高さの自動サイズ調整がデフォルトです。

videoWidth

文字列

動画の幅。詳細については、「表示モードの設定」をご参照ください。

videoHeight

文字列

動画の高さ。詳細については、「表示モードの設定」をご参照ください。

preload

ブール値

プレーヤーが自動的にロードします。

cover

文字列

プレーヤーのデフォルトのカバー画像です。有効な画像 URL を入力してください。この設定は、autoplay が false に設定されている場合にのみ有効です。

isLive

ブール値

コンテンツがライブストリーミングであるかどうかを示します。有効にすると、ユーザーはプログレスバーをドラッグできません。デフォルト:false。ライブストリームの場合は true に設定します。

autoplay

ブール値

プレーヤーの自動再生を有効にします。モバイルデバイスでは自動再生は失敗します。有効な値:

  • true (デフォルト):自動再生を有効にします。

  • false:自動再生を無効にします。

説明

ブラウザの制限により、Web プレーヤー SDK で自動再生が失敗する場合があります。詳細については、「高度な機能」をご参照ください。

autoplayPolicy

オブジェクト

プレーヤーは、ミュート自動再生のための適応ポリシーをサポートしています。このプロパティは、autoplay が true に設定されている場合にのみ有効です。設定例は次のとおりです:

autoplayPolicy: {
  fallbackToMute: true, // 音声付き自動再生が失敗した場合、ミュート自動再生にフォールバックします。デフォルト:false。
  showUnmuteBtn: true, // ミュート自動再生がアクティブな場合、大きなミュート解除ボタンを表示します。デフォルト:true。
}
説明
  • ミュート自動再生が成功すると、mutedAutoplay イベントがトリガーされます。

  • プレーヤーが自動再生を有効にし ( autoplay パラメーターが true に設定)、適応型ミュート自動再生を有効にする ( autoplayPolicy.fallbackToMute パラメーターが true に設定) と、プレーヤーはまず音声付き自動再生を試みます。この試行が失敗した場合、ミュート自動再生にフォールバックします。ミュート自動再生が必ず成功するとは限りません。

rePlay

ブール値

自動ループ再生を有効にします。

useH5Prism

ブール値

HTML5 プレーヤーを使用します。

playsinline

ブール値

HTML5 のインライン再生を有効にします。一部の Android ブラウザではサポートされていません。

skinRes

Url

スキン画像の URL。このフィールドの変更は推奨されません。スキンをカスタマイズするには、「プレーヤーのスキンのカスタマイズ」をご参照ください。

skinLayout

配列 | ブール値

UI コンポーネントのレイアウトを構成します。このプロパティを省略すると、デフォルトのレイアウトが使用されます。false に設定すると、すべての UI コンポーネントが非表示になります。詳細については、「skinLayout プロパティの設定」をご参照ください。

skinLayoutIgnore

配列

非表示にする UI コンポーネントのリスト。コンポーネント名については、「VOD コンポーネントのパラメーターリファレンス」をご参照ください。設定例:

skinLayoutIgnore: [
  'bigPlayButton', // 大きな再生ボタンを非表示にする
  'controlBar.fullScreenButton' // コントロールバーの全画面表示ボタンを非表示にする (ネストされたコンポーネントにはドット表記を使用)
]
説明

skinLayoutIgnore は skinLayout よりも優先されます。

controlBarVisibility

文字列

コントロールパネルの実装。有効な値は次のとおりです:

  • click:プレーヤーエリアをクリックできます。

  • hover (デフォルト):ユーザーがプレーヤーエリアにカーソルを合わせると表示されます。

  • always:常にコントロールバーを表示します。

  • Never:コントロールパネル全体を非表示にします。

showBarTime

数値

コントロールバーが自動的に非表示になるまでの時間 (ミリ秒)。

enableSystemMenu

ブール値

システムの右クリックメニューを有効にします。デフォルト:false。

format

文字列

再生 URL のフォーマットを指定します。有効な値:

  • mp4

  • hls または m3u8

  • flv

  • mp3

デフォルト:空。

mediaType

文字列

音声または動画を返すかを指定します。vid ベースの再生を使用する場合にのみサポートされます。デフォルト:video。有効な値:

  • video:動画。

  • audio:音声のみを含む MP4 ファイルなどの音声のみのフォーマット。

qualitySort

文字列

ソート順を指定します。Vid + PlayAuth 再生を使用する場合にのみサポートされます。有効な値:

  • desc:降順 (大きいものから小さいものへ) でソートします。

  • asc:昇順 (小さいものから大きいものへ) でソートします。

デフォルト:asc。

definition

文字列

表示する動画の解像度を定義します。複数の解像度はカンマ (,) で区切ります。例:'FD,LD'。これは、指定された vid で利用可能な解像度のサブセットです。有効な値:

  • FD (低解像度)

  • LD (標準解像度)

  • HD (高解像度)

  • HD (超高解像度)

  • OD (オリジナル品質)

  • 2K (2K)

  • 4K (4K)

defaultDefinition

文字列

デフォルトの動画解像度を設定します。これは、指定された vid で利用可能な解像度のいずれかである必要があります。有効な値:

  • FD (低解像度)

  • LD (標準解像度)

  • SD (標準解像度)

  • HD (超高解像度)

  • OD (オリジナル品質)

  • 2K (2K)

  • 4K (4K)

autoPlayDelay

数値

再生が開始されるまでの遅延時間。単位:秒。

language

文字列

国際化のための言語を設定します。デフォルト:zh-cn。省略した場合、ブラウザの言語が使用されます。有効な値:

  • zh-cn:中国語

  • en-us:英語

languageTexts

JSON

JSON 形式のカスタム国際化テキスト。キーは language プロパティの値と一致する必要があります。例:{jp:{Play:"Play"}}。キーの完全なリストについては、「JSON 構造」をご参照ください。

snapshotWatermark

オブジェクト

HTML5 プレーヤーのスクリーンショットのウォーターマークを構成します。

useHlsPluginForSafari

ブール値

Safari 11 を除く Safari ブラウザで HLS プラグインを有効にします。有効な値:

  • true:有効にします。

  • false (デフォルト):無効にします。

enableStashBufferForFlv

ブール値

HTML5 プレーヤーで FLV の再生キャッシュを有効にします。ライブストリーミングにのみ適用されます。有効な値:

  • true (デフォルト):有効にします。

  • false:無効にします。

stashInitialSizeForFlv

数値

HTML5 プレーヤーでの FLV の初期キャッシュサイズ。ライブストリーミングにのみ適用されます。デフォルト:32 KB。

値を小さくすると起動速度が向上します。ただし、小さすぎると、短時間で再生がコマ落ちする可能性があります。

loadDataTimeout

数値

バッファリングが原因で、より低い解像度に切り替えるようユーザーに促すまでの時間 (秒)。デフォルト:20。

waitingTimeout

数値

最大バッファリングタイムアウト。この時間を超えるとエラーメッセージが表示されます。単位:秒。デフォルト:60。

diagnosisButtonVisible

ブール値

診断ボタンを表示します。有効な値:

  • true (デフォルト):ボタンを表示します。

  • false:ボタンを非表示にします。

disableSeek

ブール値

プログレスバーでのシークを無効にします。有効な値:

  • true:無効にします。

  • false (デフォルト):無効にしません。

encryptType

数値

Alibaba Cloud 動画暗号化 (プライベート暗号化) を有効にします。デフォルト:0。有効な値:

  • 0:暗号化されていない動画を再生します。

  • 1:プライベート暗号化された動画を再生します。

説明
  • プライベート暗号化では VID + Playauth を使用します。

  • 標準 Web 暗号化の場合は、URL ベースの再生を使用します。「暗号化された動画の再生」をご参照ください。

progressMarkers

配列

プログレスマーカーオブジェクトの配列。

vodRetry

数値

VOD 再生失敗時のリトライ回数。デフォルト:3。

liveRetry

数値

ライブストリーミング再生失敗時のリトライ回数。デフォルト:5。

hlsFrameChasing

ブール値

HLS ライブストリーミングのフレーム追跡を有効にします。有効な値:

  • true:フレーム追跡を有効にします。

  • false (デフォルト):フレーム追跡を無効にします。

説明

このパラメーターの設定は、Web プレーヤー SDK バージョン 2.21.0 より前のバージョンでのみサポートされています。バージョン 2.21.0 以降で HLS ライブストリーミングモードでフレーム同期を有効にするには、hlsOption.maxLiveSyncPlaybackRate プロパティをご参照ください。

chasingFirstParagraph

数値

最初のフレーム追跡セグメントの持続時間。単位:秒。デフォルト:20。

説明

このパラメーターは、Web プレーヤー SDK バージョン 2.21.0 より前のバージョンでのみ設定できます。バージョン 2.21.0 以降で HLS ライブストリーミングモードでフレーム同期を設定するには、hlsOption.maxLiveSyncPlaybackRate プロパティをご参照ください。

chasingSecondParagraph

数値

2 番目のフレーム追跡セグメントの持続時間。単位:秒。デフォルト:40。

説明

このパラメーターの設定は、Web プレーヤー SDK バージョン 2.21.0 より前のバージョンでのみサポートされています。バージョン 2.21.0 以降で HLS ライブストリーミングモードでフレーム同期を設定するには、hlsOption.maxLiveSyncPlaybackRate プロパティをご参照ください。

chasingFirstSpeed

数値

最初のフレーム追跡セグメントの再生速度。デフォルト:1.1 倍。

説明

このパラメーターの設定は、Web プレーヤー SDK バージョン 2.21.0 より前のバージョンでのみサポートされています。バージョン 2.21.0 以降で HLS ライブストリーミングモードでフレーム同期を設定するには、hlsOption.maxLiveSyncPlaybackRate プロパティをご参照ください。

chasingSecondSpeed

数値

2 番目のフレーム追跡セグメントの再生速度。デフォルト:1.2 倍。

説明

このパラメーターの設定は、Web プレーヤー SDK バージョン 2.21.0 未満でのみサポートされています。バージョン 2.21.0 以降で HLS ライブストリーミングモードでフレーム同期を設定するには、hlsOption.maxLiveSyncPlaybackRate プロパティをご参照ください。

hlsOption.maxLiveSyncPlaybackRate

数値

HLS ライブストリーミングでのフレーム追跡の再生速度を設定します。デフォルト:1 (フレーム追跡なし)。

  • 設定例:

    hlsOption: {
      maxLiveSyncPlaybackRate: 1.5, // フレーム追跡の再生速度を設定
      liveSyncDurationCount: 3 // フレーム追跡をトリガーするセグメント数を設定
    }
  • 例の意味:ライブストリーミングの遅延が 3 セグメントの持続時間を超えると、プレーヤーは 1.5 倍速で再生し、3 セグメント遅れに追いつきます (プレーヤーはネットワークの変動を処理するためにバッファーが必要なため、liveSyncDurationCount の値を変更する際は注意が必要です — この値を低く設定しすぎるとコマ落ちが発生する可能性があります)。

説明

このパラメーターは、Web プレーヤー SDK バージョン 2.21.0 以降でのみサポートされています。

flvFrameChasing

ブール値

FLV ライブストリーミングのフレーム追跡を有効にします。有効な値:

  • true:フレーム追跡を有効にします。

  • false:フレーム追跡を無効にします。

デフォルト:false。

keyShortCuts

ブール値

キーボードショートカットを有効にします。有効な値:

  • true:キーボードショートカットを有効にします。

  • false:キーボードショートカットを無効にします。

デフォルト:false。

説明

矢印キー (左/右) は早送りと巻き戻しを制御します。矢印キー (上/下) は音量を制御します。スペースバーは再生/一時停止を切り替えます。

keyFastForwardStep

数値

早送りと巻き戻しの時間間隔。単位:秒。デフォルト:10。

rtsFallback

ブール値

ブラウザが RTS をサポートしていない場合、または RTS ストリームの取得に失敗した場合、プレーヤーは自動的に FLV または HLS にフォールバックします。低遅延のため FLV を優先します。ブラウザが FLV をサポートしていない場合は、HLS にフォールバックします。

この機能はデフォルトで有効になっています。無効にするには、このパラメーターを false に設定します。

rtsFallbackType

文字列

RTS からフォールバックするプロトコルを指定します。有効な値:HLS または FLV。デフォルトでは、プレーヤーは自動的に選択し、低遅延のため FLV を優先します。ブラウザが FLV をサポートしていない場合は、HLS にフォールバックします。

rtsFallbackSource

文字列

プレーヤーのデフォルトのフォールバック戦略を使用することをお勧めします。ただし、フォールバック用に固定のストリーム URL を指定したい場合は、このパラメーターを使用します。

traceId

文字列

一意のユーザー識別子です。この値をパブリックなイベントトラッキングポイントに渡して、ログレポートを追跡します。デフォルトでは、Web プレーヤー SDK はログレポートを有効にします。traceId を渡すことで、ユーザーを識別するのに役立ちます。省略した場合、Web プレーヤー SDK は UUID を生成し、ブラウザキャッシュに保存します。

説明

Web プレーヤー SDK バージョン 2.10.0 以降でサポートされています。

textTracks

配列

外部 WebVTT 字幕を構成します。例:

textTracks: [
  { kind: 'subtitles', label: 'Chinese', src: 'caption-url', srclang: 'zh-CN', default: true },
  { kind: 'subtitles', label: 'English (US)', src: 'caption-url', srclang: 'en-US' }
],

フィールドの説明:

  • kind:字幕の種類。有効な値:subtitles または captions。

  • label:UI に表示される字幕名。

  • srclang:字幕の言語。

  • src:字幕の URL。クロスオリジンアクセスが許可されている必要があります。

  • default:true に設定すると、この字幕がデフォルトで表示されます。Web プレーヤー SDK バージョン 2.15.7 以降でサポートされています。

説明
  • Web プレーヤー SDK バージョン 2.12.0 以降でサポートされています。

  • 外部 WebVTT 字幕は、以下のブラウザではサポートされていません:

    • Internet Explorer

    • Android 版 QQ ブラウザ、OPPO/OnePlus システムブラウザ

    • 動画タグをハイジャックするその他のブラウザ

  • 字幕属性の詳細な説明については、HTML 仕様をご参照ください。

  • 高度な字幕設定については、「外部字幕」をご参照ください。

ratio

数値

プレーヤーを固定のアスペクト比でスケーリングするように設定します。たとえば、動画のアスペクト比が 16:9 の場合、プレーヤーのパラメーターを width: "100%", ratio: 16/9 に設定します。これにより、プレーヤーのアスペクト比が動画コンテンツと一致し、ページのスケーリングに応じて自動的に比例してスケーリングされます。

extLanguageTexts

オブジェクト

Web プレーヤー SDK には、中国語と英語の UI テキストが組み込まれています。このプロパティを使用して、特定の UI 要素のテキストをカスタマイズします。たとえば、HD の表示を高解像度から1080pに変更するには、次のようにします:

extLanguageTexts: {
    'zh-cn': {
      'HD': '1080p'
    }
}

speedLevels

配列

再生速度リストをカスタマイズします。各オブジェクトには、キー (速度の値) とテキスト (UI ラベル) が含まれます。省略した場合、デフォルトのリストが使用されます。例:

speedLevels: [
  {"key": 0.25, "text": "0.25"},
  {"key": 0.5, "text": "0.5"},
  {"key": 1, "text": "Normal"},
  {"key": 1.25, "text": "1.25"},
  {"key": 1.5, "text": "1.5"},
  {"key": 2,"text": "2"}
]

logo

配列

カスタムロゴ画像を設定します。例:

    logo: [{
      width: 30,
      position: 'bottom-right',
      origin: 'content',
      src: 'a.png'
    },
    {
      width: 20,
      position: 'bottom-right',
      offsetY: -20,
      origin: 'content',
      src: 'b.png'
    }]

フィールドの説明:

  • src:ロゴ画像の URL。

  • origin:位置決めの基準点。有効な値:

    • box:プレーヤーコンテナ

    • content:動画コンテンツ

  • width/height:ロゴのディメンション (origin に対するパーセンテージで計算)。一方のディメンションのみが指定された場合、もう一方は比例してスケーリングされます。

  • position:origin 内の相対位置。有効な値:

    • top-left:左上隅

    • top-right:右上隅

    • bottom-left:左下隅

    • bottom-right:右下隅

  • offsetX/offsetY:position からのオフセット (origin に対するパーセンテージで計算)。

license

オブジェクト

再生品質モニタリング (レガシー)、シングルポイントトラブルシューティング、H.265/H.266 動画再生などの付加価値機能を使用するには、まずWeb プレーヤー SDK 付加価値サービス申込書を提出してライセンスを取得します。その後、次のようにライセンスを統合します:

// domain はライセンス申請時に入力したドメインです。
// key はライセンスキーです。
license: {
    domain: "example.com",
    key: "example-key"
  }

mute

ブール値

ミュート再生を有効にします。ブラウザが自動再生をブロックする場合にミュート自動再生を有効にするには、このパラメーターを設定します。詳細については、「高度な機能」をご参照ください。

clickPause

ブール値

動画エリアをクリックして再生を一時停止または再開します。

  • true:有効にします。

  • false:無効にします。

デフォルト:デスクトップでは true、モバイルでは false。インタラクションの競合を避けるため、dbClickSkip と一緒に使用しないでください。

disablePip

ブール値

ブラウザのネイティブのピクチャーインピクチャー (PiP) ボタンを非表示にします。

説明
  • Web プレーヤー SDK バージョン 2.20.0 以降でサポートされています。

  • Firefox バージョン 116 以降でサポートされています。

env

文字列

デフォルトでは、プレーヤーのテレメトリデータは中国のデータセンターにアップロードされます。中国以外のデータに関するコンプライアンス要件がある場合は、env: 'SEA' を設定してデータをシンガポールのデータセンターにアップロードします。

watchStartTime

数値

単独で使用して、再生の開始時刻を設定します。

watchEndTime と一緒に使用して、時間範囲再生を有効にします。ユーザーは指定された時間範囲内でのみ再生およびシークができます。

単位:秒

watchEndTime

数値

watchStartTime と一緒に使用して、時間範囲再生を有効にします。ユーザーは指定された時間範囲内でのみ再生およびシークができます。

この値が watchStartTime より小さい場合、watchStartTime は無視されます。

単位:秒

start

数値

end と一緒に使用して、動画からセグメントを抽出します。たとえば、元の動画が 60 秒で、start: 10 と end: 30 を設定した場合、プレーヤーは元の動画の 10 秒目から始まる 20 秒の動画を表示します。

end

数値

start と一緒に使用して、動画からセグメントを抽出します。たとえば、元の動画が 60 秒で、start: 10 と end: 30 を設定した場合、プレーヤーは元の動画の 10 秒目から始まる 20 秒の動画を表示します。

dbClickFullscreen

ブール値

ダブルクリックで全画面表示に入る機能を有効にします。デスクトップではデフォルトで有効です。

longPressFastForward

ブール値

長押しによる早送りを有効にします (モバイルのみ)。有効な値:

  • true (デフォルト):有効にします。

  • false:無効にします。

dbClickSkip

ブール値

左側をダブルクリックして巻き戻し、右側をダブルクリックして早送りします (モバイルのみ)。有効な値:

  • true (デフォルト):有効にします。

  • false:無効にします。

インタラクションの競合を避けるため、clickPause と一緒に使用しないでください。

enableMockFullscreen

ブール値

CSS ベースの疑似フルスクリーンを有効にします。デフォルトでは、プレーヤーはブラウザの fullscreen API を呼び出します。iOS および一部の Android ブラウザでは、システムプレーヤーが全画面表示を引き継ぎ、UI の問題が発生します。このパラメーターを有効にすると、引き継ぎを回避できます。デフォルト:false。

watermark

オブジェクト

動的ウォーターマークを設定します。例:

watermark: {
  enable: true,
  text: 'Copyright ©2026',
  mode: 'BULLET'
}

フィールドの説明:

  • enable:動的ウォーターマークを有効にします。

  • text:ウォーターマークとして表示するテキスト。

  • mode:ウォーターマークのモード。有効な値:

    • BULLET:マーキー (デフォルト)。

    • GHOST:ランダム点滅。

  • direction:移動方向。有効な値:

    • RTL:右から左 (デフォルト)。

    • LTR:左から右。

    • STATIC:静止 (GHOST モードでのみ有効)。

  • speed:移動速度。範囲:0~100。値が大きいほど速く移動します。デフォルト:BULLET は 50、GHOST は 30。

  • interval:ウォーターマークが消えてから再表示されるまでの時間 (ミリ秒)。デフォルト:3000。

  • duration:各ウォーターマーク表示の持続時間 (GHOST モードのみ)。デフォルト:5000 (ミリ秒)。

  • opacity:ウォーターマークテキストの透明度。範囲:0~1。デフォルト:0.5。

  • fontSize:ウォーターマークテキストのフォントサイズ。CSS の font-size 値。デフォルト:14px。

  • fontColor:ウォーターマークテキストの色。有効な CSS カラー値。デフォルト:#FFFFFF。

  • top:コンテナの上部からウォーターマークエリアまでの距離。ピクセル値 (例:50) またはパーセンテージ (例:'20%') をサポートします。

  • bottom:コンテナの下部からウォーターマークエリアまでの距離。ピクセル値またはパーセンテージをサポートします。

  • left:コンテナの左側からウォーターマークエリアまでの距離。ピクセル値またはパーセンテージをサポートします (GHOST モードのみ)。

  • right:コンテナの右側からウォーターマークエリアまでの距離。ピクセル値またはパーセンテージをサポートします (GHOST モードのみ)。

memoryPlay

オブジェクト

再生再開を有効にするには、プレーヤー設定に memoryPlay オプションを追加します。例:

// 再生再開の設定
memoryPlay: {
    enable: true, // 再生再開を有効にする
    autoSeek: false // 記憶した位置に自動的にジャンプする
}

フィールドの説明:

  • enable:再生再開を有効にします。有効な値:

    • false (デフォルト):再生再開を無効にします。

    • true:再生再開を有効にします。

  • autoSeek:記憶した位置に自動的にジャンプします。有効な値:

    • false (デフォルト):ジャンプするかどうかをユーザーに尋ねるプロンプトを表示します (推奨)。

    • true:記憶した位置にジャンプし、動画がロードされた後にプロンプトを表示します。

getTimeFunction/saveTimeFunction は、カスタム再生進捗制御が必要なシナリオ (複数デバイス同期など) で使用されます。省略した場合、プレーヤーはデフォルトで進捗を localStorage に保存します。

  • getTimeFunction:カスタムストレージ場所から記憶した時間を取得します。関数シグネチャ:(videoKey) => number|Promise<number>。

  • saveTimeFunction:現在の再生時間を保存します。関数シグネチャ:(videoKey, currentTime) => void。

menuMode

文字列

再生速度、解像度、字幕、オーディオトラックのコントロールを表示する場所を設定します。有効な値:

  • fold (デフォルト):設定サブメニューに配置します。

  • expand:コントロールバー (メインメニュー) に表示します。

refreshUrl

(expiredUrl: string) => Promise<string>

URL の有効期限が切れると自動的にリフレッシュします。再生中に CDN 署名付き URL の有効期限が切れた場合 (HTTP 403 レスポンスヘッダーに有効期限切れのタイムスタンプが含まれる)、サービスコールバックが自動的に呼び出され、新しい URL を取得して再生を再開し、URL は最大 3 回リトライされます。現在有効期限が切れた再生アドレスを受け取り、新しい利用可能なアドレスに解決する Promise を返します。設定されていない場合、この機能は有効になりません。例は次のとおりです:

new Aliplayer({
  source: 'YOUR_SOURCE_URL',
  refreshUrl: async (expiredUrl) => {
      // await fetch new url ...
      return 'NEW_URL'
  }
});

メソッド

これらのメソッドは、ready イベントが発生した後、またはプレーヤー作成時の ready コールバックで呼び出すことができます。例:

// メソッド 1:
var player = new Aliplayer({}, function (player) {
  player.play();
});

// メソッド 2:
var player = new Aliplayer({});
function handleReady(player) {
  player.play();
};
player.on('ready', handleReady);

Aliplayer インスタンスで利用可能なメソッド:

play()

再生を開始します。

関数定義

() => Player

pause()

再生を一時停止します。

(showPlayButton?: boolean) => Player

パラメーター

名前

タイプ

必須

説明

showPlayButton

ブール値

いいえ

再生ボタンを表示します。

replay()

再生を再開します。

関数定義

() => Player

seek()

指定した時間にジャンプします。

関数定義

(time: number) => Player 

パラメーター

名前

タイプ

必須

説明

time

数値

はい

ジャンプする時間。単位:秒。

dispose()

プレーヤーを破棄します。

関数定義

() => void

getCurrentTime()

現在の再生時間を取得します。単位は秒です。

関数定義

() => number

getDuration()

動画の総再生時間を取得します。単位は秒です。このメソッドは、動画がロードされた後、または play イベントの後に呼び出すことができます。

関数定義

() => number

getVolume()

現在の音量を取得します。0 から 1 までの実数を返します。iOS および一部の Android デバイスではサポートされていません。

関数定義

() => number | undefined

setVolume()

音量を設定します。

関数定義

(volume: number) => void

パラメーター

名前

タイプ

必須

説明

volume

数値

はい

0 から 1 までの実数としての音量。iOS および一部の Android デバイスではサポートされていません。

mute()

再生をミュートします。

関数定義

(quiet?: boolean) => Player

パラメーター

名前

タイプ

必須

説明

quiet

boolean

いいえ

左下隅のミュート/ミュート解除ステータステキストを非表示にします。

unMute()

再生のミュートを解除します。

関数定義

(quiet?: boolean) => Player

パラメーター

名前

タイプ

必須

説明

quiet

boolean

いいえ

ミュートを解除したときに左下隅のテキストプロンプトを非表示にするかどうか。

getPlayTime()

実際の再生時間 (一時停止時間を除く) を取得します。可変速再生の場合、これは実際に経過した時間を返します。単位は秒です。

関数定義

() => number

loadByUrl()

別の動画に切り替えます。MP4、HLS、FLV など、同じフォーマットの動画間での切り替えのみをサポートします。異なるフォーマット間で切り替えるには、プレーヤーを破棄して新しいインスタンスを作成する必要があります。

関数定義

(url: string, seconds?: number, autoPlay?: boolean) => void

パラメーター

名前

タイプ

必須

説明

url

string

はい

切り替える動画の URL。

seconds

number

いいえ

切り替え後の再生開始時刻。

autoPlay

boolean

いいえ

切り替え後に自動的に再生を開始します。

replayByVidAndPlayAuth()

別の VOD 動画に切り替えます。同じフォーマットの動画間での切り替えのみをサポートします。

関数定義

(vid: string, playauth: string) => void

パラメーター

名前

タイプ

必須

説明

vid

string

はい

動画 ID。

playauth

string

はい

再生認証情報。

replayByVidAndAuthInfo()

別の MPS 動画に切り替えます。同じフォーマットの動画間での切り替えのみをサポートします。

関数定義

(vid: string, accId: string, accSecret: string, stsToken: string, authInfo: string, domainRegion: string) => void

パラメーターの詳細については、「MPS 再生」をご参照ください。

replayByMediaAuth()

別のユニバーサルメディアサービス動画に切り替えます。同じフォーマットの動画間での切り替えのみをサポートします。

関数定義

(mediaAuth: string) => void

パラメーター

名前

タイプ

必須

説明

mediaAuth

string

はい

再生認証情報。

getBuildInComponent()

組み込みの UI コンポーネント (全画面表示ボタンやプログレスバーなど) を取得します。

関数定義

(name: string) => BuildInComponent;

パラメーター

名前

タイプ

必須

説明

name

string

はい

組み込みコンポーネント名 (例:fullScreenButton)。コンポーネント名のリストについては、「skinLayout プロパティの設定」をご参照ください。各コンポーネントは hide および show メソッドをサポートしています。

setPlayerSize()

プレーヤーのサイズを設定します。

関数定義

(width: string, height: string) => void

パラメーター

名前

タイプ

必須

説明

width

string

はい

プレーヤーのサイズを設定します。有効な値:

  • 400px

  • 60%

height

string

はい

setSpeed()

再生速度を手動で設定します。モバイルデバイス (Android の WeChat など) では機能しない場合があります。速度コントロールはデフォルトで有効になっています。

関数定義

(speed: number) => void

パラメーター

名前

パラメータータイプ

必須

説明

speed

number

はい

0.5 倍から 2 倍までの再生速度をサポートします。

説明

速度コントロールを無効にするには:

  • 速度コントロールを個別に無効化またはカスタマイズすることはできません。グローバルに無効化する必要があります。

  • CSS オーバーライドで速度コントロールを無効にするには:

    .prism-setting-speed {
       display: none !important;
     }

setTraceId()

ログを追跡するための共通のイベントトラッキングを渡します。

関数定義

(traceId: string) => void

パラメーター

名前

タイプ

必須

説明

traceId

string

はい

一意の識別子。

説明

Web プレーヤー SDK バージョン 2.10.0 以降でサポートされています。

setSanpshotProperties()

スクリーンショットの設定を構成します。

関数定義

(width: number, height: number, rate: number) => void

パラメーター

名前

タイプ

必須

説明

width

number

はい

幅と高さの単位:ピクセル。スクリーンショットの品質範囲:0~1 (デフォルト:1)。詳細については、「動画のスクリーンショット」をご参照ください。

height

number

はい

rate

number

はい

fullscreenService.requestFullScreen()

全画面表示にします。

関数定義

() => Player

fullscreenService.cancelFullScreen()

全画面表示を終了します。iOS ではサポートされていません。

関数定義

() => Player

fullscreenService.getIsFullScreen()

全画面表示の状態を取得します。

関数定義

() => boolean

getStatus()

プレーヤーの状態を取得します。文字列を返します。例:

  • init:初期化中。

  • ready:準備完了。

  • loading:ロード中。

  • play:再生中。

  • pause:一時停止。

  • playing:再生中。

  • waiting:バッファリング中。

  • error:エラー。

  • ended:終了。

関数定義

() => string

liveShiftSerivce.setLiveTimeRange()

ライブストリーミングの開始時刻と終了時刻を設定します。これを使用してタイムシフトを有効にします。

関数定義

(start: string, end: string) => void

パラメーター

名前

タイプ

必須

説明

start

string

はい

ライブストリーミングの開始時刻。

end

string

はい

ライブストリーミングの終了時刻。

例

player.liveShiftSerivce.setLiveTimeRange('2025/03/21 12:43:00', '2025/03/21 23:31:00')

setRotate()

プレーヤーの回転角度を設定します。

関数定義

(rotate: number) => void

パラメーター

名前

タイプ

必須

説明

rotate

number

はい

正の値は時計回りに回転します。負の値は反時計回りに回転します。例:setRotate(90)。詳細については、「表示モードの設定」をご参照ください。

getRotate()

プレーヤーの回転角度を取得します。

関数定義

() => number

詳細については、「表示モードの設定」をご参照ください。

setImage()

ミラーリングを適用します。

関数定義

(type: string) => void

パラメーター

名前

タイプ

必須

説明

type

string

はい

有効な値:

  • horizon:水平反転。

  • Vertical:垂直方向を指します。

例:setImage('horizon')。詳細については、「表示モードの設定」をご参照ください。

setCover()

カバー画像を設定します。

関数定義

(coverUrl: string) => void

パラメーター

名前

タイプ

必須

説明

coverUrl

string

はい

サムネイル URL。

setProgressMarkers()

プログレスマーカーを設定します。

関数定義

(markers: Array<{ time: number, text: string }>) => void

パラメーター

名前

タイプ

必須

説明

markers

Array<markers>

はい

markers:マーカーオブジェクトの配列 (必須)。

marker.time:マーカーの時間 (必須)。

marker.text:マーカーのテキストラベル (必須)。

詳細については、パラメーター progressMarkers をご参照ください。

setPreviewTime()

プレビュー時間を設定します。

関数定義

(time: number) => void

パラメーター

名前

タイプ

必須

説明

time

number

はい

単位:秒。詳細については、「プレビュー」をご参照ください。

getPreviewTime()

プレビュー時間を取得します。

関数定義

() => number

isPreview()

プレビューモードがアクティブかどうかを確認します。

関数定義

() => boolean

getCurrentPDT()

HLS ビデオストリームの現在の ProgramDateTime を取得します。

関数定義

() => number | undefined

setTextTracks()

WebVTT 字幕の配列を設定します。

関数定義

(textTracks: Array<{ kind: string, label: string, src: string, srclang: string }>) => void

パラメーター

名前

タイプ

必須

説明

textTracks

Array<object>

はい

例:

player.setTextTracks([ { kind: 'subtitles', label: 'Chinese', src: 'caption-url', srclang: 'zh-CN' },{ kind: 'subtitles', label: 'English (US)', src: 'caption-url', srclang: 'en-US' }])
説明

Web プレーヤー SDK バージョン 2.12.0 以降でサポートされています。

setLogo()

カスタムロゴ画像を設定します。

関数定義

(logoList: Array<{ width: number, position: string, origin: string, src: string }>) => void

パラメーター

名前

タイプ

必須

説明

logoList

Array<object>

はい

例:

player.setLogo([{
      width: 30,
      position: 'bottom-right',
      origin: 'content',
      src: 'a.jpg'
    },
    {
      width: 20,
      position: 'bottom-right',
      offsetY: -20,
      origin: 'content',
      src: 'b.jpg'
    }])

フィールドの説明については、プロパティ:logo をご参照ください。

setWatchTime()

現在の動画の watchStartTime/watchEndTime を動的に更新します。

関数定義

(start: number, end: number) => void

パラメーター

名前

タイプ

必須

説明

start

string

はい

開始時刻。

end

string

はい

終了時刻。

setNextWatchTime()

次の動画の watchStartTime/watchEndTime を設定します。loadByUrl または replayByVidAndPlayAuth を使用して動画を切り替える場合で、次の動画の時間範囲が現在の動画と異なる場合は、最初に setNextWatchTime を呼び出す必要があります。

関数定義

(start: number, end: number) => void

パラメーター

名前

タイプ

必須

説明

start

string

はい

開始時刻。

end

string

はい

終了時刻。

setStartEnd()

現在の動画の start/end を動的に更新します。

関数定義

(start: number, end: number) => void

パラメーター

名前

タイプ

必須

説明

start

string

はい

開始時刻。

end

string

はい

終了時刻。

setNextStartEnd()

次の動画の start/end を設定します。loadByUrl または replayByVidAndPlayAuth を使用して動画を切り替える場合で、次の動画のセグメント範囲が現在の動画と異なる場合は、最初に setNextStartEnd を呼び出す必要があります。

関数定義

(start: number, end: number) => void

パラメーター

名前

タイプ

必須

説明

start

string

はい

開始時刻。

end

string

はい

終了時刻。

takeSnapshot()

スクリーンショットをキャプチャします。返された base64 文字列は、img.src の値として直接使用できます。setSnapshotProperties を使用してスクリーンショットの品質を設定し、snapshotWatermark を使用してウォーターマークを追加できます。

注:スクリーンショット機能は、動画タグがハイジャックされる一部のモバイルブラウザ (UC ブラウザや QQ ブラウザなど) では機能しない場合があります。

関数定義

() => { time: number, base64: string, binary: string, error: Error | null }

戻り値

名前

タイプ

説明

time

string

スクリーンショットの時間。

base64

string

Base64 エンコードされたスクリーンショットのコンテンツ。

binary

string

スクリーンショットコンテンツのバイナリ文字列表現。

error

Error

スクリーンショットエラーの詳細。

showControlBar()

コントロールバーを表示します。

関数定義

() => void

hideControlBar()

コントロールバーを非表示にします。

関数定義

() => void

イベント

プレーヤーイベント

名前

説明

ready

プレーヤー UI のレンダリングが完了したときに発生します。デフォルトの初期化によって上書きされるのを避けるため、このイベントの後に UI 初期化ロジックをトリガーします。

説明

プレーヤーメソッドは、このイベントが発生した後にのみ呼び出すことができます。

play

一時停止から再生が再開されると発生します。

pause

再生が一時停止されると発生します。

canplay

音声または動画の再生が開始できるときに発生します。このイベントは複数回発生する可能性があります。HTML5 プレーヤーのみ。

playing

再生中に繰り返し発生します。

ended

現在の動画の再生が終了したときに発生します。

liveStreamStop

ライブストリームが停止したときに発生します。HLS ライブストリームの場合、5 回のリトライ失敗後に発生します。ストリームが停止したか、再読み込みが必要であることをアプリケーション層に通知します。

説明

HLS ライブストリームが失敗または切断された場合、プレーヤーは自動的に 5 回リトライします。アプリケーション層で追加のリトライロジックを実装しないでください。

onM3u8Retry

HLS ライブストリームの中断後、プレーヤーがリトライするたびに一度発生します。

hideBar

コントロールバーが自動的に非表示になると発生します。

showBar

コントロールバーはイベントを自動的に表示します。

waiting

データをバッファリングしているときに発生します。

timeupdate

再生位置が変更されると発生します。getCurrentTime() を呼び出して現在の再生時間を取得します。

snapshoted

スクリーンショットが完了したときに発生します。

requestFullScreen

全画面表示になると発生します。

cancelFullScreen

全画面表示を終了すると発生します。iOS では発生しません。

error

エラーが発生したときに発生します。

startSeek

パラメーターは、ドラッグ操作の開始時のドラッグポイントの作成時間を返します。

completeSeek

ドラッグ操作が完了すると、パラメーターはドラッグポイントのタイムスタンプを示します。

resolutionChange

ライブストリームソースの解像度が変更されると発生します。

seiFrame

HLS または FLV を介して SEI メッセージを受信すると発生します。

rtsFallback

RTS がフォールバックするときに発生します。reason パラメーターはフォールバックが発生した理由を示します。fallbackUrl パラメーターにはフォールバック URL が含まれます。

settingSelected

設定 (再生速度、解像度、字幕など) が選択されると発生します。

説明

オープンソースの速度プラグインはプレーヤーと同期しないため、使用するにはカスタムコードと再コンパイルが必要です。独自のイベントリスナーを定義してください。プレーヤーの settingSelected イベントを使用するには、このプラグインを削除してください。

/**
 * 設定が選択されると発生します。例:1.25 倍速に切り替える場合:
 * {name: 'Speed', type: 'speed', text: '1.25×', key: 1.25}
 */

rtsTraceId

このイベントは RTS ストリームの取得が成功したときにトリガーされ、サブスクライブして RTS TraceId を取得できます。ログ出力では、data.paramData パラメーターの `traceId` フィールドがストリーム取得の TraceId で、`source` フィールドが現在の RTS ストリームの再生アドレスです。

player.on('rtsTraceId', function(data) {
  console.log('[EVENT]rtsTraceId', data.paramData);
})

autoplay

自動再生が成功または失敗したときに発生します。コールバックパラメーター event.paramData は、成功時に true、失敗時に false となります。失敗した場合、再生を開始するにはユーザー操作が必要です。

mutedAutoplay

ミュート自動再生が成功し、autoplayPolicy.fallbackToMute が true に設定されている場合に発生します。

videoUnavailable

サポートされていないエンコーディングが原因で動画の再生に失敗し、ブラックスクリーンが発生した場合に発生します。たとえば、H.265 をサポートしていないブラウザで H.265 動画を再生すると、音声のみでブラックスクリーンになります。

urlExpired

URL の有効期限切れが検出された後、refreshUrl コールバックが呼び出される前にトリガーされます。コールバックパラメーター:{ url: expiredUrl }。

urlRefreshed

新しい URL が正常にロードされた後 (canplay)、再生が再開されたことを示すためにトリガーされます。コールバックパラメーター:{ url: newUrl }。

イベントのサブスクライブ

  • プレーヤーインスタンスの on メソッドを使用してイベントをサブスクライブできます。例:

    function handleReady() {};
    player.on('ready', handleReady);
    // 一部のイベントは頻繁に発生します。一度だけリッスンするには player.one を使用します。
    player.one('canplay', () => {});
  • プレーヤーインスタンスの off メソッドを使用してイベントの登録を解除できます。例:

    player.off('ready',handleReady);