Brightcove Player による再生制限

このトピックでは、Brightcove Player を使用して再生制限を設定する方法について説明します。

はじめに

Brightcove Player はBrightcove Playback API と連携し、再生権限と制限を管理します。コンテンツ制限 設定に新しく追加された 再生権限の有効化 チェックボックスにより、再生認可プロセスが自動化され、設定が簡素化されます。

再生権限は DRM の有無にかかわらず使用できますが、ランタイム制限を使用する場合は JSON Web Token (JWT) が必要です。

License Keys Protection を使用すると、Dynamic Delivery で DRM 保護されたコンテンツや HTTP Live Streaming Encryption (HLSe) コンテンツを扱う際に、追加のセキュリティ層が提供されます。ライセンス要求は署名付きJSON Web Token (JWT) を使用して認証できます。このトークンは、動画がプレーヤーに読み込まれ、ソースが選択された後にライセンスを要求する際に使用されます。

Brightcove Player で License Keys Protection を設定するには、動画のカタログ リクエスト時にトークン パラメータを渡します。

この機能に慣れていない場合は、概要: Brightcove 再生権限 を参照してください。

次のセクションのコードを理解するために、以下のドキュメントで関連概念を確認してください。

要件

再生権限を使用するための要件は以下のとおりです。

再生権限

再生権限を使用するには、次が必要です：

  • Player バージョン 6.39.0 以上

License Keys Protection

License Keys Protection を使用するには、次が必要です：

  • Player バージョン 6.33.0 以上
  • DRM を使用する場合、DRM プラグイン のバージョン 5.5.0 以上

再生権限の使用

再生権限を利用するには、次の手順に従ってください：

  1. Brightcove Player の policy key を削除します。詳細は 再生権限を使用したリクエストの実行 セクションを参照してください。

  2. ランタイム制限 を使用する場合、認可トークンが必要です。指定すると、このトークンは以降のリクエストの Authorization ヘッダーとして追加されます。

    プレーヤーに追加する方法は次のとおりです： 

      player.catalog.setBcovAuthToken('your jwt token');
  3. policy key や認可トークンを変更した後、Brightcove Playback API にデータを要求し、プレーヤーに読み込む準備が整います。このプロセスはデフォルトの場合と同じです。

    ここでは、再生制限と認可トークンを使用して 1 本の動画を取得する例を示します：

    HTML

      <div style="max-width: 960px;">
    <video-js id="myPlayerID"
      data-embed="default"
      controls=""
      data-application-id=""
      class="vjs-fluid"></video-js>
  </div>
  <script src="https://players.brightcove.net/your account id/your player id_default/index.min.js"></script>

    JavaScript

      <script>
      // +++ プレーヤー属性の追加 +++
      var myPlayer,
          myPlayerEl = document.getElementById("myPlayerID");
      myPlayerEl.setAttribute('data-account', your account id);
      myPlayerEl.setAttribute('data-player', 'your player id');
  
      // +++ プレーヤーの作成 +++
      myPlayer = bc(myPlayerEl);
  
      // プレーヤーの policy key を解除
      myPlayer.catalog.setPolicyKey(null);
  
      // 認可トークンの設定
      myPlayer.catalog.setBcovAuthToken('your jwt token');
      // これにより次のリクエストがトリガーされます：
      //
      //   https://edge-auth.api.brightcove.com/playback/v1/videos/1
      //
      // ヘッダー：
      //
      //   Authorization: Bearer <span class="bcls-input">your jwt token</span>
      //
  
      myPlayer.catalog.get({id: 'your video id', type: 'video'}).
      then(function(data) {
        myPlayer.catalog.load(data);
        myPlayer.muted(true);
        myPlayer.play();
      }).
      catch(function(error) {
        throw new Error(error);
      });
  </script>

再生権限を使用したリクエストの実行

