YouTubeの動画のスクショを撮る

    @@ -9,8 +9,8 @@ const query = '.video-stream.html5-main-video'; const video = document.querySelector(query); const canvas = document.createElement('canvas'); - canvas.width = parseInt(video.style.width); - canvas.height = parseInt(video.style.height); + canvas.width = parseInt(video.style.width, 10); + canvas.height = parseInt(video.style.height, 10); const ctx = canvas.getContext('2d'); ctx.drawImage(video, 0, 0, canvas.width, canvas.height); const url = canvas.toDataURL('application/octet-stream');
  • /*
     * @title YouTubeの動画のスクショを撮る
     * @description YouTubeの動画の現在位置のスクリーンショットを撮って、新しいタブに表示します。
     * @include https://www.youtube.com/*
     * @license MIT License
     * @javascript_url
     */
    (() => {
        const query = '.video-stream.html5-main-video';
        const video = document.querySelector(query);
        const canvas = document.createElement('canvas');
        canvas.width = parseInt(video.style.width, 10);
        canvas.height = parseInt(video.style.height, 10);
        const ctx = canvas.getContext('2d');
        ctx.drawImage(video, 0, 0, canvas.width, canvas.height);
        const url = canvas.toDataURL('application/octet-stream');
        const newWindow = window.open('about:blank');
        newWindow.document.write(`<img src="${url}">`);
    })()
  • Permalink
    このページへの個別リンクです。
    RAW
    書かれたコードへの直接のリンクです。
    Packed
    文字列が圧縮された書かれたコードへのリンクです。
    Userscript
    Greasemonkey 等で利用する場合の .user.js へのリンクです。
    Loader
    @require やソースコードが長い場合に多段ロードする Loader コミのコードへのリンクです。
    Metadata
    コード中にコメントで @xxx と書かれたメタデータの JSON です。

History

  1. 2019/07/07 15:17:37 - 2019-07-07
  2. 2019/07/07 15:08:44 - 2019-07-07
  3. 2019/07/07 14:44:05 - 2019-07-07