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

    mediainfoのビデオメタデータ

    このトピックでは、ビデオ(メタデータ)に関する情報を mediainfo オブジェクト。 このプロパティは、 loadstart イベントが送出されます。

    mediainfoプロパティ

      mediainfo プロパティは、現在の動画に関する情報(メタデータ)を含むオブジェクトです。 player.

      mediainfo プロパティは、現在の動画に関する情報(メタデータ)を含むオブジェクトです。 player。 CMS(コンテンツ管理システム)またはデータベースからのビデオ情報をオブジェクトに入力します。

    後に mediainfo オブジェクトが設定されている場合は、ビデオ名や説明などのビデオ情報を表示したいときに便利なデータ検索に使用できます。 このオブジェクトは、アナリティクスの収集にも使用されます。

    mediainfoのフィールド

    フィールドには mediainfo プロパティは次のとおりです。

    フィールド名 説明 データ型
    accountId Brightcove アカウント 文字列
    adKeys 将来のサポートのため N / A
    createdAt 作成日時 UTC (2011-09-28T20:06:37.879Z)
    cuePoints オブジェクトの配列としてのキューポイントのリスト オブジェクトの配列
    customFields カスタムフィールド名と関連する値のキーと値のペア オブジェクト
    description 簡単な説明、最大250文字 文字列
    duration 動画の長さ(秒単位) 数値の
    economics いずれかを含む AD_SUPPORTED or 無料。 メディアがマークされている場合 無料IMA3もFreeWheel広告も再生されません。 文字列
    id 動画ID動画に関連付けられた一意の識別子 文字列
    link リンクを含むオブジェクト テキスト および URL プロパティ オブジェクト
    longDescription 説明、5000文字以内 文字列
    name ビデオタイトル 文字列
    poster ポスター画像のURL 文字列
    posterSources ポスターソースを含む配列 配列
    publishedAt 出版日時 UTC (2011-09-28T20:06:37.879Z)
    rawSources レンディション情報 配列
    referenceId 動画参照ID外部データベースまたはCMSからのキーまたは識別子 文字列
    sources オブジェクトの配列としてのレンディションのリスト。 各オブジェクトは少なくとも2つの要素を含む: type および SRC オブジェクトの配列
    tags ビデオに関連付けられたタグ(メタデータ) 文字列の配列
    textTracks キャプション、キューポイントなどのテキストトラックを保持する配列 配列
    thumbnail サムネイル画像へのURL 文字列
    thumbnailSources ポスターサムネイルを含むデータ構造 文字列
    updatedAt 日付と時刻の更新 UTC (2011-09-28T20:06:37.879Z)

    Mediainfoを設定する

    使い方 on() 方法を待つ loadstart イベントをディスパッチすると、対応するイベントハンドラでは、 mediainfo オブジェクト。 以下のコードから、 console.log その mediainfo オブジェクト(111-113行)。

    <video-js id="myPlayerID"
      data-video-id="4093643993001"
      data-account="1752604059001"
      data-player="VJvZIueYx"
      data-embed="default"
      class="video-js" controls=""></video-js>
    <script src="https://players.brightcove.net/1752604059001/VJvZIueYx_default/index.min.js"></script>
    
    <script type="text/javascript">
      videojs.getPlayer('myPlayerID').ready(function() {
        var myPlayer = this;
        myPlayer.on('loadstart',function(){
          console.log('mediainfo', myPlayer.mediainfo);
        })
      });
    </script>

    コンソールからの表示例を以下に示します。

    コンソール表示

    オブジェクトにデータを設定する

    あなたは手動で mediainfo CMSまたはデータベースのメタデータを持つプロパティ。 その後、 mediainfo オブジェクト sources 設定するプロパティ player ビデオレンディション付き。

    • 32〜37行目:ページはめ込み埋め込み player 実装
    • 線40-52:ビデオオブジェクトを手動で作成します。 実際には、データはCMSまたはデータベースから取得され、オブジェクトは動的に構築されます
    • 54〜55行目: player 使用する準備が整い、 player 変数へのインスタンス
    • 56行目:手動で作成したビデオオブジェクトを player's mediainfo オブジェクト
    • ライン57: player's src メソッドを使用して、1つまたは複数のビデオ表現を割り当てます。 mediainfo オブジェクト sources プロパティ、 player
      <video-js id="myPlayerID"
        data-account="3676484086001"
        data-player="2433352b-a2e2-4b7e-9a15-2d9ec7f07e9d"
        data-embed="default"
        class="video-js" controls></video-js>
      <script src="https://players.brightcove.net/3676484086001/2433352b-a2e2-4b7e-9a15-2d9ec7f07e9d_default/index.min.js"></script>
    
      <script type="text/javascript">
        //Populate video object (normally from database or CMS)
        var videoObject = new Object();
        videoObject.name = "Hand made video object test";
        videoObject.id = "1234msb";
        videoObject.description = "short description for hand made video object";
        videoObject.accountId = "1507807800001";
        videoObject.sources = [{
            "src": "http://solutions.brightcove.com/bcls/assets/videos/Tiger.m3u8",
            "type": "application/x-mpegURL"
          }, {
            "src": "http://solutions.brightcove.com/bcls/assets/videos/Tiger.mp4",
            "type": "video/mp4"
          }];
    
        videojs.getPlayer('myPlayerID').ready(function() {
          var myPlayer = this;
          myPlayer.mediainfo = videoObject;
          myPlayer.src(myPlayer.mediainfo.sources);
        });
      </script>

    タグとカスタムフィールドを表示する

    タグとカスタムフィールドの両方が複雑なデータ構造に格納されます。 ザ カスタムフィールド オブジェクトと タグ 配列内にあります。 次のスクリーンショットは、カスタムフィールドとタグを mediainfo オブジェクト。

    コンソール表示のタグとカスタムフィールド

    これらの複雑なデータ構造からデータを表示するには、2種類のループが必要です。 A for ループは、タグ配列(行16-20)を反復し、動的に構築されたHTMLの順序付けられていないリストを <div> (9行に定義されています)。 A for-in ループは、カスタムフィールドオブジェクト(行24-27)を反復処理し、動的に構築されたHTMLの順序付けられていないリストを <div>.

    <video-js id="myPlayerID"
      data-video-id="4093643993001"
      data-account="1752604059001"
      data-player="VJvZIueYx"
      data-embed="default"
      class="video-js" controls=""></video-js>
    <script src="https://players.brightcove.net/1752604059001/VJvZIueYx_default/index.min.js"></script>
    
    <div id="displayInfo"></div>
    
    <script type="text/javascript">
      videojs.getPlayer('myPlayerID').ready(function() {
        var myPlayer = this;
        myPlayer.on('loadstart',function(){
          //Use JavaScript to display the tags
          var numTags = myPlayer.mediainfo.tags.length;
          displayInfo.innerHTML += "<h1>Tags:</h1><ul>";
          for (var i = 0; i < numTags; i++) {
            displayInfo.innerHTML += "<li>" + myPlayer.mediainfo.tags[i] + "</li>";
          };
          displayInfo.innerHTML += "</ul><br />";
    
          //Use JavaScript to display custom fields
          displayInfo.innerHTML += "<h1>Custom Fields:</h1><ul>";
          for (var key in myPlayer.mediainfo.customFields) {
           displayInfo.innerHTML += "<li><strong>" + key + "</strong>: " + myPlayer.mediainfo.customFields[key] + "</li>";
          }
          displayInfo.innerHTML += "</ul>";
        })
      });
    </script>

    レンダリングされたHTMLはこのスクリーンショットに示すように表示されます。

    タグとHTMLでのカスタム表示

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