序文
この章では、Web ページのビデオ タグを実装して、MP4 ビデオまたは WebM ビデオを記録してダウンロードします。
ビデオ録画などのコンピューティング集約型タスクは比較的重いため、バックグラウンドでの実装に適しています。この章は、フロントエンド タスクがそれほど重くない短期間のビデオ録画に適しています。長期録画の場合は、バックグラウンドで記録し、ダウンロード アドレスを Web フロントエンドに提供することをお勧めします。
したがって、この章は短期間のビデオの録画とダウンロードにのみ適用され、長時間録画されたビデオはブラウザのフリーズや速度低下などの問題を引き起こす可能性があります。
ビデオ スクリーンショットの機能「ブラウザ Web ページ JavaScript は、ビデオのスクリーンショットとダウンロード、base64 画像のダウンロード、ビデオ タグ、hls.js、flv.js、webrtc およびビデオの再生とダウンロードのその他のメソッドを実装します」は以前に実装されました。スクリーンショット機能を参照できます。
いくつかの質問に対する答え:
注意する必要があるのは、video/mp4 と video/mp4; codecs="avc1.4D4028, mp4a.40.2 の違いです。ここでの違いは、avc1 エンコードと h.264 エンコードの違いです。
ビデオ/WebM エンコードは vp8、vp9、av1 に分かれていますが、すべてのブラウザがこれらのエンコードをサポートしているわけではありません。
ブラウザの互換性
ブラウザはすべてのビデオ形式をサポートしているわけではありません。サポートされている形式は非常に限られており、サポートされている形式はブラウザによって異なります。そのため、録画する前にブラウザの互換性を確認し、互換性に応じて録画されたビデオ形式を調整することが最善の方法です。 . .
ブラウザのメディア互換性を検出する方法
//检查媒体兼容性