※NGP(Next Generation Player):
Brightcove(動画配信プラットフォーム)の最新プレイヤー。
読み込みが速い。
基本
プレイヤー管理画面で発行されるタグを貼り付ける。
発行されるタグにはiframe/インページの2種類ある。
※パフォーマンスには違いはないらしい。
iframeコード(基本的にはこちら推奨)
<iframe width='XXX' height='XXX' src='//players.brightcove.net/[アカウントID]/[プレイヤーID]_default/index.html?videoId=[ビデオID]' allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>
メリット
- iframeなので埋め込みページにあるJavaScript/CSSとの衝突がなく、扱いやすい。
- 確実にifrmaeタグで指定した大きさでプレーヤが描画される。
デメリット
- 埋め込みページからプラグインにパラメータを渡す公式的な仕組みは用意されていないので、プラグインでページ固有の値を受け取って処理をする、ということが困難。
(プレイヤー共通のパラメータであれば管理画面から設定可能)
※プラグインとは→Brightcove NGP(新プレイヤー)のプラグイン作成方法
インページコード
<video
id="allPlayer"
width="XXX"
height="XXX"
data-account="[アカウントID]"
data-player="[プレイヤーID]"
data-embed="default"
data-video-id="[ビデオID]"
class="video-js" controls
></video>
<script src="//players.brightcove.net/[アカウントID]/[プレイヤーID]_default/index.min.js"></script>
メリット
- 埋め込みページからプラグインにパラメータを渡せる。
デメリット
- 基本的には自動レスポンシブらしいが、iframeと異なり表示するページのJavaScript/CSSの影響を受けるので、意図しない表示や動作になる可能性がある。
どっちを使うか
- プラグインでページ固有の値を使わないならiframe、使うならインページ。
- 使う場合でも値が数種類に限定されるのであればプレイヤーをその分作成してiframeで埋め込み。
参考