머리말
Base64 다운로드는 이전 장에서 구현되었습니다. 브라우저 웹페이지 JavaScript는 이미지 및 다운로드에 대한 Base64 변환을 구현합니다 .
과거에는 스크린샷을 백그라운드에서 찍는 것이 일반적이었고 프론트엔드에서 미리 만들어진 이미지를 직접 얻을 수 있었지만, 현대의 브라우저 웹페이지에서는 점점 더 많은 일을 할 수 있어 웹페이지에서 동영상의 스크린샷을 직접 찍을 수 있습니다. 장에서는 이를 달성하는 방법을 설명합니다. JavaScript 웹페이지 비디오의 스크린샷과 원리 및 코드 구현을 다운로드합니다.
웹페이지 스크린샷 구현 원리
1. 캔버스 작업판 생성
2. 비디오 태그의 현재 재생 사진을 캔버스 작업판에 그리기
3. 캔버스 특성을 이용하여 현재 캔버스 작업판 사진을 base64 이미지로 변환
4. a 태그 생성
5 .a 태그의 특성을 이용하여 base64 이미지를 할당합니다. A 태그를 사용하면 스크린샷을 다운로드할 수 있습니다.
6. 태그 삭제
기능 코드 구현
구현은 두 부분으로 나누어집니다. 하나는 비디오 스크린샷이고 두 번째 부분은 이미지 다운로드입니다.
스크린샷 구현
var canvas = document.createElement('canvas')