プレーヤーに動画を動的に割り当てる

プレーヤーに関連付けられた動画を変更する必要がある場合があります。たとえば、視聴者が視聴したい動画を選択できるようにする場合や、視聴者がどのサイトのセクションから来たかに基づいてプレーヤーに表示する動画を切り替える場合です。

異なる動画をプレーヤーで表示する必要がある場合は、1つのプレーヤーを使用して、そのプレーヤーに関連付ける動画を動的に変更する方法が推奨されます。

このトピックでは、以下の手法を紹介します：

• URL パラメーターで動画ID を渡す
• URL パラメーターで参照ID を渡す
• 埋め込みコードを修正して動画ID を指定する
• 埋め込みコードを修正して参照ID を指定する

コンテンツは Catalog API を使用してプレーヤーに動的に割り当てることも可能です。詳細およびサンプルコードについては、開発者向けドキュメントをご参照ください。

URL パラメーターで動画ID を渡す

次の形式で動画ID を URL パラメーターとして渡すことで、プレーヤーの動画ソースを変更することができます：?videoId=YOUR_VIDEO_ID

    http://players.brightcove.net/20318290001/f1d70e07-8480-4bbd-b4ef-747e9333a034_default/index.html?videoId=4292158104001

URL パラメーターで参照ID を渡す

次の形式で参照ID を URL パラメーターとして渡すことで、プレーヤーの動画ソースを変更することができます：?videoId=ref:YOUR_VIDEO_REF_ID

    http://players.brightcove.net/20318290001/f1d70e07-8480-4bbd-b4ef-747e9333a034_default/index.html?videoId=ref:1234

埋め込みコードを修正して動画ID を指定する

Video Cloud の動画を、動画ID を使って直接プレーヤーの埋め込みコードに割り当てることができます。

    <video-js   data-account="57838016001"
      data-player="6e44f16e-31e9-48b2-83b9-6edd71217540"
      data-embed="default"
      data-video-id="68143720001"
      class="video-js"
      controls></video-js>
    <script src="https://players.brightcove.net/57838016001/6e44f16e-31e9-48b2-83b9-6edd71217540_default/index.min.js"></script>

    <iframe src='//players.brightcove.net/57838016001/6e44f16e-31e9-48b2-83b9-6edd71217540_default/index.html?videoId=68143720001'
     allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>

埋め込みコードを修正して参照ID を指定する

Video Cloud の動画を、参照ID を使用してプレーヤーの埋め込みコードに直接割り当てることができます。

      <video-js data-account="57838016001"
        data-player="6e44f16e-31e9-48b2-83b9-6edd71217540"
        data-embed="default"
        data-video-id="ref:68143720001"
        class="video-js"
        controls></video-js>
      <script src="https://players.brightcove.net/57838016001/6e44f16e-31e9-48b2-83b9-6edd71217540_default/index.min.js"></script>

      <iframe src='//players.brightcove.net/57838016001/6e44f16e-31e9-48b2-83b9-6edd71217540_default/index.html?videoId=ref:68143720001'
       allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>