サポート サポート問い合わせ先 | システムステータス システムステータス
ページ内容

    Player イベント

    このトピックでは、関連するさまざまなタイプのイベントについて学習します。 Brightcove 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)に関連するイベントのサブセットを次に示します。

    イベント名 説明
    progress ビデオデータのバッファリング(ロード)
    waiting 要求されたビデオデータを瞬間的に待っています
    stalled バッファリングが停止しました
    error 動画の読み込み中にエラーが発生しました
    playing 一時停止またはダウンロードの遅延後に再生が再開されました
    ratechange 再生速度が変更されました(手動または自動)

    スタートアップイベント

    ときに発生するイベントの数があります 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(){})

    全画面イベント

    A fullscreenchange イベントは player 全画面表示モードに切り替えられたとき。 同じイベントがブロードキャストされるかどうか player フルスクリーンになるか、通常モードに戻ります。何が起こったかを知ることが重要な場合は、 player.isFullscreen() かどうかを判断するメソッド player は現在全画面モードです。

    以下のCodepenはこれを行う方法を示しています。

    ペンを見る Brightcove Player 全画面イベント by Brightcove ラーニングサービス(@bcls)上 コードペン.

    広告イベント

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

    イベント 次の場合に送出されます。
    広告リクエスト リクエストされた広告データ。
    広告負荷 広告リクエスト後に広告データが利用可能な場合。
    ads-ad-started 広告の再生が開始されました。
    ads-ad-ended 広告の再生が終了しました。
    ads-pause 広告が一時停止しています。
    広告再生 広告は一時停止から再開されます。
    広告 - 第1四分位 広告の合計再生時間の25%を再生しました。
    広告中点 広告の合計再生時間の50%を再生しました。
    ads-third-quartile 広告の合計再生時間の75%を再生しました。
    ads-click 視聴者が再生広告をクリックした。
    ads-volumechange 演奏広告の音量が変更されました。
    ads-pod-started リニア広告ポッド(広告のシーケンスグループ)の最初の広告が開始されました。
    ads-pod-ended リニア広告ポッド(順序付けされた広告グループ)の最後の広告が終了しました。
    ads-allpods-completed すべてのリニア広告の再生が完了しました。

    bc-catalog-errorイベント

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

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

    混乱は、 progresstimeupdate イベント。 ザ 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 () {});

    ページの最終更新日:29年2020月XNUMX日