デフォルトでは、Brightcove プレーヤーは Playback API からコンテンツをリクエストする際に policy key を使用します。Playback Rights を有効にするには、プレーヤーが policy key を保持していない必要があります。コンテンツ制限 ページの 再生権限の有効化 チェックボックスを使用すると、policy key が none に設定され、コンテンツ制限設定が無効化され、この処理が自動化されます。

すべてのプレーヤーから policy key を削除する

Video Cloud Studio で新しく作成したプレーヤーに policy key が取り込まれないようにするには、以下を実行します：

  1. 弊社営業に連絡します。
  2. アカウント ID を伝え、remove policy key フラグを有効にするよう依頼します。
  3. 既存のプレーヤーについては、変更を反映させるため再公開してください。

Video Cloud Studio で再生権限を有効化する

  1. Players モジュールに移動します。
  2. 設定したいプレーヤーを選択します。
  3. 左側のナビゲーションで コンテンツ制限 を選択します。

  4. 再生権限の有効化 にチェックを入れます。

    playback rights
  5. 変更を保存し、プレーヤーを公開します。

ランタイムで policy key を削除する

プレーヤーの policy key を解除するには、JS スクリプトに次のコード行を追加します：

myPlayer.catalog.setPolicyKey(null);

再生権限を使用しないリクエストの実行

このプロセスを逆にすることで、再生権限や制限なしに Playback API へ直接リクエストを送る設定に戻せます。

すべてのプレーヤーで Policy Key を再有効化する

以前に policy key flag を削除する設定が有効になっていた場合は、policy key を復元するために無効化する必要があります。

  1. Brightcove の営業担当に連絡します。

  2. remove policy key フラグを無効にするよう依頼します。

  3. 影響を受けるすべてのプレーヤーを再公開し、変更を反映させます。

個別のプレーヤーで Policy Key を再有効化する

特定のプレーヤーで policy key を復元する必要がある場合：

  1. Video Cloud Studio で Players モジュールに移動します。

  2. 更新したいプレーヤーを選択します。

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

  4. プレーヤーの JSON 設定を更新し、none を有効な policy key に置き換えて policy key を設定します：

    JSON editor

  5. 保存し、プレーヤーを再公開します。

ランタイムで Policy Key を再有効化する

ランタイムで動的に policy key を再有効化するには、JavaScript コードで認可トークンを更新します：

  1. 認可トークンを null に設定します。 
        player.catalog.setBcovAuthToken(null);

License Keys Protection の使用

License Keys Protection を使用するには、player catalog オブジェクトの一部として認可トークン文字列を渡します。プロパティ名には bcovAuthToken を使用します。

この方法は、DRM と HLSe の両方のコンテンツで機能します。プレーヤーは Playback API から読み込まれるソースの種類を検出し、そのソースに適した実装を自動的に適用します。

License Keys Protection を使用するには、次の手順に従ってください：

  1. 署名付き JSON Web Token (JWT) を作成します。
  2. 動画リクエストにこのトークンを含めます。

    以下のサンプルコードは、トークンを渡しながら動画をリクエストするために catalog.get() メソッドを使用しています。

          <video-js id="myPlayerID"
        data-account="1507807800001"
        data-player="default"
        data-embed="default"
        controls
        data-application-id></video-js>
      <script src="//players.brightcove.net/1507807800001/default_default/index.min.js"></script>
      
      <script>
        (function() {
          var myPlayer = videojs.getPlayer('myPlayerID');
      
          myPlayer.catalog.get({
            type: 'video',
            id: '6015247091001',
            policyKey:'none',
            bcovAuthToken: 'your jwt token'
          })
            .then(function(videoReturned){
              myPlayer.catalog.load(videoReturned);
            })
            .catch(function(err){
              console.log('err:', err);
            });
        })();
      </script>

同時視聴管理およびデバイス登録の使用

同時ストリーム数管理 または デバイス登録 を使用している場合、Brightcove プレーヤーでは標準の DRM プラグインではなく、EME プラグインを使用する必要があります。

