如何在移动设备上使用CORDOVA创建和保存pdf文件

时间:2016-06-30 06:51:37

标签: cordova pdf ionic-framework hybrid-mobile-app jspdf

我正在尝试在移动设备上创建并保存PDF文件。我正在使用jsPdf的“Ionic”框架。 当我在浏览器上运行脚本时,它会创建PDF文件并在本地计算机上下载。但我不知道如何在移动本地目录上保存该PDF文档。我尝试了以下代码。

var pdfOutput = pdf.output("blob");

ocument.addEventListener('deviceready', function () {
                 alert('device is ready, lets do some file reading pdf');
                 $cordovaFile.createFile(cordova.file.externalRootDirectory, pdfOutput, true)
                 .then(function (success) {
                     alert('successfully created pdf file');
                  }, function (error){
                 alert('file write error' + error); 
              }); });

有人可以帮帮我吗?如果有人告诉我创建应用程序文件夹并将所有pdf文件存储在该文件夹中的过程,那也很棒。

2 个答案:

答案 0 :(得分:0)

您好,您可以使用JsPDF,它很容易与cordova网址集成https://parall.ax/products/jspdf 步骤1下载JSPDF项目代码,并将jspdf库从“dist”目录复制到您的cordova项目中,在该项目中保留所有js库。我把它放到www / jslib中。然后,确保将库包含在主HTML文件中。

示例代码

  //FIRST GENERATE THE PDF DOCUMENT
  console.log("generating pdf...");
  var doc = new jsPDF();

  doc.text(20, 20, 'HELLO!');

  doc.setFont("courier");
  doc.setFontType("normal");
  doc.text(20, 30, 'This is a PDF document generated using JSPDF.');
  doc.text(20, 50, 'YES, Inside of cordova!');

  var pdfOutput = doc.output();
  console.log( pdfOutput );

  //NEXT SAVE IT TO THE DEVICE'S LOCAL FILE SYSTEM
  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.getFile("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(event){
   console.log( evt.target.error.code );
  });

答案 1 :(得分:-1)

安装cordova plugin add cordova-pdf-generator

使用以下代码。

 $scope.Function_name = function() {

        var opts = {
            type: "share", //Open a context menu and ask the user what to do next (print, mail, etc..).
            fileName: 'v8-tutorial.pdf' //it will use this filename as a place-holder
        }

        pdf.fromData('<html><h1>Hello World</h1></html>', opts)
            .then((status) => console.log('success->', status))
            .catch((error) => console.log(error));

        // End here

    }