序文
Base64 ダウンロードは前の章で実装されました。ブラウザの Web ページ JavaScript は画像への Base64 変換とダウンロードを実装します。
以前は、スクリーンショットはバックグラウンドで取得されるのが一般的で、フロントエンドは既製の画像を直接取得できましたが、最新のブラウザ Web ページではできることがますます増えているため、Web ページ上のビデオのスクリーンショットを直接取得できます。この章では、これを実現する方法について説明します。JavaScript Web ページのビデオのスクリーンショットと、原理とコードの実装をダウンロードします。
Webページのスクリーンショットの実装原則
1. キャンバス描画ボードを作成します
。 2. ビデオタグの現在の再生画像をキャンバス描画ボードに描画します。
3. キャンバスの特性を使用して、現在のキャンバス描画ボード画像を Base64 画像に変換します
。 4. a タグを作成します。
5. を使用します。 Aタグにbase64画像を割り当てるaタグの特徴 スクリーンショットをダウンロードできるようにする
6.タグを削除する
関数コードの実装
実装は 2 つの部分に分かれており、1 つはビデオのスクリーンショットで、2 番目の部分は画像のダウンロードです。
スクリーンショットの実装
var canvas = document.createElement('canvas')