DRM 用に Brightcove Player を設定する

このトピックでは、Brightcove Player がどのようにデジタル著作権管理(DRM)を実装しているかを学びます。本ドキュメントでは、最初に DRM プラグインの実装方法を示し、その後にプラグインの詳細および実装方法について説明します。

はじめに

Brightcove は、できる限り幅広いブラウザおよびデバイスに DRM 保護されたコンテンツを配信するため、以下の技術を採用しています。

  • Native/EME がサポートする CENC DRM を使用した MPEG-DASH
  • FairPlay を使用した HLS

Brightcove Player で DRM を使用するには、以下が必要です。

  • DRM が有効化されたコンテンツを作成する。
  • DRM プラグインを使用できるように Brightcove Player を有効化する。
  • 場合によっては、ライセンスサーバーを使用するよう DRM プラグインを設定する。

用語

本ドキュメントで使用されている主要な用語を確認してください。

用語 定義
DRM Wikipedia より引用: デジタル著作権管理(DRM)とは、販売後のデジタルコンテンツおよびデバイスの使用を制御することを目的として、ハードウェアおよびソフトウェアの製造業者、出版社、著作権保持者、個人などによって使用されるコピー防止技術の総称です。
MPEG-DASH Wikipedia より引用: Dynamic Adaptive Streaming over HTTP(DASH、別名 MPEG-DASH)は、従来の HTTP Web サーバーから配信されるメディア コンテンツをインターネット経由で高品質にストリーミングすることを可能にする、アダプティブビットレート ストリーミング技術です。Apple の HTTP Live Streaming(HLS)ソリューションと同様に、MPEG-DASH はコンテンツを小さな HTTP ベースのファイル セグメントの連続に分割して配信します。各セグメントには、映画やスポーツ イベントのライブ放送など、数時間に及ぶ可能性のあるコンテンツの短い再生時間が含まれます。
CENC ISO 規格より引用: 「CENC(Common Encryption Scheme)」は、1 つまたは複数のデジタル著作権および鍵管理システム(DRM システム)で利用できる標準的な暗号化および鍵マッピング方式を規定しており、異なる DRM システムを使用して同一ファイルを復号できるようにします。
Encrypted Media Extensions (EME) Wikipedia より引用: EME は、Web ブラウザとデジタル著作権管理(DRM)エージェント ソフトウェアとの間で通信チャネルを提供するための W3C のドラフト仕様です。これにより、Microsoft Silverlight のようなサードパーティ製メディア プラグインを使用することなく、HTML5 動画で DRM 保護されたコンテンツを再生できるようになります。

Players モジュールを使用した実装

Studio で DRM プラグインを実装し、アカウント設定に基づいて DRM を有効化するには、以下の手順に従ってください。

  1. PLAYERS モジュールを開き、新しいプレーヤーを作成するか、DRM 機能を追加したいプレーヤーを選択します。
  2. プレーヤーのリンクをクリックして、プレーヤーのプロパティを開きます。
  3. 左側のナビゲーションメニューで 再生 をクリックします。
  4. 次に、DRM の有効化 チェックボックスをオンにします。
    Studio 内の DRM チェックボックス
  5. プレーヤーを公開するには、公開と埋め込み > 変更の公開 をクリックします。
  6. 開いているダイアログを閉じるには、閉じる をクリックします。

DRM プラグインのアーキテクチャ

DRM プラグイン(videojs-drm)は、次の 2 つのプラグインをラップしたものです。

  • videojs-silverlight
  • videojs-contrib-eme

videojs-drm プラグインのバージョン 5 では、プレーヤーに組み込まれている DASH 再生機能を使用します。これは、組み込みの videojs-contrib-hls プラグインの後継であり、名称が変更された VHS を利用します。

プレーヤー 6.26.0 以降では、DASH のマルチピリオドがサポートされています。それ以前のバージョンのプレーヤーでは、DASH マルチピリオドを使用するために Shaka Player が必要です。

バージョン 4 と同様に、DASH 再生に Shaka Player を使用したい場合は、videojs-drm バージョン 5 のスクリプトと併せて、次のスクリプトを含めることができます。

            https://players.brightcove.net/videojs-shaka/1/videojs-shaka.js
 

videojs-silverlight プラグインは、特定の Internet Explorer ブラウザで DASH コンテンツの再生を可能にします。

videojs-contrib-eme プラグインは、FairPlay HLS コンテンツの再生を可能にします。

