html2canvas&&jspdf--pdf本地下載的屏幕自定義縮放問題，只下載一頁，水印,命名文件

調用：
let domHeight = document.querySelector('#pdfDom').offsetHeight

htmlToPdfHeight.downloadPDF(document.querySelector('#pdfDom'), this.name,domHeight)

如下是js文件內容-------(排版可能有問題)
import html2canvas from 'html2canvas';
import JsPDF from 'jspdf';
// 自定義只下載一頁pdf

/**

• @param dom 要生成 pdf 的DOM元素（容器）
• @param padfName PDF文件生成後的文件名字
• */

function downloadPDF(dom, pdfName,domHeight){

// 計算屏幕放大倍數
var ratioN=0;
var screen=window.screen;
var ua=navigator.userAgent.toLowerCase();
if(window.devicePixelRatio !== undefined){
  ratioN=window.devicePixelRatio;    
}else if(~ua.indexOf('msie')){
  if(screen.deviceXDPI && screen.logicalXDPI){
    ratioN=screen.deviceXDPI/screen.logicalXDPI;       
  }
}else if(window.outerWidth !== undefined && window.innerWidth !== undefined){
  ratioN=window.outerWidth/window.innerWidth;
}
if(ratioN){
  ratioN=Math.round(ratioN*100);    
}
var windowScale = ratioN / 100;

var box = window.getComputedStyle(dom);
// DOM 節點計算後寬高
// var windowScale = box.widows;
var width = parseInt(box.width, 10) * windowScale;
var height = parseInt(box.height, 10) * windowScale;
// console.log(windowScale,"  windowScale")
// console.log(width,height,"dom節點*widowsSale")
// 獲取像素比
// const scaleBy = this.DPR();
var scaleBy = 1; //不進行放大，防止屏幕文字 縮放 致使文件過大下載失敗
// 建立自定義 canvas 元素
var canvas1=document.createElement('canvas');
// 設置寬高
canvas1.width=width * scaleBy ;//注意：沒有單位
canvas1.height= height * scaleBy;//注意：沒有單位
// 設定 canvas css寬高爲 DOM 節點寬高
canvas1.style.width = `${width}px`;
canvas1.style.height = `${height}px`;
// console.log(canvas1.width,"canvas1.width00")
// 獲取畫筆
var ctx=canvas1.getContext("2d");
// 將全部繪製內容放大像素比倍
ctx.scale(scaleBy, scaleBy);
html2canvas( dom, {
    dpi: 300,
    // allowTaint: true,  //容許 canva 污染， allowTaint參數要去掉，不然是沒法經過toDataURL導出canva數據的
    useCORS:true,  //容許canva畫布內 能夠跨域請求外部連接圖片, 容許跨域請求。
    height:domHeight,
}).then( (canvas)=>{
    var img = new Image();
    if(img.complete) {
        img.src = canvas.toDataURL(); //因爲圖片異步加載，必定要等img加載好，再設置src屬性
            img.onload = function() {
            // 繪製圖片
            ctx.drawImage(img,0,0);
            ctx.moveTo(0,0);
            ctx.lineTo(canvas1.width,canvas1.height);
            ctx.font = "40px microsoft yahei";
            ctx.fillStyle = "rgba(0,0,0,0.1)";
            ctx.textAlign = 'center';

       ctx.textBaseline = 'Middle';

ctx.rotate((-25 * Math.PI) / 180); // 水印初始偏轉角度
            // 繪製水印到canvas上
            for (let i = (canvas1.height*0.5)*-1; i<canvas1.height; i+=400) {
                for (let j = 0; j<canvas1.height*1.5; j+=360) {
                ctx.fillText("這是水印文字",i,j);
                }
            }
            ctx.rotate((25 * Math.PI) / 180); // 把水印偏轉角度調整爲原來的，否則他會一直轉
            
            var contentWidth = canvas.width;
            var contentHeight = canvas.height;
            // console.log(contentWidth,contentHeight,"canvas寬高")
            //一頁pdf顯示html頁面生成的canvas高度;
            // var pageHeight = contentWidth / 592.28 * 841.89;
            // domHeight = document.querySelector('#pdfDom').offsetHeight //只下載一頁pdf
            var pageHeight = contentWidth / 592.28 * (Number(domHeight));
            //未生成pdf的html頁面高度
            var leftHeight = contentHeight;
            //頁面偏移
            var position = 0;
            //a4紙的尺寸[595.28,841.89]，html頁面生成的canva在pdf中圖片的寬高
            var imgWidth = 595.28;
            var imgHeight = 595.28/contentWidth * (Number(domHeight)) * windowScale;
            // console.log(imgWidth,imgHeight,"imgpdf寬高")
            var pageData = canvas1.toDataURL('image/jpeg', 1.0);
            // var pdf = new JsPDF('', 'pt', 'a4');
            var pdf = new JsPDF('', 'pt', [595.28,imgHeight]);
            //有兩個高度須要區分，一個是html頁面的實際高度，和生成pdf的頁面高度(841.89)
            //當內容未超過pdf一頁顯示的範圍，無需分頁
            // if (leftHeight < pageHeight) {
                //在pdf.addImage(pageData, 'JPEG', 左，上，寬度，高度)設置在pdf中顯示；
                pdf.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight);
                // pdf.addImage(pageData, 'JPEG', 20, 40, imgWidth, imgHeight);
            // }
            //可動態生成
            pdf.save(pdfName);
            dom.style.overflowY = 'auto'
            dom.style.height = '100%'
        }
    }
})

}
export default {

downloadPDF

}