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

    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つの要素を含む: typeSRC オブジェクトの配列
    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日