Chromecastプラグイン Brightcove Player

概要

Google Chromecastは、テレビのHDMIポートに接続するデバイスです。スマートフォンまたはパソコンをリモコンとして使用すると、Chromecastを使用して動画コンテンツにアクセスできます。 Chromecastプラグイン Brightcove Player その player デスクトップまたはAndroidChromeブラウザからChromecastデバイスにビデオをキャストします。

プラグインはすべてをサポートします Video Cloud Widevineを使用したDRM暗号化ストリームを含む、HLSまたはDASHを使用したビデオまたは外部ストリーム。広告はを通じてサポートされています Video Cloud サーバーサイド広告挿入（SSAI）。クライアント側の広告とプレイリストはサポートされていません。

プラグインを使用するには、次の手順に従います。

のChromecastプラグインを読み込む Brightcove Player （詳細は後述）。
Chromecastデバイスが、動画を再生するデバイスと同じネットワーク上にあることを確認してください。
ビデオの再生を開始します。
キャストボタンをクリックし、Chromecastデバイスを選択します。

Chromecastアプリコンポーネント

Chromecastの背後にあるソフトウェアは、次のコンポーネントで構成されています。

送信者アプリケーション：これは、キャストセッションを開始し、受信者と通信できる任意のアプリケーションです。送信者アプリケーションは、Chromecastエコシステムの「クライアント側」の部分と考えることができます。

Chromecast用プラグイン Brightcove Player の送信者アプリを有効にします Brightcove Player。このトピックでは、そのことについて学習します。
レシーバーアプリケーション：これは、パブリックインターネットでホストされ、Chromecastデバイスで実行されるカスタムWebアプリケーションです。送信者アプリと受信者デバイス間の通信を処理します。これは、CSSおよびJavaScriptアセットを備えた単一ページのHTMLアプリと考えることができます。

Chromecastがドメイン制限付きで動作するため players、Chromecast受信者のドメインをホワイトリストに登録する必要があります。 players.brightcove.net.

Requirements

Chromecastプラグインには次の要件が必要です。

Brightcove Player v6.45.0以降
Brightcove Chromecastプラグインv2.0.0以降

Devices

次のデバイスがサポートされています。

Chromecast（第3世代）
ウルトラのChromecast
Google TVを搭載したChromecast（予備サポート）

ディフューザーを支えるテクノロジー

現在の実装（プラグイン/レシーバーバージョン2.x）は、CAF（Cast Application Framework）APIを使用しています。

Chromecastレシーバープラグインが追加されると、 player にキャストボタンが表示されます player ローカルネットワーク上に利用可能なChromecastがある場合のUI。

このボタンがクリックまたはタップされると、キャストセッションが開始され、現在のビデオがロードされます。 Brightcove Player。仕組みは次のとおりです。

プラグインは一連のパラメーターをレシーバーに送信します。
受信者は送信をミラーリングします player からロードすることによって BrightcoveのCDN。
ロードされると、レシーバー側 player からビデオIDをロードします Playback API キャストセッションが始まったときに送信されました。
次に、受信側 player 送信の再生ヘッド位置で再生を開始します player.

このプロセスは、Video Cloud ない以外のソース Playback API リクエストで詳細に指定された通りになります。

アナリティクス

現在、分析の観点から、キャストセッションはまったく新しい再生セッションとして扱われます。

UXの観点からは、視聴者は送信側デバイスでストリームが一時停止し、受信側で再開するのを確認できます。

データの観点からは、メトリックはデフォルトで匿名化されているため、別のデバイスで新しいストリームを開始する新しいビューアとしてログに記録されます。これが実際に起こることです。

プラグインの使用

Chromecast用プラグイン Brightcove Player 他のすべてと同じように使用されます Brightcove Player プラグイン、つまり、プラグインを player.

使い方 Studio

次の手順の詳細は Studio プラグインをロードします。

Video Cloud Studioで PLAYERS モジュールと新しいのいずれかを作成します player または見つけます player プラグインを追加する場所。
のリンクを選択します player を開く playerのプロパティ。
左側のナビゲーションメニューで、を選択します。 プラグイン.
次に、 プラグインを追加する ボタンをクリックし、次に Brightcove プラグイン.

