Преобразование всех изображений на странице в base64

При работе с копированием информации с различных сайтов периодически возникает потребность вставлять скопированный текст с изображениями в визуальный редактор ваших CMS (с указание ссылки на первоисточник конечно же :)). Текст вставляется с исходным форматированием и изображения так и остаются со ссылками на исходный сайт. Так как статьи на исходных сайтах правятся, переносятся или удаляются, то на нашем сайте в таком случае пропадут все скопированные изображения.

Изображения с других доменов негативно влияют на СЕО вашего сайта

При наполнении сайта на платформе InSales в визуальном редакторе, при вставке изображений можно решить проблему ссылок на дркгие домены, вставив картинку с ссылкой в формате base64. Система сама распознает изображение и автоматически преобразует и скачает на свой сервер ваше изображение. Ниже приведен JavaScript код, который при вставке в web-консоль вашего браузера преобразует абсолютно все картинки на текущей странице в base64. Для преобразования, необходимо нажать на черную кнопку появившуюся в правом нижнем углу на странице.

function convertImgToBase64(url, callback, outputFormat){
    var img = new Image();
    img.crossOrigin = 'Anonymous';
    img.onload = function(){
        var canvas = document.createElement('CANVAS');
        var ctx = canvas.getContext('2d');
        canvas.height = this.height;
        canvas.width = this.width;
        ctx.drawImage(this,0,0);
        var dataURL = canvas.toDataURL(outputFormat || 'image/png');
        callback(dataURL);
        canvas = null; 
    };
    img.src = url;
}

function convert_all_images_to_base64() {
    document.querySelectorAll('img').forEach(function(el, index, list){
        var srr = el.src;
        convertImgToBase64(srr, function(base64Img){
            el.src = base64Img;
        });
    })
    var remove_element = document.querySelector('#base64convert');
    remove_element.parentNode.removeChild(remove_element);
}

document.addEventListener('DOMContentLoaded', function () {
    var base_wrap = document.createElement("div");
    base_wrap.innerHTML = 'Convert images';
    document.body.appendChild(base_wrap);
});