以下の手順に従ってください：

  1. EME プラグインを Brightcove プレーヤーに追加します。このプラグインには persistentState が含まれるよう更新されています。
  2. Video Cloud Studio で Players モジュールに移動し、情報を確認するプレーヤーを選択します。
  3. 左側のナビゲーションで Playback を選択します。

  4. DRM 有効化 が選択されていないことを確認します。

    Enable DRM option
    Enable DRM option
  5. 左側のナビゲーションで JSON エディタ を選択します。

  6. JSON コード内で player オブジェクトを探し、次のように eme_options オブジェクトを追加します：

        
      "player": {
        "eme_options" : {
          // add eme options for all sources here.
        }
      }
  7. 指定した keySystems に対する EME オプションとして persistentState を "required" に設定します。 
    
      "eme_options": {
        "keySystems": {
          "com.widevine.alpha": {
            "persistentState": "required"
          }
        }
      }
  8. License Keys Protection の使用 セクションで説明されているように、JWT 認証トークンを含めます。

サーバーサイド広告（SSAI）の設定

SSAI と共に License Keys Protection を使用する場合、adConfigId という追加パラメータを catalog parameters オブジェクトに含める必要があります。

    <video-js id="myPlayerID"
      data-account="1507807800001"
      data-player="default"
      data-embed="default"
      controls
      data-application-id></video-js>
    <script src="//players.brightcove.net/1507807800001/default_default/index.min.js"></script>
    
    <script>
      (function() {
        var myPlayer = videojs.getPlayer('myPlayerID');
    
        myPlayer.catalog.get({
          type: 'video',
          id: '6015247091001',
          bcovAuthToken: 'your jwt token',
          adConfigId: 'your ad configuration id'
        })
          .then(function(videoReturned){
            myPlayer.catalog.load(videoReturned);
          })
          .catch(function(err){
            console.log('err:', err);
          });
      })();
    </script>

カスタム実装の使用

bcovAuthToken を catalog.get() リクエストに設定できないカスタム実装を使用している場合があります。独自のプレーヤーやサードパーティ製プレーヤーを使用している場合、以下のいずれかの方法を使用してライセンス リクエストにトークンを渡すことができます：

  • HTTP ヘッダー: BCOV-Auth（HLSe ではサポートされません）
  • Cookie: bcov-auth（HLSe ではサポートされません）
  • クエリパラメータ: bcov-auth（HLSe のみサポート） ライセンス URL ではなく、マスターマニフェスト URL に追加する必要があります。

以下は、動画オブジェクト内の source.emeHeaders['BCOV-Auth'] 属性にトークンを設定する例です。これは、カタログ リクエストの後、それぞれのソースに emeHeader を挿入します。 

    <video-js id="myPlayerID"
      data-account="1507807800001"
      data-player="default"
      data-embed="default"
      controls
      data-application-id></video-js>
    <script src="//players.brightcove.net/1507807800001/default_default/index.min.js"></script>
    
    <script>
      (function() {
        var myPlayer = videojs.getPlayer('myPlayerID');
    
        myPlayer.catalog.get({
          type: 'video',
          id: '6015247091001'
        })
        .then(function(video){
          sources=video.sources;
    
          for (let i = 0; i < sources.length; i++) {
            const source = sources[i];
    
            // DRM コンテンツに対してのみ認証トークンを eme header として追加
            if (your jwt token && source.key_systems) {
              source.emeHeaders = {
                  'BCOV-Auth': your jwt token
                };
            }
          }
            myPlayer.catalog.load(video);
          })
          .catch(function(err){
            console.log('err:', err);
          });
      })();
    </script>

プレーヤー ローダーの使用

Brightcove プレーヤーでローダーを使用している場合でも、再生権限を引き続き利用できます。

React Player Loader

再生権限と共に React Player Loader を使用する方法については、React Player Loader ドキュメントを参照してください。