DRM 用の Brightcove Player

FairPlay で保護されたコンテンツで 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. ページのJavaScriptブロックで、FairPlayクレデンシャル情報を使用してEMEプラグインを呼び出し、構成します。 getCertificate、 getContentIdそしてgetLicense EMEプラグインに機能します。これらの関数は、独自の FairPlay ライセンスサーバー実装に固有のものであり、 src を設定する前に EME プラグインに直接渡すことができます。

       <script type="text/javascript">
         videojs.getPlayer('myPlayerID').ready(function() {
           var myPlayer = this;
           myPlayer.eme({
             keySystems: {
               'com.apple.fps.1_0': {
               getCertificate: function (emeOptions, callback) {
               // request certificate
               // if err, callback(err)
               // if success, callback(null, certificate) where certificate
               // is a Uint8Array
             },
             getContentId: function (emeOptions, initData) {
               // return content ID as a string
               },
               getLicense: function (emeOptions, contentId, keyMessage, callback) {
                 // request key
                 // if err, callback(err)
                 // if success, callback(null, key) as an arraybuffer
               }
             }
           }
         });
       </script>

FairPlay 情報は、各 src オブジェクトの一部として渡すこともできます。 emeOptions は、すべての関数のパラメータとして提供されます。これらは、現在のソースのソースオプションとマージされた（上書きされた）プラグインオプションへの参照です。それはあなたがそれらを自分で維持する必要がないように、オプションにアクセスしやすくするために利用可能です。

    player.src({
      type: 'application/vnd.apple.mpegurl',
      src: 'http://www.example.com/path/to/master.m3u8',
      keySystems: {
        "com.apple.fps.1_0": {
          getCertificate: function(emeOptions, callback) { ... },
          getContentId: function(emeOptions, initData) { ... },
          getLicense: function(emeOptions, contentId, keyMessage, callback) { ... }
        }
      }
    });

たとえば、を使用する必要がある場合アプリケーションIDそしてPublisherIdのためにgetCertificateリクエストの場合、次の方法でプラグインオプションを渡すことができます。

    {
      keySystems: {
        "com.apple.fps.1_0": {
          getCertificate: function(emeOptions, callback) {
          var applicationId = emeOptions.applicationId; // 'application-id'
          var publisherId = emeOptions.publisherId; // 'publisher-id'
          // ...
        }
          // ...
        }
      },
      applicationId: 'application-id'
      publisherId: 'publisher-id'
    }

または、ソース固有の publisherID が必要な場合は、ソースオプションで上書きできます。

    // plugin options
    {
      keySystems: {
        "com.apple.fps.1_0": {
        getCertificate: function(emeOptions, callback) {
        var applicationId = emeOptions.applicationId; // 'application-id'
        var publisherId = emeOptions.publisherId; // 'source-specific-publisher-id'
        // ...
      },
        // ...
      }
    },
    applicationId: 'application-id'
    publisherId: 'publisher-id'
    }
    // source options
    player.src({
      src: '<URL>',
      type: 'application/vnd.apple.mpegurl',
      publisherId: 'source-specific-publisher-id'
    });

次に、実装の例を示します。オプションを src オプションとして渡し、ホスト名、固定ライセンスおよび証明書 URI からコンテンツ ID を取得し、キーメッセージの本文を持つ POST を必要とするライセンス URI を取得します。

    var uint8ArrayToString = function(array) {
    return String.fromCharCode.apply(null, new Uint16Array(array.buffer));
    };
    var getHostnameFromUri = function(uri) {
      var link = document.createElement('a');
      link.href = uri;
      return link.hostname;
    };
    var getCertificate = function(emeOptions, callback) {
      videojs.xhr({
        uri: emeOptions.certificateUri,
        responseType: 'arraybuffer'
        }, function(err, response, responseBody) {
        if (err) {
          callback(err);
          return;
        }
        callback(null, new Uint8Array(responseBody));
      });
    };
    var getContentId = function(emeOptions, initData) {
      return getHostnameFromUri(uint8ArrayToString(initData));
    };
    var getLicense = function(emeOptions, contentId, keyMessage, callback) {
      videojs.xhr({
        uri: emeOptions.licenseUri,
        method: 'POST',
        responseType: 'arraybuffer',
        body: keyMessage,
        headers: {
          'Content-type': 'application/octet-stream'
        }
        }, function(err, response, responseBody) {
        if (err) {
          callback(err);
          return;
        }
        callback(null, responseBody);
      });
    };
    player.src({
      type: 'application/vnd.apple.mpegurl',
      src: 'http://www.example.com/path/to/master.m3u8',
      keySystems: {
        "com.apple.fps.1_0": {
        getCertificate: getCertificate,
        getContentId: getContentId,
        getLicense: getLicense
      }
      },
      certificateUri: 'http://example.com/fairplay/certificate/endpoint',
      licenseUri: 'http://example.com/fairplay/license/endpoint'
    });

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

ウェブページ上のプレーヤーのインスタンスを更新するには、プレーヤーのソースハンドラーを使用します。keySystemsOptions player.src() 関数で配列を使用する例を次に示します。

    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 情報を参照してください。