プラグインボタンを追加する
拡大する Brightcove プラグイン ドロップダウンして選択 Chromecast Receiver.

Chromecast Receiver
各種オプション：に設定オプションを入力します。 オプション（JSON） テキストボックス。デフォルトの例 player 1752604059001 アカウントが表示されます。もちろん、あなたの情報を入力する必要があります player.
```
{
"playerUrl" : "https://players.brightcove.net/1507807800001/default_default/index.min.js"
}
```
オプションの詳細については、以下を参照してください。
現在地に最も近い保存ボタン。あなたは今見るでしょう Chromecast Receiver プラグインがプラグインのリストに追加されました player.

プラグインを追加しました
公開するには player選択 公開と埋め込み>変更の公開.
開いているダイアログを閉じるには、を選択します。 閉じる.
に戻る MEDIA を使用してビデオまたはプレイリストを公開します player Chromecast用に更新しました。

プラグインが読み込まれ、動画の再生が始まり、利用可能なChromecastデバイスが範囲内にある場合、キャストボタンが player このスクリーンショットで示されているように、 player:

Chromecastプラグインのキャストボタンが player利用可能なChromecastデバイスが範囲内にあるときののコントロールバー。

手動で構成する

JSONエディターを使用してプラグインを追加するには、次の手順に従います。

Video Cloud Studioで PLAYERS モジュールと新しいのいずれかを作成します player または見つけます player プラグインを追加する場所。
のリンクを選択します player を開く playerのプロパティ。
左側のナビゲーションメニューで、を選択します。 JSONエディタ.

JSONエディタ

オブジェクトをに追加します plugins 配列

コードは次のようになります。

{
  "compatibility": true,
  "video_cloud": {
    "policy_key": "your policy key"
  },
  "player": {
    "template": {
      "name": "single-video-template",
      "version": "6.45.4"
    }
  },
  "studio_configuration": {
    "player": {
      "responsive": true,
      "height": 540,
      "width": 960,
      "units": "px"
    }
  },
  "plugins": [
    {
      "name": "chromecastReceiver",
      "options": {},
      "stylesheets": ["https://players.brightcove.net/videojs-chromecast-receiver/2/videojs-chromecast-receiver.css"],
      "scripts": ["https://players.brightcove.net/videojs-chromecast-receiver/2/videojs-chromecast-receiver.js"]
    }
  ]
}

オプションの詳細については、以下を参照してください。

設定オプション

Chromecastプラグインを設定する方法に関係なく、 Brightcove Player、プラグインの動作を変更するオプションを渡すことができます。これらのオプションを設定する必要はありませんが、上級ユーザー向けに追加のカスタマイズが可能です。

コードでオプションを渡すには、次のようなものを使用します。

videojs.getPlayer('myPlayerID').ready(function() {
  var myPlayer = this;
  options = {};
  options.playerUrl = '//players.brightcove.net/1752604059001/default_default/index.min.js';
  myPlayer.chromecastReceiver(options);
});

アドバイス

あなたのウェブの場合 player（s）多数のプラグインまたはカスタムスクリプトが含まれているため、軽量の作成を検討する必要があります player 特にChromecastの再生用です。

ウェブ以来 player また、その再生エンジンはリソースをいくらか消費し、リソースに制約のある環境（Chromecastなど）で実行すると、重いスクリプトが追加されると、ユーザーエクスペリエンスに悪影響を与える可能性があります。

オプション

Chromecastプラグインは、次のオプションをサポートしています。

options.playerUrl
種類: string
デフォルト：''
デフォルトでは、送信側 player 受信機にミラーリングされます。このオプションを使用して、カスタムの受信側を提供できます Brightcove Player URL。

これは Brightcove player レシーバーにロードされている場合は、 player Chromecast外。

これはへのURLである必要があります index.min.js 上のファイル Brightcove CDN
options.splashScreen
種類: string
デフォルト：''
ビデオの前およびビデオの切り替え時に表示されるスプラッシュ画面。

