如何使用Phonegap inAppBrowser预览不同的pdf文件？

Question

I have some question regarding to Cordova Phonegap inAppBrowser. I have include the inAppBrowser to my code.

function onDeviceReady() {
     var ref = window.open('http://~/Testing.pdf', '_blank', 'location=yes');
     ref.addEventListener('loadstart', function(event) { alert('start: ' + event.url); });
     ref.addEventListener('loadstop', function(event) { alert('stop: ' + event.url); });
     ref.addEventListener('loaderror', function(event) { alert('error: ' + event.message); });
     ref.addEventListener('exit', function(event) { alert(event.type); });
}

I using the code for preview the pdf file. The question I wanted to ask is if I wanted to display multiple pdf file in my server, I have to create multiple html page with this code but different pdf file link??

I hope someone can help me in this because I'm new in this.

Answer 1

如何使用像PDF.JS这样的javascript插件？

Answer 2

You can't use InAppBrowser to display a pdf because it's just a mean to get a WebView.

What you need to do is first to download the file via the plugin FileTransfer .

For that, you have to determine a file path on the device which vary over the OS. See File plugin and the system layouts to find a location with the desired level of privacy. For that need, let's say cordova.file.dataDirectory for Android and cordova.file.documentsDirectory for iOS.

Then you have 2 options :

• open it via the plugin FileOpener2 . See Examples for opening a pdf resource
• or use PDF.js , a library written by Mozilla, to build your own HTML reader of a pdf file

The first solution is far easiest but your app will depend of what pdf reader apps are installed on the user's device, which can vary from one device to the other.

The second solution gives you a finer control of your app and avoids to depend on other app but you will have to build a whole reader, and require to know such things like HTML canvas and JS promise.