javascript - JavaScriptでビデオの最初のフレームを取得します

Question

JavaScriptでビデオファイルの最初のフレームを画像として取得するにはどうすればよいですか？

score 6 · Accepted Answer

コントロールも自動再生もなしで、ビデオタグをページに追加するだけです。

<video width="96" height="54" class="clip-thumbnail"> ... </video>

欠点は、ユーザーがサムネイルを右クリックし、コンテキストメニューで [再生] を選択すると、ビデオを再生できることです。クリックイベントをリッスンしてキャンセルする（サムネイルからコンテキストメニューを削除する）小さなJavaScriptが必要になるのを避けるために。

score 2 · Accepted Answer

2

Javascriptはこれを行うことができません。

于 2009-07-21T15:53:59.393 に答える

score 2 · Accepted Answer

前述のとおり、Javascript ではこれを行うことができません。

ビデオのサムネイルを作成する場合は、サムネイルサーバー側を作成し、他の画像と同じようにクライアントで画像を提供するだけです。

これを達成するために私が選んだ方法は、ffmpegデコーダーです。多数のファイル形式を処理でき、必要なことを実行できます。という名前のビデオがある場合は、次のhello.aviようにします。

ffmpeg -itsoffset -1 -i /path/to/hello.avi -vcodec mjpeg -vframes 1 -an -f rawvideo -s 200x150 /path/to/hello.jpg

このコマンド (パスとサイズを修正する...) を使用しているサーバー側の言語で実行すると、ビデオファイルのサムネイルが作成されます。

score 0 · Accepted Answer

ビデオがユーザーによって選択されたファイルである場合<input type="file">、FileReader API を使用して base-64 ビデオデータを取得できます。

そこから、ビデオをデコードし、javascript で単一のフレームを何らかの方法で選択してレンダリングするという非常に扱いにくい問題が残ります。または、ここに示すように、ビデオ全体を「サムネイルプレビュー」として含めることもできます (これが、これを行っている理由だと思いますか?)。

ただし、最後の例の互換性や、より大きなビデオファイルでどれだけうまく機能するかについてはわかりません (URL の長さの制限に簡単にぶつかることができると聞きました)。

5 に答える 5