ドメイン制限メッセージング
概要
ドメイン制限により、動画を見ることができる場所を制限することができます。プレーヤーコンテンツ制限の設定ドキュメントでは、Video Cloud を使用してドメイン制限を適用する方法について説明します。今読んでいるドキュメントでは、プレーヤーがドメイン制限を使用していることをユーザーに通知するコードの実装方法を説明します。
デフォルトでは、Brightcove Player は、視聴しようとしている動画がドメイン制限付きプレーヤーにあることをユーザーに通知しません。プレーヤーは単に黒い画面を表示します。コンソールを表示すると、次のように表示されます。
これはそれほど役に立ちませんが、チェックすると通信網タブをクリックし、名前動画IDに対応しているので、プレビュータブをクリックすると、より明るいエラーが表示されます。
このドキュメントは、視聴しようとしている動画がドメイン制限されていることをユーザーに知らせるための戦略を実装しています。
プレーヤーカタログのエラーオブジェクト
ユーザーフレンドリーなメッセージを作成するための鍵は、Brightcove Player error
に含まれるオブジェクトですcatalog
。ドメイン制限エラーの例を、ブラウザのコンソールからのスクリーンショットに以下に示します。オブジェクトにはプロパティが含まれていることに注意してください。data
プロパティ自体には配列が含まれています。アレイには、カタログがビデオのロード時に遭遇した最後のエラーを保持します。この例では、配列内の要素がドメイン制限の問題を報告していることがわかります。
bc-catalog-errorを処理する
ready()
script
ブロック内の通常のセクションでエラーを処理すると、問題が発生する可能性があります。たとえば、bc-catalog-error
プレイヤーが準備できる前にイベントが送出され、ready()
セクション内のエラーを聞くと、エラーを処理することはできません。コードに問題はないかもしれませんが、問題はブラウザに依存する可能性がありますので、注意してください。このため、このドキュメントのエラー処理コードは、one()
イベント処理メソッドを使用して、bc-catalog-error
別のコードブロックでをリッスンしますready()
セクションの内側ではなく。
HTML 形式のメッセージ
生成されたエラーの構造とその場所を理解したら、JavaScript を使用してユーザーに説明的なエラーを表示できます。基本的な実装手順は次のとおりです。
- メッセージを表示するターゲット要素を作成します。
- プレイヤーが行動する準備ができていることを確認してください。
- エラーが発生したかどうかを確認します。
- はい、エラーがドメイン制限の問題であるかどうかを確認します。
- はいの場合は、ユーザーにメッセージを表示します。
次のコードは、これらの手順を実装します。
- 8行目:テキストを挿入する HTML 要素(この場合は段落)を挿入します。
id
ターゲット設定のために、要素にを与えます。 - 13行目:
one()
メソッドを使用して、イベントのイベントリスナーをbc-catalog-error
1 回だけ追加します。 - 16行目です:
if
ステートメントを使用して、何らかのエラーが発生したことを確認します。 - 17行目:Brightcove Player カタログのエラーオブジェクトから特定のエラー情報を変数に割り当てます。
- 18行目線:
if
ステートメントを使用して、特定のエラー情報が存在し、エラーの種類がドメイン制限によるものであることを確認します。 - 19行目:12 行目で作成された HTML 要素に、適切なテキストメッセージを注入します。
<video-js id="myPlayerID"
data-video-id="3495887198001"
data-account="1507807800001"
data-player="4c8eb732-ba76-485c-a906-407365721633"
data-embed="default"
class="video-js" controls></video-js>
<p id="textTarget"></p>
<script src="https://players.brightcove.net/1507807800001/4c8eb732-ba76-485c-a906-407365721633_default/index.min.js"></script>
<script type="text/javascript">
videojs.getPlayer('myPlayerID').one('bc-catalog-error', function(){
var myPlayer = this,
specificError;
if (myPlayer.catalog.error !== undefined) {
specificError = myPlayer.catalog.error.data[0];
if (specificError !== undefined & specificError.error_subcode == "DOMAIN") {
document.getElementById("textTarget").innerHTML = "The video you are trying to watch cannot be viewed as it is domain restricted.";
};
};
});
videojs.getPlayer('myPlayerID').ready(function() {
var myPlayer = this;
console.log('in ready');
});
</script>
次のスクリーンショットは、プレーヤーの下に表示されるメッセージを示しています。
エラープラグインを介したメッセージ
動画がドメイン制限されている場合は、プレーヤーにメッセージを表示することもできます。エラープラグインを使用してこれを行うことができます。エラープラグインは自動的にプレーヤーにロードされるため、その操作を明示的に実行する必要はありません。ここで説明するもの以外のエラープラグインの詳細については、エラーメッセージの表示プラグインのドキュメントを参照してください。
- 43行目線:
one()
メソッドを使用して、イベントのイベントリスナーをbc-catalog-error
1 回だけ追加します。 - 46〜53行目は次のとおりです。
error()
プレーヤーのメソッドを呼び出し、errors
表示する情報を定義する JSON を引数として渡します。-3
エラーコードの選択は任意であり、唯一のガイダンスは標準のエラーコード(現1-5)を使用しないことです。 - 57行線:
error()
メソッドを呼び出して、カスタムエラー情報を表示します。ドメイン制限エラーが発生したかどうかを判断するために使用されるロジックは、上記と同じです。引数として渡されたオブジェクトは、表示するエラーメッセージを定義します。
<script type="text/javascript">
videojs.getPlayer('myPlayerID').one('bc-catalog-error', function(){
var myPlayer = this,
specificError;
myPlayer.errors({
'errors': {
'-3': {
'headline': 'The video you are trying to watch cannot be viewed because of domain restrictions.',
'type': 'DOMAIN'
}
}
});
if (typeof(myPlayer.catalog.error) !== 'undefined') {
specificError = myPlayer.catalog.error.data[0];
if (specificError !== 'undefined' & specificError.error_subcode == "DOMAIN") {
myPlayer.error({code:'-3'});
};
};
});
videojs.getPlayer('myPlayerID').ready(function() {
var myPlayer = this;
});
</script>
次のスクリーンショットは、定義されたエラーのエラープラグインの表示を示しています。
一般的なエラー表示
上記の 2 つのセクションでは、地理制限されたビデオが制限されたロケールから表示されたときに生成されるエラーの表示について説明します。一部のエラーでは、ドメイン制限の詳細レベルが提供されません。この種類のエラーオブジェクトの例を次に示します。に注意してくださいデータフィールドは空ですが、ドメイン制限エラーでは、キーエラー情報が含まれていました。
次のコードは、からの情報を表示する方法を示していますcatalog.error
詳細のレベルに関係なく。高レベルでは、コードは次のことを実行します。
- カタログエラーが発生したかどうかをチェックします。
data
エラーオブジェクト内のフィールドに特定のエラー情報が含まれているかどうかをチェックします。そうでない場合は、一般的なエラーメッセージが HTML に挿入されます。- 特定のエラー情報があり、それがドメイン制限に関連する場合は、適切なメッセージがHTMLに挿入されます。
- 特定のエラー情報があり、それがドメイン制限に関連していない場合、特定のエラーメッセージが HTML に挿入されます。
<script type="text/javascript">
videojs.getPlayer('myPlayerID').one('bc-catalog-error', function(){
var myPlayer = this,
specificError;
if (myPlayer.catalog.error != undefined) {
specificError = myPlayer.catalog.error.data[0];
if (specificError == undefined) {
document.getElementById("textTarget").innerHTML = "The following error has occurred: <strong>" + myPlayer.catalog.error.message + "</strong>";
} else if (specificError.error_subcode == "DOMAIN") {
document.getElementById("textTarget").innerHTML = "The video you are trying to watch cannot be viewed because of domain restrictions.";
} else {
document.getElementById("textTarget").innerHTML = "The following error has occurred: " + specificError.message;
};
};
});
videojs.getPlayer('myPlayerID').ready(function() {
var myPlayer = this;
});
</script>
次のスクリーンショットは、HTMLで表示されている一般的なエラーメッセージを示しています。もちろん、このドキュメントの前のセクションで示したように、エラープラグインを使用してメッセージを表示することもできます。