options.authRequest
種類: string or object or function
デフォルト：{}

動画がリクエストされる前にコンテンツを再生するための認証を取得するリクエストをChromecastが実行する必要がある場合は、このオプションを使用できます。

これを使用してCookieを取得することもできますが、サーバーを設定して許可する必要があります players.brightcove.net 独自のコンテンツをホストしている場合は、クロスドメインCookieを設定する機能。

文字列の使用法

ブドウやコーヒーチェリーのような甘い果実の発酵過程において、野生酵母は糖類を用いてアルコール発酵します。アルコールは酢酸菌によって更に酢酸（お酢）に転化します。 authRequest が文字列の場合、そのURLに対して空のGETリクエストが行われます。

オブジェクトの使用法

ブドウやコーヒーチェリーのような甘い果実の発酵過程において、野生酵母は糖類を用いてアルコール発酵します。アルコールは酢酸菌によって更に酢酸（お酢）に転化します。 authRequest はオブジェクトであり、特定のリクエストペイロードプロパティを指定するために使用できます。

プロパティ	種類	必須	デフォルト	説明
`url`	`string`	はい	`''`	リクエストするURL
`method`	`string`	いいえ	`GET`	使用するHTTPメソッド
`body`	`string`	いいえ	`''`	リクエスト本文
`headers`	`object`	いいえ	`{}`	キーがヘッダー名で、プロパティがヘッダー値であるHTTPヘッダーを記述するオブジェクト
`withCredentials`	`boolean`	いいえ	`false`	キーがヘッダー名で、プロパティがヘッダー値であるHTTPヘッダーを記述するオブジェクト
`timeout`	`number`	いいえ	`15000`	認証要求をあきらめるまでに待機するミリ秒数

関数の使用法

ブドウやコーヒーチェリーのような甘い果実の発酵過程において、野生酵母は糖類を用いてアルコール発酵します。アルコールは酢酸菌によって更に酢酸（お酢）に転化します。 authRequest は関数であり、それらの使用法ごとに文字列またはオブジェクトのいずれかを返す必要があります。

制限と既知の問題

HEVC / 4Kコンテンツは、ChromecastUltraデバイスとGoogleTVデバイスを搭載した新しいChromecastでのみサポートされます。
クライアント側の広告は現在サポートされていませんが、SSAIはサポートされています！
キャプショントラックが選択されて受信者に表示された後、送信者を探す際に問題が発生しました。
Google TVデバイスを搭載したChromecastでは、キャプションを使用する際のUIと再生の問題が発生しています。
GoogleはChromecastでの非セキュアオリジン（HTTP）のサポートを停止したため、プラグインは非セキュアコンテキストでは機能しません。これらの場合、 playerのChromecastボタンは表示されません。
Chromecastプラグインはキャストのブラウザのサポートに依存しているため、次のOSとブラウザの組み合わせでのみサポートされます。
- デスクトップ/ Chrome
- Android / Chrome
Googleでは、XNUMXつのページでChromecast送信者ボタンの複数のインスタンスをサポートしていません。可能な回避策は、 Brightcove Player 標準（iframe）の使用 player 実装、または動的にインスタンス化して破棄する player必要に応じて。ドキュメントを見る Brightcove Player サンプル：の読み込み Player 動的に後者の可能性についての情報
このプラグインはGoogle Nest Hubにキャストしません。プラグインは、実際のChromecastデバイス（ChromecastやChromecast Ultraなど）のみをサポートしています。

v1.xからv2.xへの変更

v2 ChromecastAPIの代わりにCAFAPIを使用するなどの内部変更に加えて、次のインターフェースが変更されました。

options.css と options.js サポートされなくなりました。
customData.analyticsParams 追加されました
customData.catalogData 名前が変更されました customData.catalogParams 他の使用法との一貫性を向上させるため
customData.policyKey に置き換えられました customData.catalogParams.policyKey
customData.keySystems 追加されました

変更履歴

見ます変更履歴はこちら.