[JS]<video> 태그의 동영상 캡쳐하기

<canvas>를 만들어 동영상을 그리게 한 다음 다운로드하면 된다.

<video id="player" src="/path/to/video.mp4"></video>
<button onclick="capture()">캡쳐</button>

<script>
    function capture() {
        const video = document.getElementById("player");
        const canvas = document.createElement("canvas");
        canvas.width = video.videoWidth;
        canvas.height = video.videoHeight;
        canvas.getContext("2d").drawImage(video, 0, 0, canvas.width, canvas.height);
        const dataURL = canvas.toDataURL("image/png");
        const a = document.createElement("a");
        a.href = dataURL;
        a.download = "capture.png";
        a.click();
    }
</script>