search

cesarvr / pdf-generator

Cordova plugin to generate pdf in the client-side
MIT License
107 stars 61 forks source link

Accessing image file from device #38

Closed cabaird closed 6 years ago

cabaird commented 7 years ago

I am trying to use a file uri for an image that I have saved in the file system, but the generated PDF fails to load the image. This image works fine when used in my app's html. I am guessing that it is a permission issue with this plugin, and its access to the file system, but I am not seeing any errors in the console, nor in xcode when debugging. Can you please look at this? I am trying to do something like this:

pdf.htmlToPDF({
     data:'<img src="file:///var/mobile/Containers/Data/Application/7D3EE2B9-0F1B-4A84-A6CE-4D6F2A7548E6/Library/NoCloud/19881/1499893356224.jpg" />',
     documentSize: 'A4',
     landscape: 'portrait',
     type: 'share'
}
mj6uc commented 6 years ago

Same here! (on iOS) The images just come blank! No errors. What could be the issue?

gxrxrdx commented 6 years ago

is it possible at all to reference a local image? something like: <img src="/picture.jpg" /> or <img src="./picture.jpg" />

regards

cesarvr commented 6 years ago

Yes there is support for local images, just check this example.

gxrxrdx commented 6 years ago

I must be missing something, the example only features a couple of img tags with source URL from internet, right? I had partial success using as prefix the constant: cordova.file.applicationDirectory it worked, but only on Android.
On iOS either the pdf renderer don't have access to those absolute paths, the real paths aren't computed from the application directory or it internally prepends something else, thus not matching.

javierClavei commented 6 years ago

I have the same problem, Seems on iOS can't access to local images

cesarvr commented 6 years ago

If you want to just put one image to a PDF you can use this method:
Reading files is a little bit trickier in iOS, you can use this solution to locate the app folder and point it to the browser.

Other option is to embed the image in the document like this.

javierClavei commented 6 years ago

I've tried but continues the sema problem. In iOS not load local images. Have you tried it?

gxrxrdx commented 6 years ago

@javierClavei it didn't work for me using absolute path using: cordova.file.applicationDirectory but in-lining the images using base64 works fine. the doc looks ugly but it is a small inconvenience.

javierClavei commented 6 years ago

The problem is my PDF is an order with a lot of images and is not possible for me to convert into base64.

cesarvr commented 6 years ago

Hi I upgraded this example to locate files in /www using [ios, android], In that particular example it load www/test.html successfully, in your case you just need to replace your images url's with one similar to the ones I use in the example.

To have access to the file system I need this plugin:
cordova plugin add cordova-plugin-file

hope it helps.

javierClavei commented 6 years ago

Finally I've found an easier solution for iOS.

You can use cdvfile://localhost/persistent/test.png to access to image files in Documents folder.

So this is runing in iOS: `document.addEventListener('deviceready', function() {

 pdf.htmlToPDF({
        data: "<html> <h1>  Hello World  </h1> <img src='cdvfile://localhost/persistent/test.png'></html>",
        documentSize: "A4",
        landscape: "portrait",
        type: "share" //use share to open the open-with-menu.
    }, this.success, this.failure);

});`