Player イベント

概要

Brightcove Player ビデオの再生を制御するための多くのイベントがあります。 このトピックでは、さまざまなタイプのイベントについて概要を説明します。

完全なリスト Brightcove Player イベントはで見つけることができます Player メソッド/イベントAPI 参照ドキュメント。 このドキュメントは、を構成する実際のコードの一部であるイベントを反映しています player.

メディアイベント

HTMLリビングスタンダード ドキュメントは、Webアプリケーションに必要なHTMLとAPIの開発に関する情報の素晴らしいリソースです。 これはWebハイパーテキストアプリケーションテクノロジーワーキンググループ（WHATWG）によって最新の状態に保たれている「生きている」ドキュメントであり、Webを発展させることに関心のある人々の集まりです。

Brightcove Player HTMLフレームワーク上で実行され、以下をトリガーします メディアイベント.

このドキュメントのイベントに関連する用語を次に示します。

ブロックされた

再生が終了した場合、MediaControllerはブロックされたとみなされます。 一時停止。 メディア要素は、そのコントローラが ブロックされたメディアコントローラ.

MediaController

A MediaController 複数のメディア要素の再生を調整するオブジェクトです。

メディア要素

A メディア要素 オーディオデータまたはビデオおよびオーディオデータをユーザに提示する。

奴隷

デフォルトでは、各メディア要素にはno MediaController。 メディア要素が MediaController、彼らは言われている 奴隷 コントローラに送信します。 コントローラは、それに従属する各メディア要素の再生速度およびボリュームを変更する。 スレーブ要素の1つが予期せずに停止した場合、コントローラは他のスレーブ要素を停止します。

バッファリングとQoSイベント

バッファリングとサービス品質（QoS）に関連するイベントのサブセットを次に示します。

スタートアップイベント

ときに発生するイベントの数があります player が初期化され、ビデオを再生する準備をします。 それらは、ディスパッチされる順序でここにリストされています。

• loadstart：次の場合にディスパッチされます player が初期化され、再生する新しいソースを提供する場合に再初期化された場合

• loadedmetadata：次の場合にディスパッチされます player つまり、最初のセグメントがダウンロードされたときに、初期期間とディメンション情報があります。 ライブ動画の場合 loadedmetadata ユーザーが再生をクリックするまで、イベントはディスパッチされません。 これは、ライブ動画がユーザーが再生をクリックするまでセグメントのダウンロードを開始しないためです。
• loadeddata：次の場合にディスパッチされます player 現在の再生位置にデータをダウンロードしました

次のCodePenは、リッスンされてディスパッチされる起動イベントを示しています。 CodePenの上にマウスを置くと、 RERUN ボタンをクリックすると、イベントが再度表示されます。 コードを試したい場合は、 CODEPENで編集 リンクをクリックして編集環境に移動します。 あなたは JS ボタンをクリックすると、イベントリスナーを追加するJavaScriptが表示されます。

ペンを見る スタートアップイベントのデモ by Brightcove ラーニングサービス（@bcls）上 コードペン.

ready（）メソッド

ready() メソッドはイベントのように見えるという点でXNUMXつの性格を持っていますが、メソッドのように使用します。 このメソッド/イベントは、 player コマンドを受信する準備ができています。

ready() メソッドがイベントリスナーと異なる点は、 ready イベントはすでに発生しています ready() メソッドを使用します。 開発の出発点を提供するために、以下のように使用される方法がよく見えます。 Brightcove Player:

videojs.getPlayer('myPlayerID').ready(function(){
  var myPlayer = this;
});

ready（）とon（ 'loadedmetadata'、...）

注意： ready() と対話したい場合は正しく機能します playerたとえば、プログラムでプラグインを追加します。 たとえば、すぐにビデオを操作したい場合は、 play()上記のコードスニペットが正しく機能するとは限りません。 より良いアプローチは、 loadedmetadata ビデオとやり取りする

videojs.getPlayer('myPlayerID').on('loadedmetadata',function(){
  var myPlayer = this;
  myPlayer.play();
});

要約すると、 player あなたはこれを使うことができます：

videojs.getPlayer('myPlayerID').ready()

あなたがすぐにビデオと対話したい場合 player これを使って：

videojs.getPlayer('myPlayerID').on('loadedmetadata',function(){})

広告イベント

に広告ライブラリと機能を含めるには player、あなたは IMA3プラグイン または FreeWheelプラグイン。 これは、 videojs adsフレームワーク （videojs-contrib-ads）。 これらの広告プラグインは両方とも、次の表に示す広告イベントを送出できます。 それぞれには、実装に特有の特定のイベントもあります。

bc-catalog-errorイベント

正常時のエラー処理 ready() スクリプトブロックのセクションで問題が発生する可能性があります。 たとえば、 bc-catalog-error イベントは、 player 準備ができています。エラーをリッスンすると ready() エラーを処理することはできません。 この問題は、ジオフィルタリングを使用している、ビデオが未公開、ビデオがスケジューリング範囲外にある、または別のアカウントで発生している可能性があります。 完全な議論とその bc-catalog-error イベント、 Player カタログ の資料をご参照ください。

進捗状況とタイムアップの日付

混乱は、 progress と timeupdate イベント。 ザ Brightcove Player HTML5ビデオの上に構築され、その標準では progress ブラウザがデータをダウンロードしているときにイベントが送出されます。 ザ timeupdate イベントは、現在の再生位置が変更されたときに送出されます。

これは、ユーザーに混乱を招く可能性があります。 Brightcoveのスマート Player、そのAPIのように progress イベントは何をする timeupdate の Brightcove Player APIです。

timeupdateリスナーを削除する際の注意

場合によっては、追加したイベントリスナーを削除することもできます timeupdate イベント。 ユースケースは、 Brightcove Player サンプル：プレビュー後に再生するための登録 資料。 この状況では、 player ある時間範囲で一時停止し、 timeupdate 時間チェックには、無名イベントハンドラ関数定義を使用します。 一度だけ一時停止したいので、イベントリスナーを削除する必要があります。 あなたは単純にしたくない：

myPlayer.off('timeupdate');

もちろん、これにより、すべてのイベントリスナーが削除されます。 timeupdateこれを行う他の問題の中でも、タイムスクラバーが前進するのを妨げるでしょう。 何が行われる必要があるのは、通常の関数定義構文（関数宣言）を使用して関数を作成し、次に1つのイベントリスナーを削除することです。 短縮コードは次のとおりです。

 // Add the event handler
myPlayer.on('timeupdate', timeupdateHandler);

// Handle the event then remove JUST this event listener on timeupdate
function timeupdateHandler(evt) {
  ...
  myPlayer.off('timeupdate', timeupdateHandler);
}

メソッド連鎖はサポートされていません

バージョン6の Brightcove Player イベントによるメソッド連鎖はもはやサポートされていません。 つまり、これを行うことはできません：

player.on(event, function () {})
.on(event, function () {})
.on(event, function () {})
.on(event, function () {});