Show pdf from url


I would like to open PDF file from a URL.

How can i detect and call the pdf reader of the device in order to show the downloaded pdf document?

I am trying for android and windows phone.

Thank´s in advance

Have you tried with the InAppBrowser plugin?

1 Like

First off, I am not sure if this is the best solution at all, but I needed a cross platform solution. In summary, I couldn’t use InAppBrowser with Android to display a PDF, so I had to download the PDF first and then open it natively. iOS is able to open a PDF using InAppBrowser, so I just use that.

 * @param url
 * Download the file from the associated url.
$scope.openPDF = function(url){
		case 'Android':

			 * Android devices cannot open up PDFs in a sub web view (inAppBrowser) so the PDF needs to be downloaded and then opened with whatever
			 * native PDF viewer is installed on the app.

			var fileURL = cordova.file.externalApplicationStorageDirectory+"local.pdf";

			var fileTransfer = new FileTransfer();
			var uri = encodeURI( url );
				function(entry) {
					$ = entry.toURL();;
				function(error) {



			 * IOS and browser apps are able to open a PDF in a new sub web view window. This uses the inAppBrowser plugin
			var ref =, '_blank', 'location=no,toolbar=yes,closebuttoncaption=Close PDF,enableViewportScale=yes');

You might want to implement some sort of code that deletes the local copy of the PDF once it’s been viewed (I do that by adding a listener for “resume” and deleting the file ref stored in $

This uses the following plugins
org.apache.cordova.device (to get the device platform)


Thank´s for pointing the solution, i am still a newbye finding my way into ionic and angular.

Instead of deleting the last PDF, how would be implemented a feature to maintain one last copy of the downloaded pdf providing a button to open the last pdf and another to download a new one.

Just keep a record of the file URL somewhere (see above) and then call it when/if required. You could keep a list of files in local storage so the info is still available after closing and opening the app again.$;

Thank´s a lot again !

I do downloaded all the cordova plugins and i am trying to fit the openPdf function inside my pdf Controller.

I do not know if this is the right way into the Angular way, because the error message is : Error: [$injector:unpr] Unknown provider: $cordovaFileOpener2Provider <- $cordovaFileOpener2 <- PdfCtrl

Wich would be the correct steps

I try and it works at the pc for android and windows phone it does not work just show a blank window. is there any workaround for using inAppBrowser with windows phone and Android ?

Hi ! i am a newbie into ionic and angular, how do i declare the dependencies? in the controller module and the pdf controller ?

Wich is the format to declare this dependencies ?

With cordova plugin list i see all of them , but all my tryes gives me the unknow provider error message.

Hi there, sorry I didn’t realise you had already asked another question! See below for the fileopener plugin

ionic plugin add org.apache.cordova.file-transfer (will add org.apache.cordova.file as a dependency)
ionic plugin add org.apache.cordova.inappbrowser
ionic plugin add (for com.phonegap.plugins.fileopener)


With inapbrowser only it works, the pdf is downloaded, but i would like to detect a pdf reader and open it when the download finish.

I fall on the unknow provider error.

How do you declare these dependencies to avoid the unknow provider error ?

angular.module(‘starter.controllers’, [’???’])

In my controller i try to declare $cordovaFileOpener but shows the error message about unknow provider.

I didn’t have to declare any angular app dependencies, nor did I use $cordovaFileOpener anywhere I used;

I’m not sure why you’re seeing what you’re seeing

It stops on var fileTransfer = new FileTransfer(); says Filetransfer is not defined, may i uninstall all the plugins and install them again.

I have this list of plugins :

com.phonegap.plugins.fileopener 0.1.0 "File Opener"
org.apache.cordova.file 1.3.3 "File"
org.apache.cordova.file-transfer 0.5.0 "File Transfer"
org.apache.cordova.inappbrowser 0.6.0 "InAppBrowser" 

And a url that returns a pdf file.

After this just try to adapt the code :

 var fileURL = url             
      var fileTransfer = new FileTransfer();
      var uri = encodeURI( url );, fileURL, function(entry) {
            $ = entry.toURL();
            $ =; //entry.toURL();
        function(error) {

And return the message : ReferenceError: FileTransfer is not defined

Can not see the error! any ideas ?