W3C Mediaの機能

Media機能APIは、メディアの処理方法をプレーヤーがより適切に決定できるようにしたり、メディアがどの程度適切に処理されているかを判断したりするための重要な機能を提供します。このAPIは、MediaSourceメソッド、isTypeSupported()メソッド、HTMLMediaElementメソッド、canPlayType()メソッドを置き換えて改善します。このAPIを使用するプレーヤーでは、適切な情報に基づいて判断して、ハイダイナミックレンジ（HDR）のコンテンツがスタンダードダイナミックレンジ（SDR）の画面に配信されないようにすることができます。 World Wide Web Consortium（W3C）の仕様では、ユーザーエージェントを照会してオーディオとビデオのデコーディング機能を特定できるdecodingInfoメソッドが定義されています。このメソッドを使用すると、プレーヤーがその設定をサポートしているかどうか、また再生がスムーズであるか、あるいは省電力であることが期待されるかどうかを判断できます。 ShakaなどのJavaScriptプレーヤーは、decodingInfo()メソッドを使用して、再生の開始前にデバイスのメディア機能を検出します。このような場合は、decodingInfo()メソッドのVega実装を提供するポリフィルをアプリでインストールすると、プレーヤーがそれに応じて決定を行えるようになります。ポリフィルのインストール方法の詳細については、W3C Media機能のインストールとセットアップセクションを参照してください。

W3C Media機能の前提条件

W3C APIは、Vega SDKの一部としてメディア機能を実装しています。アプリでは、このAPIをpackage.jsonに依存関係として追加して、必要なインポートを取得する必要があります。

W3C Media機能のインストールとセットアップ

メディアプレーヤープロジェクトをセットアップします。
W3C Media機能の使用方法セクションの説明に従ってポリフィルをインストールします。

W3C Media機能の使用方法

Shaka Playerを使用するアプリ

Shaka Playerはリリースの一部としてポリフィルを提供しています。Vega用のShaka Playerリリースの詳細については、Shaka Playerを使用したアダプティブコンテンツ（HLS/DASH）の再生を参照してください。このポリフィルは、ナビゲーターを通じてdecodingInfo()メソッドを提供します。Shaka Playerは、実装を提供するときにこのdecodingInfo()メソッドを内部で使用します。コードに変更を加えずに新しい実装を適用するには、Shaka Playerのdistフォルダを更新します。

内部で`decodingInfo()`を使用するJavaScriptプレーヤーを使用するアプリ

decodingInfo()の実装を必要とするほかのプレーヤーを呼び出すアプリでは、手動でポリフィルをインストールする必要があります。

import {
    decodingInfo as decodingInfoImpl,
} from '@amazon-devices/react-native-w3cmedia';

class W3CMediaPolyfill {
    static install() {
        global.navigator.mediaCapabilities = ({});
        global.navigator.mediaCapabilities.decodingInfo = decodingInfoImpl;
    }
}

export default W3CMediaPolyfill;

// ポリフィルをインストールするには、W3CMediaPolyfill.install();を呼び出します。

HLS.jsプレーヤーとDASH.jsプレーヤーでは、decodingInfo()メソッドの使用方法に関して注意点があります。詳細については、よくある質問（FAQ）セクションを参照してください。

`decodingInfo()`に依存しないJavaScriptプレーヤーを使用するアプリ

TheoやBitmovinなどのプレーヤーは、decodingInfo()（英語のみ）ではなくcanPlayType（英語のみ）やisTypeSupported（英語のみ）を使用します。アプリでは、要件に合う場合は同じメソッドを引き続き使用できます。または、プレーヤーの外部でMediaCapabilities APIを呼び出し、その情報を使用して再生を開始することもできます。

import {
    decodingInfo as decodingInfoImpl,
} from '@amazon-devices/react-native-w3cmedia';

const contentType = 'video/mp4;codecs=avc1.640028';

const configuration = {
  type: 'media-source',
  video: {
    contentType: contentType,
    width: 640,
    height: 360,
    bitrate: 2000, // bps単位
    framerate: 29.97
  }
};

decodingInfoImpl(configuration)
  .then((result) => {
    console.log('Decoding of ' + contentType + ' is'
      + (result.supported ? '' : ' NOT') + ' supported,'
      + (result.smooth ? '' : ' NOT') + 'スムーズ、'
      + (result.powerEfficient ? '' : ' NOT') + '省電力');
  })
  .catch((err) => {
    console.error(err, 'が原因でdecodingInfoが拒否されました');
});

よくある質問（FAQ）

ドルビーサポートをチェックするにはどうすればよいですか？

decodingInfo()メソッドとisTypeSupported()メソッドのVega実装は、接続されているTVやAVRの機能も考慮した結果を返します。次のコード例は、decodingInfo()メソッドでドルビーサポートをチェックする場合に送信できる最小構成を示しています。