使用される再生技術

Brightcove Player は、ブラウザごとに異なる DRM 再生技術を利用します。以下は、Brightcove Player で使用される DRM 技術の詳細です。

  • FairPlay: Apple の DRM システム
  • PlayReady: Microsoft の DRM システム
  • Widevine: Google の DRM システム

次の表は、Brightcove Player におけるブラウザ(最新バージョン)、フォーマット、および使用される DRM 再生技術の関係を示しています。

ブラウザ フォーマット DRM 再生技術 DRM コンテンツの配信に使用される
レンディション タイプ
Chrome Desktop Widevine を使用した HLS または DASH EME HLS または MPEG-DASH
Chrome Mobile1 Widevine を使用した HLS または DASH EME HLS または MPEG-DASH
Internet Explorer2 PlayReady を使用した HLS または DASH EME HLS または MPEG-DASH
Edge Widevine を使用した HLS または DASH EME HLS または MPEG-DASH
Safari FairPlay を使用した HLS Native HLS
Firefox Widevine を使用した HLS または DASH EME HLS または MPEG-DASH

1iOS 上の Chrome Mobile を使用した DRM 再生はサポートされていません。

DRM コンテンツの作成

DRM が有効化されたコンテンツを作成するには、次の 2 つの手順を実行する必要があります。

  1. 弊社営業担当に連絡し、アカウントを DRM 対応にしてもらいます。その後、適切なライセンスキーおよびトランスコードプロファイルを設定することで、DRM 保護されたコンテンツを作成できるようになります。
  2. DRM で保護されたコンテンツを作成します。新しいコンテンツをアップロードするか、既存のコンテンツを DRM 用に再エンコードするかを選択できます。これは、目的の暗号化技術を生成する トランスコードプロファイル を選択することで行います。

MPEG-DASH マニフェストを使用した分割・暗号化動画、または HLS FairPlay コンテンツのいずれかを使用する DRM 保護コンテンツを作成する必要があります。

DRM プラグインのアーキテクチャ

DRM プラグイン(videojs-drm)は、次の 2 つのプラグインをラップしたものです。

  • videojs-silverlight
  • videojs-contrib-eme

videojs-drm プラグインのバージョン 5 では、プレーヤーに組み込まれている DASH 再生機能を使用します。これは、組み込みの videojs-contrib-hls プラグインの後継であり、名称が変更された VHS を利用します。

プレーヤー 6.26.0 以降では、DASH のマルチピリオドがサポートされています。それ以前のバージョンのプレーヤーでは、DASH マルチピリオドを使用するために Shaka Player が必要です。

バージョン 4 と同様に、DASH 再生に Shaka Player を使用したい場合は、videojs-drm バージョン 5 のスクリプトと併せて、次のスクリプトを含めることができます。

            https://players.brightcove.net/videojs-shaka/1/videojs-shaka.js
 

videojs-silverlight プラグインは、特定の Internet Explorer ブラウザで DASH コンテンツの再生を可能にします。

videojs-contrib-eme プラグインは、FairPlay HLS コンテンツの再生を可能にします。

使用される再生技術

Brightcove Player は、ブラウザごとに異なる DRM 再生技術を利用します。以下は、Brightcove Player で使用される DRM 技術の詳細です。

  • FairPlay: Apple の DRM システム
  • PlayReady: Microsoft の DRM システム
  • Widevine: Google の DRM システム

次の表は、Brightcove Player におけるブラウザ(最新バージョン)、フォーマット、および使用される DRM 再生技術の関係を示しています。

ブラウザ フォーマット DRM 再生技術 DRM コンテンツの配信に使用される
レンディション タイプ
Chrome Desktop Widevine を使用した HLS または DASH EME HLS または MPEG-DASH
Chrome Mobile1 Widevine を使用した HLS または DASH EME HLS または MPEG-DASH
Internet Explorer2 PlayReady を使用した HLS または DASH EME HLS または MPEG-DASH
Edge Widevine を使用した HLS または DASH EME HLS または MPEG-DASH
Safari FairPlay を使用した HLS Native HLS
Firefox Widevine を使用した HLS または DASH EME HLS または MPEG-DASH

1iOS 上の Chrome Mobile を使用した DRM 再生はサポートされていません。

DRM コンテンツの作成

