Philomath
Philomath

Reputation: 1163

jsPDF and cordova Cant view the pdf file

I'm trying to generate a PDF invoice for my app , I can get to the line 'console.log ("write success");' but I just cannot locate the file. Please help!!! How can I save it to a folder in my mobile???

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 PhoneGap!');

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 );

Upvotes: 1

Views: 2880

Answers (2)

Gandhi
Gandhi

Reputation: 11935

I feel the below line could be the issue, "window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSystem) {})"

In some of the posts i read, it was mentioned that requestfilsystem method along with LocalFileSystem.PERSISTENT argument will not work in android unless the device is rooted.

I made it work using - "window.resolveLocalFileSystemURL(cordova.file.externalRootDirectory,successCallback, errorCallback);"

I suggest you to have a look at this link where i have posted the same code for file creation in both Android and iOS device.

Also if you wanna open the PDF in application of your choice, you can use cordova file opener plugin. You can have a look the file opener sample code in the following link

Upvotes: 0

Víctor
Víctor

Reputation: 3039

You are saving your files in the root path of the system.

If you want to select the folder, check the cordova file plugin

So, if you want to select a public folder, so you can check your files outside of your app, check this link

https://github.com/apache/cordova-plugin-file#android-file-system-layout

and choose one with private = no.

For example:

window.resolveLocalFileSystemURL(cordova.file.externalDataDirectory, function(dir) {
          dir.getFile("test.pdf", {create: true, exclusive: false}, function (fileEntry) {
            fileEntry.createWriter(function (writer) {
writer.onwrite = function(evt) {
         console.log("write success");
      };

      console.log("writing to file");
         writer.write( pdfOutput );
      }

            },function () {


              console.log("ERROR SAVEFILE");

            });
          });
        });

And your file will be placed in you sdcard/files directory

For opening it, I supose that you dont have any pdf viewer plugin, so inAppBrowser is the solution for not having to use any, and open it inside your app

Install inAppBrowser

And open it:

window.resolveLocalFileSystemURL(cordova.file.externalDataDirectory, function(dir) {


          dir.getFile(filename, {create:false}, function(fileEntry) { //EXISTS
            var url = "file:/" + cordova.file.externalDataDirectory + "/test.pdf";
            window.open(url, '_blank');
          }, function() { //NOT EXISTS

          });
        });

I haven't tested it, as looks like inAppBrowser dont like too much local files. Please post your results

Upvotes: 1

Related Questions