import {
    decodingInfo as decodingInfoImpl,
} from '@amazon-devices/react-native-w3cmedia';

const contentType = 'audio/mp4;codecs=ec-3';

const configuration = {
  type: 'media-source',
  audio: {
    contentType: contentType,
    channels: 5.1.1,
    sampleRate: 48000,
  }
};

decodingInfoImpl(configuration)
  .then((result) => {
    console.log('Decoding of ' + contentType + ' is'
      + (result.supported ? '' : ' NOT') + ' supported,'
      + (result.smooth ? '' : ' NOT') + ' smooth and'
      + (result.powerEfficient ? '' : ' NOT') + '省電力');
  })
  .catch((err) => {
    console.error(err, 'が原因でdecodingInfoが拒否されました');
});

HDRサポートをチェックするための最小構成はどのようになりますか？

ドルビーサポートと同様に、Vega実装を使用して、接続されているTVやモニターのHDRサポート機能をチェックできます。

import {
    decodingInfo as decodingInfoImpl,
} from '@amazon-devices/react-native-w3cmedia';

// 有効なcodecsパラメーターを指定する必要があります。
const contentType = 'video/webm;codecs=vp09.2.10.10.0.9.16.10.1';// プロファイル2、レベル1、10ビット深度、BT2020

const configuration = {
  type: 'media-source',
  video: {
    contentType: contentType,
    width: 640,
    height: 360,
    bitrate: 2000, // bps単位
    framerate: 29.97,
    hdrMetadataType: "smpteSt2086" // HDR10（HDR10+の場合はsmpteSt2094-40）
  }
};

decodingInfoImpl(configuration)
  .then((result) => {
    console.log('Decoding of ' + contentType + ' is'
      + (result.supported ? '' : ' NOT') + ' supported,'
      + (result.smooth ? '' : ' NOT') + 'スムーズ、'
      + (result.powerEfficient ? '' : ' NOT') + '省電力');
  })
  .catch((err) => {
    console.error(err, 'が原因でdecodingInfoが拒否されました');
});

Dash.jsでdecodingInfo()を有効にするにはどうすればよいですか？

Dash.jsプレーヤーに対してdecodingInfo()のVega実装を使用するには、アプリでポリフィルをインストールする必要があります。Dash.jsプレーヤーの4.0.0リリースでは、MediaCapabilities APIのサポートが導入されました。注： isTypeSupported()メソッドではなくdecodingInfo()を使用するには、useMediaCapabilitiesApiの値をtrueに設定します。

HLS.jsプレーヤーで有効にするにはどうすればよいですか？

HLS.jsプレーヤーに対してdecodingInfo()のVega実装を使用するには、アプリでポリフィルをインストールする必要があります。HLS.jsプレーヤーの1.5.0-アルファリリースでは、MediaCapabilities APIのサポートが導入されました。HlsConfigでuseMediaCapabilitiesを有効にしてください。注： HLS.jsプレーヤーでdecodingInfo()メソッドが使用されるのは、GitHubのHLS.jsリポジトリ内のmediacapabilities-helper.tsソースファイルで言及されている特定のシナリオの場合です。

W3C Media機能のトラブルシューティング

このAPIは、MIMEタイプの「codecs」パラメーターに依存してプロファイル、レベル、コーデックタイプなどを検出します。エラーが発生した場合は、この値が適切に渡されているかどうかを確認してください。プレーヤーでMIMEタイプを検出できない場合は、無効なMIMEタイプ（MIME標準（英語のみ）に準拠していないMIMEタイプ）が渡されている可能性があります。この場合、実際のコンテンツがデバイスでサポートされていてもエラーになります。

Vegaアプリの開発

W3C Media機能の前提条件

W3C Media機能のインストールとセットアップ

W3C Media機能の使用方法

Shaka Playerを使用するアプリ

内部で`decodingInfo()`を使用するJavaScriptプレーヤーを使用するアプリ

`decodingInfo()`に依存しないJavaScriptプレーヤーを使用するアプリ

よくある質問（FAQ）

W3C Media機能のトラブルシューティング

関連トピック

​W3C Media機能の前提条件

​W3C Media機能のインストールとセットアップ

​W3C Media機能の使用方法

​Shaka Playerを使用するアプリ

​内部でdecodingInfo()を使用するJavaScriptプレーヤーを使用するアプリ

​decodingInfo()に依存しないJavaScriptプレーヤーを使用するアプリ

​よくある質問（FAQ）

​W3C Media機能のトラブルシューティング

​関連トピック

W3C Media機能の前提条件

W3C Media機能のインストールとセットアップ

W3C Media機能の使用方法

Shaka Playerを使用するアプリ

内部で`decodingInfo()`を使用するJavaScriptプレーヤーを使用するアプリ

`decodingInfo()`に依存しないJavaScriptプレーヤーを使用するアプリ

よくある質問（FAQ）

W3C Media機能のトラブルシューティング

関連トピック