DRM が有効化されたコンテンツを作成するには、次の 2 つの手順を実行する必要があります。

  1. 弊社営業担当に連絡し、アカウントを DRM 対応にしてもらいます。その後、適切なライセンスキーおよびトランスコードプロファイルを設定することで、DRM 保護されたコンテンツを作成できるようになります。
  2. DRM で保護されたコンテンツを作成します。新しいコンテンツをアップロードするか、既存のコンテンツを DRM 用に再エンコードするかを選択できます。これは、目的の暗号化技術を生成する トランスコードプロファイル を選択することで行います。

MPEG-DASH マニフェストを使用した分割・暗号化動画、または HLS FairPlay コンテンツのいずれかを使用する DRM 保護コンテンツを作成する必要があります。

コードで Widevine 再生を実装する

インページ埋め込みコードを使用して Widevine 再生を実装する場合は、DRM プラグインを使用するために次の手順に従ってください。

  1. HTML ページのヘッダーに、プラグインのスタイルシートを含めます。
                <link href="https://players.brightcove.net/videojs-drm/5/videojs-drm.css" rel="stylesheet">
  2. プラグインの JavaScript を含めます。
                <script src="https://players.brightcove.net/videojs-drm/5/videojs-drm.min.js"></script>
  3. 次に、EME プラグインを呼び出して初期化します。
                <script type="text/javascript">
                  videojs.getPlayer('myPlayerID').ready(function() {
                    var myPlayer = this;
                    myPlayer.eme();
                  });
                </script>

Widevine Modular コンテンツの場合、プレーヤーのソース ハンドラーを使用して、Widevine ライセンスサーバーを利用するようプレーヤーを設定する必要があります。

Web ページ上のプレーヤーのインスタンスを更新するには、プレーヤーのソース ハンドラーを使用できます。以下は、player.src() 関数とともに keySystemsOptions 配列を使用する例です。

            player.src({
              src: 'http://example.com/my/manifest.mpd',
              type: 'application/dash+xml',
              keySystemOptions: [
              {
                name: 'com.widevine.alpha',
                options: {
                licenseUrl: 'http://m.widevine.com/proxy'
              }
              }]
            });

次のように updateSourceData 関数を使用することもできます。

            videojs.Html5DashJS.updateSourceData = function(source) {
            source.keySystemOptions = [{
            name: 'com.widevine.alpha',
            options: {
            serverURL:'https://example.com/anotherlicense'
            }
            }];
            return source;
            };

詳細については、GitHub 上の videojs-contrib-dash の情報をご参照ください。

コードで Widevine 再生を実装する

インページ埋め込みコードを使用して Widevine 再生を実装する場合は、DRM プラグインを使用するために次の手順に従ってください。

  1. HTML ページのヘッダーに、プラグインのスタイルシートを含めます。
                <link href="https://players.brightcove.net/videojs-drm/5/videojs-drm.css" rel="stylesheet">
  2. プラグインの JavaScript を含めます。
                <script src="https://players.brightcove.net/videojs-drm/5/videojs-drm.min.js"></script>
  3. 次に、EME プラグインを呼び出して初期化します。
                <script type="text/javascript">
                  videojs.getPlayer('myPlayerID').ready(function() {
                    var myPlayer = this;
                    myPlayer.eme();
                  });
                </script>

Widevine Modular コンテンツの場合、プレーヤーのソース ハンドラーを使用して、Widevine ライセンスサーバーを利用するようプレーヤーを設定する必要があります。

Web ページ上のプレーヤーのインスタンスを更新するには、プレーヤーのソース ハンドラーを使用できます。以下は、player.src() 関数とともに keySystemsOptions 配列を使用する例です。

            player.src({
              src: 'http://example.com/my/manifest.mpd',
              type: 'application/dash+xml',
              keySystemOptions: [
              {
                name: 'com.widevine.alpha',
                options: {
                licenseUrl: 'http://m.widevine.com/proxy'
              }
              }]
            });

次のように updateSourceData 関数を使用することもできます。

            videojs.Html5DashJS.updateSourceData = function(source) {
            source.keySystemOptions = [{
            name: 'com.widevine.alpha',
            options: {
            serverURL:'https://example.com/anotherlicense'
            }
            }];
            return source;
            };

詳細については、GitHub 上の videojs-contrib-dash の情報をご参照ください。

他の DRM プロバイダーのサポート

