HTML5ビデオタグでランダムなプレビュー画像を生成する

Question

HTML5ビデオ要素を使用して読み込まれた動画のスナップショットをキャプチャし、動画がロードされるか再生イベントが発生するまでプレビュー画像として使用できますか？私はポスターの属性について知っていますが、ビデオのランダムなフレームのように、サムネイルを自己生成することを望みます。 YouTube/Vimeoの動作を並べ替えます。

おかげで、

Answer 1

私は、これは純粋なHTML5で可能であるとは思いません。主に、Webページで 'オブジェクト'が表示されたときにストリームが読み込まれないため、クライアントが目的のフレームを取得できないためです。

ただし、最良の選択肢はです。をロードする前に「ランダムなフレーム」を保存してキャッシュしてから、ビデオのポスターとして使用してください。これにより、クライアントの作業を減らし、帯域を節約できます。

私が見つけた最初のものですチェックTHIS、（あなたがPHPを使用していて、フレームを取得するための「迅速かつ汚い」方法をしたい場合）

更新

明らかにHEREにはpopcorn.jsの解決策がありますが、あなたが必要とする方法ではできないようです。

これは、ブラウザのセキュリティ上の問題により、同じドメイン内でのみ実行できるためです。