メディアの更新(Chrome 62)

フランソワ ボーフォール
François Beaufort

Android の永続ライセンス

Encrypted Media Extensions(EME)の永続ライセンスは、ライセンスがデバイス上に維持されるため、アプリはサーバーに別のライセンス リクエストを送信することなく、ライセンスをメモリに読み込めることを意味します。これが、EME のオフライン再生におけるサポートです。

これまで、永続ライセンスをサポートする唯一のプラットフォームは ChromeOS でした。これは、もはや真実ではありません。Android でも、デバイスがオフラインのときに EME を介して保護されたコンテンツを再生できるようになりました。

const config = [{
  sessionTypes: ['persistent-license'],
  videoCapabilities: [{
    contentType: 'video/webm; codecs="vp09.00.10.08"',
    robustness: 'SW_SECURE_DECODE' // Widevine L3
  }]
}];

// Chrome will prompt user if website is allowed to uniquely identify
// user's device to play protected content.
navigator.requestMediaKeySystemAccess('com.widevine.alpha', config)
.then(access => {
  // User will be able to watch encrypted content while being offline when
  // license is stored locally on device and loaded later.
})
.catch(error => {
  // Persistent licenses are not supported on this platform yet.
});

永続ライセンスを自分で試してみるには、サンプル メディア PWA を確認し、次の操作を行います。

  1. https://biograf-155113.appspot.com/ttt/episode-2/ にアクセスします。
  2. [オフラインで使用可能にする] をクリックし、動画がダウンロードされるまで待ちます。
  3. 機内モードをオンにします。
  4. [再生] ボタンをクリックして動画を視聴してください。

Android 用 Widevine L1

ご存じのように、すべての Android デバイスは Widevine セキュリティ レベル 3(Widevine L3)をサポートする必要があります。一方、Widevine セキュリティ レベル 1 は、すべてのコンテンツの処理、暗号化、制御が高信頼実行環境(TEE)内で実行される、最高レベルのセキュリティ レベルにも対応しているデバイスも数多く存在します。

お客様のWidevine L1 が Chrome for Android でサポートされるようになり、最も安全な方法でメディアを再生できるようになりました。Chrome OS ではすでにサポートされていました。

const config = [{
  videoCapabilities: [{
    contentType: 'video/webm; codecs="vp09.00.10.08"',
    robustness: 'HW_SECURE_ALL' // Widevine L1
  }]
}];

// Chrome will prompt user if website is allowed to uniquely identify
// user's device to play protected content.
navigator.requestMediaKeySystemAccess('com.widevine.alpha', config)
.then(access => {
  // User will be able to watch encrypted content in the most secure way.
})
.catch(error => {
  // Widevine L1 is not supported on this platform yet.
});

アダプティブ メディア形式(DASH や HLS など)用の JavaScript ライブラリである Shaka Player には、Widevine L1 を試すデモが用意されています。

  1. https://shaka-player-demo.appspot.com/demo/ にアクセスし、プロンプトが表示されたら [Allow] をクリックします。
  2. [Angel One(マルチコーデック、多言語、Widevine)] を選択します。
  3. [設定] セクションの [動画の堅牢性] フィールドに「HW_SECURE_ALL」と入力します。
  4. [読み込み] ボタンをクリックして動画をご覧ください。

バックグラウンド動画トラックの最適化(MSE のみ)

Chrome チームは常にバッテリー駆動時間を改善する新しい方法の発見に努めており、Chrome 62 も例外ではありません。

Chrome では、動画が Media Source Extensions(MSE)を使用している場合、バックグラウンドで(非表示のタブなどで)動画が再生されると、動画トラックが無効になります。詳しくは、以前の記事をご覧ください。

ライブ MSE ストリームでシーク可能な範囲をカスタマイズする

ご存じのように、seekable 属性には、ブラウザがシークできるメディア リソースの範囲が含まれます。通常、0 から開始してメディア リソースの再生時間で終了する 1 つの期間が含まれます。ただし、ライブ ストリームなどで再生時間が利用できない場合は、時間範囲が継続的に変更される可能性があります。

Media Source Extensions(MSE)を使用して、現在のバッファされた範囲と結合されている単一のシーク可能範囲を指定または削除することにより、seekable 範囲ロジックをより効果的にカスタマイズできるようになりました。メディアソースの再生時間が +Infinity の場合、シーク可能な範囲は 1 つになり、両方に一致します。

以下のコードでは、メディアソースはすでにメディア要素にアタッチされており、その init セグメントのみが含まれています。

const mediaSource = new MediaSource();
...

mediaSource.duration = +Infinity;
// Seekable time ranges: { }
// Buffered time ranges: { }

mediaSource.setLiveSeekableRange(1 /* start */, 4 /* end */);
// Seekable time ranges: { [1.000, 4.000) }
// Buffered time ranges: { }

// Let's append a media segment that starts at 3 seconds and ends at 6.
mediaSource.sourceBuffers[0].appendBuffer(someData);
// Seekable time ranges: { [1.000, 6.000) }
// Buffered time ranges: { [3.000, 6.000) }

mediaSource.clearLiveSeekableRange();
// Seekable time ranges: { [0.000, 6.000) }
// Buffered time ranges: { [3.000, 6.000) }

上記で取り上げなかったケースも多数あるため、公式サンプルをお試しになり、バッファリングされた時間範囲とシーク可能な時間範囲がさまざまな MSE イベントにどのように反応するかを確認することをおすすめします。

出荷の意向 | Chromestatus トラッカー | Chromium のバグ

MP4 形式の FLAC(MSE 用)

Chrome 56 以降、通常のメディア再生ではロスレス オーディオ コーディング形式 FLAC がサポートされています。ISO-BMFF 対応の FLAC(MP4 では別名 FLAC)がまもなく追加されました。また、Chrome 62 では Media Source Extensions(MSE)向けに MP4 の FLAC を利用できるようになりました。

なお、Firefox のユーザーは MP4 カプセル化仕様の FLAC のサポートを開発、実装しており、BBC は MSE でこの機能の使用をテストしています。詳しくは、BBC のラジオ 3 のコンサート サウンドの配信をご覧ください。

MP4 の FLAC が MSE でサポートされているかどうかを検出する方法は次のとおりです。

if (MediaSource.isTypeSupported('audio/mp4; codecs="flac"')) {
  // TODO: Fetch data and feed it to a media source.
}

完全なサンプルについては、公式サンプルをご覧ください。

出荷の意向 | Chromestatus トラッカー | Chromium のバグ

デバイスを回転させると、自動的に動画が全画面表示になる

ビューポートで動画を再生しているときにデバイスを横向きに回転すると、再生モードが自動的に全画面モードに切り替わります。デバイスを縦向きに回転すると、動画はウィンドウ モードに戻ります。詳しくは過去記事をご覧ください。