Get data url

input resource url and get data url

이 스크립트를 설치하려면 Tampermonkey, Greasemonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

You will need to install an extension such as Tampermonkey to install this script.

이 스크립트를 설치하려면 Tampermonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Userscripts와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 유저 스크립트 관리자 확장 프로그램이 필요합니다.

(이미 유저 스크립트 관리자가 설치되어 있습니다. 설치를 진행합니다!)

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

(이미 유저 스타일 관리자가 설치되어 있습니다. 설치를 진행합니다!)

// ==UserScript==
// @name        Get data url
// @namespace   https://blog.bgme.me
// @match       *://*/*
// @run-at      document-idle
// @version     1.0
// @author      bgme
// @description input resource url and get data url
// @supportURL  https://github.com/yingziwu/Greasemonkey/issues
// @icon        -
// @license     AGPL-3.0-or-later
// ==/UserScript==

"use strict";

unsafeWindow.toDataURL = toDataURL;
unsafeWindow.getDataURL = getDataURL;

// https://stackoverflow.com/questions/934012/get-image-data-url-in-javascript/42916772#42916772
function toDataURL(url, callback) {
  GM.xmlHttpRequest({
    method: "GET",
    url: url,
    responseType: "blob",
    onload(response) {
      var fr = new FileReader();

      fr.onload = function () {
        callback(this.result);
      };

      fr.readAsDataURL(response.response);
    },
  });
}

function getDataURL(url) {
  toDataURL(url, function (dataurl) {
    console.log(dataurl);
  });
}