このプラグインには、他の DRM プロバイダーのサポートを実装できる仕組みが用意されています。これは主に FairPlay で有用です。FairPlay では、ライセンス情報を取得するために必要なカスタムロジックが求められるためです。特定のソースに対して keySystemsvendor.name を追加すると、このロジックを利用し、必要な証明書およびライセンス情報を含める処理が試行されます。以下は Azure の例です。

            player.ready(function(){
              player.eme();
              player.src({
              src: 'http://example.com/src-url.m3u8'
              type: '',
              keySystems: {
                'com.apple.fps.1_0': {
                vendor: {
                name: 'azure'
              },
              certificateUri: 'https://example.com/your-certificate-uri.cer',
              licenseUri: 'https://example.com/your-license-uri'
              }
              }
              });
            });

以下は castLabs の例です。

            var player = videojs.getPlayer('myPlayerID');
            player.ready(function(){
              player.eme();
              player.src({
                src: 'http://example.com/src-url.m3u8'
                type: '',
                keySystems: {
                  'com.apple.fps.1_0': {
                  vendor: {
                  name: 'castlabs',
                  options: {
                  authToken: 'your-auth-token',
                  customData: 'your-custom-data'
                }
                }
                certificateUri: 'https://example.com/your-certificate-uri.cer',
                licenseUri: 'https://example.com/your-license-uri'
                }
                }
              });
            });

次の例では、Widevine および PlayReady のソースを読み込みます。

            player.src({
              type: 'application/dash+xml',
              src: '<some src>',
                 keySystems: {
              'com.widevine.alpha': '<license url>',
              'com.microsoft.playready': '<license url>'
              }
            });

デバッグを有効にする

DRM 対応 DASH コンテンツのデバッグを有効にするには、次の Shaka スクリプトを Brightcove Player に追加します。

            <!-- Script for the drm plugin -->
            <script src="https://players.brightcove.net/videojs-drm/5/videojs-drm.min.js"></script>
            <!-- Script for the shaka plugin -->
            <script src="https://players.brightcove.net/videojs-shaka/1/videojs-shaka.js"></script>
            <!-- Script for shaka debug plugin  -->
            <script src="https://players.brightcove.net/videojs-shaka/1/videojs-shaka.debug.js"></script>

以下は、プレーヤー読み込み時のデバッグ例です。

起動時のコンソールでのデバッグ

以下は、動画の再生開始後のデバッグ例です。

再生後のコンソールでのデバッグ

DASH-IF

Brightcove Player は、DASH Industry Forum(DASH-IF)のアセットをサポートしており、Brightcove のデータを Native/EME にパススルーします。DASH-IF の詳細については、http://dashif.org をご参照ください。以下の DASH-IF 関連リンクも、DASH を使用する際に役立ちます。

再生制限

Brightcove Player で再生制限を使用するための設定については、こちらをご参照ください。

既知の問題

  • Media モジュールの テキスト トラック セクションにある Default (Auto Display) のキャプション設定は、DRM およびマニフェスト内キャプションと併用した場合にはサポートされていません。マニフェスト内キャプションは、たとえば Dynamic Delivery や SSAI などの Brightcove 製品で使用されます。この問題の回避策として、Videoタグ埋め込みコード実装で <track> タグを使用する方法があります。詳細は、動画にキャプションをプログラムで追加するドキュメントをご参照ください。なお、<track> タグには default 属性を指定する必要があります。
  • DRM アセットと Chrome: DRM プラグインを使用した iframe 埋め込みコード実装では、Chrome で DRM アセットを再生するために allow="encrypted-media" の指定が必要です。
                <iframe src="https://players.brightcove.net/123456789/BydO6uuuu_default/index.html?videoId=5783262319001"
                allowfullscreen
                width="640" height="360"
                allow="encrypted-media"></iframe>
  • Silverlight/IE11 における特別なイベント: 通常、プレーヤーをプログラムから操作する場合は、ready または loadedmetadata イベントの発火を待ちます。しかし、IE11 で Silverlight 技術を使用し、かつ DRM コンテンツを再生する場合にプレーヤーをプログラムから操作したい場合は、canplay イベントを待つ必要があります。
  • iOS では、必要な DRM ブラウザ API(EME)を提供しているのは Safari のみであり、WebView は現時点では EME をサポートしていません。そのため、FairPlay DRM は Safari でのみ動作します。

変更履歴

DRM プラグインのリリースノートをご参照ください。

過去のリリースノートについては、こちらの変更履歴をご参照ください。