前端目前网上可以查到的主要方案就是，用html2cavans先将页面在canvas中绘制，然后canvas转图片资源，再用jspdf将图片转PDF；
这种方式的优点就是解决了jspdf直接转pdf时，一些图片和页面中canvas区域空白的问题；但是也存在一个问题就是直接导出可视区域，页面有滚动条的情况下，滚动条以下丢失，网上查到的解决方法有两种，但是对我的不生效；偶然调试的时候用了一种奇怪的方式解决了问题；
先说网上的解决方法，
1.用jquery的clone()方法，复制新的dom插入到body中，canvas渲染复制的dom，转图片再转pdf.能解决截图不全的问题，但是对页面本身中有canvas的部分复制出来的还是空白。
2.CNDS上有大神直接改了html2canvas源代码，说可以解决问题，但是是3年前的代码了，看了最新更新的html2canvas源码似乎没找到大神当初改的地方。
下面说重点
解决问题的这种怪异方法，有两个修改点，一个是创建一个与要导出PDF相同大小的div插入到body中，再调用html2canvas的方法，另一个点是在html2canvas的配置中给canvas设置高度。导出成功删除插入的元素。
要注意一个地方，就是要导出pdf的元素一定要有高度，百分比的高度和auto肯定会出问题，只要是html2canvas对一些css还支持不全；
贴上代码
<script src="./static/html2canvas.min.js"></script>
<script src="./static/jspdf.debug.js"></script>
...
...
...
exportPDF(){
let targetDom = $("#content");
// let copyDom = targetDom.clone();
let copyDom = $("<div/>");
copyDom.addClass('super');
copyDom.width(targetDom.width() + "px");
copyDom.height(targetDom.height() + "px");
$('body').append(copyDom);
let cont=document.getElementById('content');
console.log(targetDom);
html2canvas(targetDom, {
// windowHeight:2000,
height:cont.offsetHeight,//给canvas设置高度，
onrendered: function(canvas) {
console.log('回调开始');
//通过html2canvas将html渲染成canvas，然后获取图片数据
let imgData = canvas.toDataURL('image/jpeg',1.0);
// console.log(imgData);
console.log(canvas.width,canvas.height);
//初始化pdf，设置相应格式
let doc = new jsPDF("p", "mm", "a4");
// let doc = new jsPDF('', 'pt', 'a4')
//这里设置的是a4纸张尺寸
doc.addImage(imgData, 'JPEG', 0, 0,210,297);
//输出保存命名为content的pdf
doc.save('report.pdf');
//移除dom中添加的元素
$('.super').remove();
}
});
},
#########如果各位还有什么好方法，欢迎回复
