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

    概要: Player API

    Brightcove Player APIを使用すると、ブラウザがHTML5ビデオ、Flash、またはその他のサポートされている再生技術を使用してビデオを再生している場合でも、JavaScriptを使用してビデオとやりとりすることができます。

    を参照する player

    API関数を使用するには、 player オブジェクト。 これは簡単です。 動画タグにIDがあることを確認するだけです。 埋め込みコードの例には、IDがあります。 myPlayerID、 そしてその player オブジェクトはに保持されます myPlayer 変数。 1ページに複数の動画がある場合は、すべての動画タグに固有のIDがあることを確認してください。

    var myPlayer = videojs.getPlayer('myPlayerID');

    Player レディメソッド

    Video.jsがビデオとAPIをセットアップするのにかかる時間は、接続速度などの複数の要因によって異なります。 そのため、使用したい player's ready() 必要なコードをトリガーするメソッド playerのAPI。

    videojs.getPlayer('myPlayerID').ready(function() {
      var myPlayer = this;
    
      // EXAMPLE: Handle an event
      myPlayer.on('loadstart',doLoadstart);
    
    });

    Player 準備中vsビデオ player 準備

    このドキュメントで関連していることから、これがAPIの安全な使用であると考えるかもしれません。

    videojs.getPlayer('myPlayerID').ready(function() {
      var myPlayer = this;
      // Play the video in the player
      myPlayer.play()
    });

    問題は、 player インタラクションの準備ができているので、 player がロードされ、この例では再生する準備ができています。 このため、使用する必要があります loadedmetadata イベントは、ビデオが再生準備ができていることを保証します。 コードは次のようになります。

    videojs.getPlayer('myPlayerID').ready(function() {
      var myPlayer = this;
      // Play the video in the player
      myPlayer.on('loadedmetadata',function(){
        myPlayer.play();
      })
    });

    もし play() メソッドは関数で実行する唯一のタスクであり、 player 別の方法で、このコードはこれに簡略化できます(使用する必要はありません) ready() 方法):

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

    APIメソッド

    これで準備ができてアクセスできます player、ビデオを制御したり、値を取得したり、ビデオイベントに応答したりできます。 Video.js API関数名は、 HTML5メディアAPI。 主な違いは、ゲッター/セッター関数がビデオプロパティーに使用されていることです。

    // setting a property on a bare HTML5 video element
    myVideoElement.currentTime = "120";
    
    // setting a property on a Video.js player
    myPlayer.currentTime(120);

    の完全なリスト player APIメソッドとイベントは、 player APIドキュメント.


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