Question

Pdf文件不在Adobe Acrobat Reader中打开，但在Chrome中打开。这是我的代码：

var date = document.getElementById("textbox").value;
var imgMaleVsFemale = document.getElementById("MaleVsFemale").toDataURL("image/jpeg", 1);
var imgAge = document.getElementById("Age").toDataURL("image/jpeg", 1);
var imgHour = document.getElementById("Hour").toDataURL("image/jpeg", 1);
var imgAttensionTime = document.getElementById("AttensionTime").toDataURL("image/jpeg", 1);
var defaultLogo = new Image();
defaultLogo.src = "images/DefaultLogo.png";
var doc = new jsPDF('a4', 'pt');
var canvas = document.createElement("canvas");
canvas.width = doc.internal.pageSize.width;
canvas.height = 30;
var ctx = canvas.getContext("2d");
ctx.fillStyle = "#2A3F54";
ctx.fillRect(0, 0, canvas.width, canvas.height);
dataHead = canvas.toDataURL("image/jpeg");
//  doc.setFontSize(10);
doc.setFontStyle('normal');
doc.setFontSize(12);
doc.addImage(dataHead, 'JPEG', 0, 0, doc.internal.pageSize.width, 40);
doc.setTextColor(255, 255, 255);
doc.text("DEMOGRAPHY REPORT", (doc.internal.pageSize.width / 4) + 60, 25);
//doc.text(document.getElementById("lblDateTime").innerHTML.trim().split("<br>")[0].trim(), 260, 25);
doc.setTextColor(0, 0, 0);
doc.setFontSize(10);
doc.text("Date :" + date, 20, 60);
doc.text("Report Type : Daily", 20, 80);
//  if(strLogo != "" && document.getElementById("imgCustomLogo").src.toString().indexOf("NoLogo.png") == -1)
//		doc.addImage(customLogo, 'JPEG', (doc.internal.pageSize.width - document.getElementById("imgCustomLogo").clientWidth), 0, document.getElementById("imgCustomLogo").clientWidth, document.getElementById("imgCustomLogo").clientHeight);
doc.text(document.getElementById('HeadingMaleVsFemale').innerText.trim(), 70, 150);
doc.text(document.getElementById("HeadingAge").innerText.trim(), 420, 150);
doc.text(document.getElementById("HeadingHourly").innerText.trim(), (document.getElementById("Hour").clientWidth / 4) + 50, 370);
doc.text(document.getElementById("HeadingAttentionTime").innerText.trim(), (document.getElementById("AttensionTime").clientWidth / 4) + 70, 580);
doc.addImage(imgMaleVsFemale, 'JPEG', -120, 170, document.getElementById("MaleVsFemale").width * 0.75, document.getElementById("MaleVsFemale").height * 0.75);
doc.addImage(imgAge, 'JPEG', 200, 170, document.getElementById("Age").width * 0.75, document.getElementById("Age").height * 0.75);
doc.addImage(imgHour, 'JPEG', 40, 390, document.getElementById("Hour").width * 0.75, document.getElementById("Hour").height * 0.75);
doc.addImage(imgAttensionTime, 'JPEG', 40, 600, document.getElementById("AttensionTime").width * 0.75, document.getElementById("AttensionTime").height * 0.75);
doc.setFontSize(8);
doc.text("All Rights Reserved", 510, doc.internal.pageSize.height - 10);
doc.addImage(defaultLogo, 'PNG', 500, doc.internal.pageSize.height - 45, 72, 24);
//doc.text(document.getElementById("divFooter").innerText.trim(), 220, doc.internal.pageSize.height - 10);
doc.save(date + ".pdf");

代码在Chrome中执行，但在Adobe Acrobat Reader中显示：

有一个错误处理页面。阅读该文档时出现问题（110）。

Answer 1

我们只需要使用toDataURL（）将图像转换为图像的url表示形式，然后在jspdf中使用继承人代码

 function getImageUrl(url) {
                var img = new Image();
                img.setAttribute('crossOrigin', 'anonymous');
                img.width = 72;
                img.height = 24;
                img.onload = function () {
                    var canvas = document.createElement("canvas");
                    canvas.width = this.width;
                    canvas.height = this.height;

                    var ctx = canvas.getContext("2d");
                    ctx.fillStyle="#FFFFFF";
                    ctx.fillRect(0, 0, canvas.width, canvas.height);
                    ctx.drawImage(this, 0, 0, 72, 24);
                    defaultLogo = canvas.toDataURL("image/jpeg", 1);
                };
                img.src = url;
            }

getImageUrl（“ ---图像路径-”“）;

内部pdfExport函数插入

doc.addImage（defaultLogo，'JPEG'，500，doc.internal.pageSize.height-45，72，24）;

Answer 2

将这些链接更新到您正在使用jspdf库的文件中，希望它可以正常工作。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>

JSPDF pdf文件未在Adobe中打开，但在chrome中打开

2 个答案: