内部イベント
Video.jsの場合、以下のようなタイミングで内部イベントが発生します。(全リスト、参考：HTML5 Video Event)
- 視聴関連
- play
- 視聴開始(ユーザが視聴ボタンを押した)
- autoplayの場合発生しない
- 視聴開始(ユーザが視聴ボタンを押した)
- playing
- 視聴開始
- timeupdate
- 視聴位置が変更された
- 15～250ミリ秒単位で発生する
- シークを実行すると、シークで飛ばした時間分のイベントが発生する
- 視聴位置が変更された
- pause
- 視聴が停止された
- ended
- 視聴がメディアの最後に到達した
- seeking
- シークが行われている
- seeked
- シークが終わった(新しい視聴ポイントに移動した)
- play
- データ取得関連(再生時のイベント発生順)
- loadstart
- メディアのダウンロードが開始された
- firstplay
- そのページにおける1回目の再生である
- progress
- メディアをダウンロード中
- suspend
- メディアのダウンロードを停止
- 一定以上先読みするとメディアファイルの読み込みを停止する
- メディアのダウンロードを停止
- durationchange
- メディアの継続時間が変更された(設定された)
- loadedmetadata
- HAVE_METADATA状態
- メタデータの読み出しが終了した
- HAVE_METADATA状態
- loadeddata
- HAVE_CURRENT_DATA状態
- 現在のフレームに対するメディアデータを受信した
- HAVE_CURRENT_DATA状態
- canplay
- HAVE_FUTURE_DATA状態
- 早送りが可能だだけメディアデータを受信した
- HAVE_FUTURE_DATA状態
- canplaythrough
- HAVE_ENOUGH_DATA状態
- HAVE_FUTURE_DATAかつ以下の条件を満たす
- バッファリング無しに再生可能、もしくは、バッファに余地無し
- HAVE_FUTURE_DATAかつ以下の条件を満たす
- HAVE_ENOUGH_DATA状態
- loadstart
基本的な実装としては、これらのイベントをそのままAPIサーバにビーコンとして送信します。
以下のサンプルページでは各イベントが発生したタイミングでjavascriptコンソールにイベント名を出力しています(Developer Tools等で確認できます)：
- https://tech.jstream.jp/analytics/ex0/play.php
- https://tech.jstream.jp/analytics/ex0/play-adaptive.php
APIサーバで取得したイベント(ビーコン)のサンプルは以下のようになります(eventNameにイベントが格納されます。詳細は後述します)。
- analytics-ex0-beacon-sample-full
- プレイヤーは1秒単位でビーコン呼び出し、すべてのイベントをビーコンとして送出
- analytics-ex0-beacon-sample-sum
- プレイヤーは1秒単位でビーコン呼び出し、timeupdateについては1秒単位でまとめて送出
次回は、上記サンプルページ(プレイヤーのビーコン送出)の詳細について解説します。