jsPDF with Cordova - 添加图像

我正在尝试使用 jsPDF 库生成 PDF（https://github.com/MrRio/jsPDF https://github.com/MrRio/jsPDF）从移动 Cordova 应用程序中。我目前正在 Android 4.0.4 设备上测试该应用程序，但它还需要在 Windows mobile 8 上运行。PDF 文档中的文本显示正确，但任何图像都是混乱的。见下图

我确实找到了这个页面（https://coderwall.com/p/nc8hia https://coderwall.com/p/nc8hia）这似乎表明 jsPDF 在 Cordova 中显示图像存在问题（请参阅评论），但作者从未发布后续内容。有谁能够将 jsPDF 与 Cordova 一起使用并正确地将图像添加到生成的 PDF 中吗？我的代码如下，任何帮助或建议将不胜感激。

function demoReceipt() {
    var img = new Image();

    img.onError = function() {
        alert('Cannot load image: "' + url + '"');
    };
    img.onload = function() {
        createPdf2(img);
    };
    img.src = 'img/testlogo.png';
}



function createPdf2(myLogo) {
    //  var doc = new jsPDF('p', 'pt', 'jontype');

    var doc = new jsPDF('p', 'pt', 'letter');

    doc.setProperties({
        title : 'Fueling Receipt',
        author : 'Jon Hoffman',
        creater : 'Jon Hoffman'
    });

    doc.addImage(myLogo, 'PNG', 5, 5, 140, 30);
    doc.setFontSize(12);
    doc.text(10, 40, 'Sample PDF receipt');
    doc.setFontSize(8);
    doc.text(10, 45, 'Smaller text - new');

    var pdfOutput = doc.output();

    //NEXT SAVE IT TO THE DEVICE'S LOCAL FILE SYSTEM
    //Requires  cordova plugin add org.apache.cordova.file
    console.log("file system...");
    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSystem) {

        console.log(fileSystem.name);
        console.log(fileSystem.root.name);
        console.log(fileSystem.root.fullPath);

        fileSystem.root.getDirectory("myPDFs", {
            create : true,
            exclusive : false
        }, function(dir) {

            fileSystem.root.getFile("myPDFs/test.pdf", {
                create : true
            }, function(entry) {
                var fileEntry = entry;
                console.log(entry);

                entry.createWriter(function(writer) {
                    writer.onwrite = function(evt) {
                        console.log("write success");
                    };

                    console.log("writing to file");
                    writer.write(pdfOutput);
                }, function(error) {
                    console.log(error);
                });

            }, function(error) {
                console.log(error);
            });
        }, function(error) {
        });
    }, function(event) {
        console.log(evt.target.error.code);
    });
}

我在这篇博客文章的帮助下解决了这个问题：https://coderwall.com/p/nc8hia https://coderwall.com/p/nc8hia。该帖子中使用的 0.90 版本与我使用的版本之间似乎确实存在显着差异https://github.com/MrRio/jsPDF https://github.com/MrRio/jsPDF但解决方案几乎相同。 首先，在 MyRio 的版本中，您可以在不修复 Igor 帖子中指出的 Blob 问题的情况下生成 PDF。您所需要的只是通过调用“doc.ouput()”生成 PDF 输出，然后使用 Cordova 文件系统插件保存它。所以我认为我不必创建 Blob（这是我错的地方）。
Igor（来自 coderwall 帖子）用一些额外的代码回答了我的问题，但是当我从 MyRio 版本搜索 jspdf.js 文件时，我看到代码（更紧凑的版本）已经在第 734 – 738 行的代码中：

var data = buildDocument(), len = data.length,
    ab = new ArrayBuffer(len), u8 = new Uint8Array(ab);

while(len--) u8[len] = data.charCodeAt(len);
return new Blob([ab], { type : "application/pdf" });

但我也注意到，Igor 在他的第一篇文章中修复的 blob 创建代码位于该代码块的末尾。所以我注释掉了“return new Blob([ab], { type : “application/pdf”});”行并放入 Igor 帖子中的以下代码，并稍微更改变量名称：

try
{
    var blob = new Blob([ab], {type: "application/pdf"});
    console.debug("case 1");
    return blob;
 }
 catch (e)
 {
     window.BlobBuilder = window.BlobBuilder ||
                                          window.WebKitBlobBuilder ||
                                          window.MozBlobBuilder ||
                                          window.MSBlobBuilder;
     if (e.name == 'TypeError' && window.BlobBuilder)
     {
         var bb = new BlobBuilder();
         bb.append(ab);
         console.debug("case 2");
         return bb.getBlob("application/pdf");

      }
      else if (e.name == "InvalidStateError")
      {
          // InvalidStateError (tested on FF13 WinXP)
          console.debug("case 3");
          return new Blob([ab], {type: "application/pdf"});

       }
       else
       {
           // We're screwed, blob constructor unsupported entirely
           console.debug("Errore");
       }
 }

然后当我生成 pdfOutput 时，在我的代码中，我改变了

var pdfOutput = doc.output();

to

var pdfOutput = doc.output(“blob”);

它起作用了。 我希望这篇文章能够帮助遇到同样问题的其他人。