ダウンロード ボタン プラグイン

このトピックでは、Brightcove Player用のダウンロード プラグインについて説明します。このプラグインを使用すると、動画のMP4ファイルまたは動画のトランスクリプトのテキストファイルをダウンロードできます。

概要

ダウンロード プラグインを追加するには、Players モジュールを使用して実装するを参照してください。

MP4ダウンロード例

Download Button

トランスクリプト ダウンロード例

基本事項

ダウンロード プラグインは、プレーヤーの mediainfo オブジェクトに依存しています。このオブジェクトには、動作するためにいくつかのサブプロパティを含める必要があります。

  • tags: tags属性にはプレーヤーのメディア情報に関する情報が含まれます。ダウンロード ボタン プラグインを初期化するには、この配列に文字列 “downloadable“ を含める必要があります。他の要素は無視されます。 
    tags: ["downloadable"]
  • sources: sources 配列には、プレーヤーによって取得されるさまざまなソースの情報が含まれます。ダウンロード ボタン プラグインは、この配列内で最高品質の MP4 ソースを探します。他の要素は無視されます。container プロパティはソースが MP4 ファイルであることを示し、size プロパティは MP4 の品質を決定します。 
    
        sources: [{
            avg_bitrate: 2121000,
            codec: "H264",
            container: "MP4",
            duration: 734167,
            height: 720,
            size: 195024286,
            src: "https://examplesource.mp4",
            type: "video/mp4",
            width: 1728
          }]
  • transcripts: transcripts 配列には、プレーヤーに関連付けられたすべてのトランスクリプトが一覧表示されます。ダウンロード ボタン プラグインは、プレーヤーの言語に一致するトランスクリプトを探します。一致するものがない場合、リスト内の最初のトランスクリプトが選択されます。src_lang プロパティはトランスクリプトの言語を決定します。 
    
        transcripts: [{
          default: false,
          id: "95423543d7-8363-49dd-9b1c-ff32365433fc0cda",
          label: "English",
          src: "https://examplesource.txt",
          src_lang: "en-US",
          status: null
          }]

ブラウザーの互換性

このプラグインは、以下の主要ブラウザーの最新バージョンと互換性があります。

  • Chrome デスクトップ版
  • Chrome モバイル版（Android 6以上）
  • Firefox デスクトップ版
  • Edge
  • Safari デスクトップ版 *
  • Safari モバイル版（iOS 11.2以上） *

Players モジュールを使用して実装する

この機能を有効にするには、プレーヤーを手動で設定します。

  1. PLAYERS モジュールを開き、新しいプレーヤーを作成するか、プラグインを追加したい既存のプレーヤーを選択します。
  2. 対象のプレーヤーのリンクをクリックして、プレーヤーのプロパティを開きます。

  3. 左側のナビゲーションメニューで JSON エディタ をクリックします。

    Left Navigation

  4. JSON エディタ オブジェクト内に download_button プロパティを追加します。

    利用可能な最高品質の MP4 ファイルをダウンロードするようにプレーヤーを設定するには、このプロパティの値に mp4 を指定します。コードは次のようになります。

    Download MP4

    プレーヤーで使用されている言語に一致する（または一致するものがない場合は最初の）トランスクリプトのテキストファイルをダウンロードするように設定するには、download_button プロパティの値に transcript を指定します。コードは次のようになります。

    Download Transcript
  5. 保存 をクリックします。

    6. この機能が有効であっても、MP4 またはトランスクリプトが利用できない場合、ボタンは表示されますが無効化されます。

    Video disabled

ランタイム プロパティ

ダウンロード ボタンには player.downloadButton を使用してアクセスできます。このオブジェクトには、利用可能ないくつかのプロパティがあります。

player.downloadButton.state

型: String

このプロパティは、ダウンロード ボタンの現在の状態を示します。有効な値は次のとおりです。

  • ready: ダウンロードを開始できる状態です。
  • hidden: ダウンロード ボタンが非表示の状態です。この状態は、downloadable タグが存在しない場合に発生します。
  • off: ダウンロード ボタンが DOM に存在しない状態です。この状態は、ソースが無効、または存在しない場合に発生します。

player.downloadButton.source

型: String

このプロパティには、ダウンロード対象のソース URL が含まれます。ダウンロード方法に応じて、MP4 ファイルまたはトランスクリプトのテキストファイルへのリンクとなります。

イベント

ダウンロード ボタン プラグインは、分析目的でいくつかのイベントをトリガーします。

  • download-ready: プラグインが正常に初期化された時点で発火します。

  • download-hidden: プラグインが初期化され、ボタンが非表示になったときに発火します。これは、mediainfo 内の tags 配列に ”downloadable” タグが含まれていない場合に発生します。

  • download-disabled: プラグインが初期化され、ボタンが無効化されたときに発火します。これは、期待されるダウンロード方法に応じて、mediainfo オブジェクトが存在しない、または sources や transcripts が無効な場合に発生します。

  • download-started: ダウンロードボタンがクリックされ、ダウンロードが開始されたときに発火します。

  • download-finished: ダウンロードが正常に完了したときに発火します。このイベントでは、ファイル名もリスナーに送信されます。

  • download-failed: ダウンロードが失敗したときに発火します。このイベントでは、エラーに関する情報もリスナーに送信されます。