指定网站PDF下载

保存网站内容图片转换成PDF。

// ==UserScript==
// @name          指定网站PDF下载
// @description   保存网站内容图片转换成PDF。
// @version       1.0.0
// @namespace     指定网站PDF下载
// @icon          data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @author        会说话的鱼
// @include       *//ow365.cn/*
// @require       https://cdn.bootcdn.net/ajax/libs/jquery/1.9.1/jquery.min.js
// @run-at        document-start
// @grant         none
// @license       MIT
// @rewritten_script_code javascript
// ==/UserScript==

(function() {
	'use strict';
	$(function () {
        init();
	});
})();

function sleep(numberMillis) {
    var now = new Date();
    var exitTime = now.getTime() + numberMillis;
    while (true) {
        now = new Date();
        if (now.getTime() > exitTime)
            return;
    }
}

function getBase64Image(img, width, height) {
    var canvas = document.createElement("canvas");
    canvas.width = width ? width : img.width;
    canvas.height = height ? height : img.height;
    var ctx = canvas.getContext("2d");
    ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
    var dataURL = canvas.toDataURL();
    return dataURL;
}

function getCanvasBase64(img, name) {
    var image = new Image();
    //至关重要
    image.crossOrigin = '';
    image.src = img;
    image.name = name;
    //至关重要
    var deferred = $.Deferred();
    if (img) {
        image.onload = function () {
            deferred.resolve(getBase64Image(image));//将base64传给done上传处理
            // document.getElementById("container").appendChild(image);

            // console.log(image.name);
        }
        return deferred.promise();//问题要让onload完成后再return sessionStorage['imgTest']
    }
}

function init() {
	var append_html = '<style>'+
        '.pdfbtn {'+
        '	right: 30px;'+
        '	bottom: 30px;'+
        '	width: 80px;'+
        '	line-height: 80px;'+
        '	font-size: 18px;'+
        '	text-align: center;'+
        '	-moz-border-radius: 80px;'+
        '	-webkit-border-radius: 80px;'+
        '	border-radius: 80px;'+
        '	color: #FFF;'+
        '	background: #4E4E4E;'+
        '	position: fixed;'+
        '}'+
        '</style>'+
        '<div class="pdflist" id="container"></div>'+
        '<a href="javascript:void(0);" class="pdfbtn">保存</a>';
    $('body').append(append_html);

    $('.pdfbtn').click(function(){
        var imglist = {
            data:new Array(),
        };

        $('#ctn > div').each(function(index, el) {
            var obj = $(this);
            var src = obj.find('img').attr('src');

            imglist.data[index] = {
                src:src,
                name:index,
            }
            // console.log(index);
        });

        var json = imglist.data;
        var load = 0;

        $('.pdflist').html('');
        $('body').html('');
        $('body').attr('ondragstart', 'return true;');
        $('body').attr('onselectstart', 'return true;');
        $('body').attr('oncontextmenu', 'return true;');
        $('body').attr('style', '');

        $.each(json, function(index, item){
            var src = item.src;
            var name = item.name;
            var imglist = new Array();

            getCanvasBase64(src, name) .then(function (base64) {
                // console.log("方式二》》》》》》》》》",base64);
//                 console.log('base64');
                json[index].base64 = base64;
                load++;

                if(load == json.length) {
                    $.each(json, function(index, item){
                        console.log(item.base64);

                        var base64 = item.base64;
                        var name = item.name;

                        var _img = $('<p><img src="'+ base64 +'" alt="'+ name +'" /></p>');
                        $('body').append(_img);
                    });
                }

                var image = new Image();
                // 解决跨域 Canvas 污染问题
                image.setAttribute("crossOrigin", "anonymous");
                image.src = base64;
                image.name = name;
                image.onload = function () {
                    // 输出图片信息 比如可以获取图片宽高
                    console.log(image.width)
                    console.log(image.height)
                    console.log(image.name);

                    var canvas = document.createElement("canvas");
                    canvas.width = image.width;
                    canvas.height = image.height;
                    var context = canvas.getContext("2d");
                    context.drawImage(image, 0, 0, image.width, image.height);

                    var url = canvas.toDataURL("image/png"); //得到图片的base64编码数据'
                    var a = document.createElement("a"); // 生成一个a元素
                    var event = new MouseEvent("click", {
                        bubbles: true,
                        cancelable: true,
                        view: window
                    }); // 创建一个单击事件
                    a.download = image.name || "photo"; // 设置图片名称
                    a.href = url; // 将生成的URL设置为a.href属性
                    a.dispatchEvent(event); // 触发a的单击事件
                    sleep(100);
                }
            }, function (err) {
                console.log(err);
            });
        });
    });

    var data = {
        f : '',
        img : '',
        isMobile : '',
        vid : '',
        dk : '',
        ver : '',
        sn : '',
    };

    // data.f = getQueryVariable("furl");
    var getFun = setInterval(function(){
        var count = parseInt($id("PageCount").innerHTML);
        var nowIdx = parseInt($id("PageIndex").innerHTML) - 1;
        var toIdx = nowIdx + 5;

        if($id("PageCount").innerHTML == '') {
            return false;
        }else {
            clearInterval(getFun);
        }

        for (var i = toIdx; i < count; i++) {
            var findEle = $id("p" + i);
            if (findEle == null) {
                var preEle = $id("p" + (i - 1));
                if (preEle != null) {
                    if (isOver(preEle)) {
                        break;
                    }
                }
                var pre = $id("p" + (i - 1));
                var pageData="";
                if (pre != null) {
                    pageData = pre.getAttribute("data-page");
                }
                getHtml(pageData, i, false, false);
            } else {
                if (isOver(findEle)) {
                    break;
                }
            }
        }
    },1000);
}