I am building an Android/iOS Application with ionic 3, which simply consists of a webview with the cordova-plugin-inappbrowser (version 3.0.0) and a responsive homepage. The homepage holds different links to websites as well as to (online) PDF files.
As I’ve learned, the webview in Android (I haven’t tried iOS, yet) does not support opening PDF files. That’s why I wanted to intercept the called URLs, and open them in some other way, if they end on ‘.pdf’:
import { Component } from '@angular/core';
import {InAppBrowser, InAppBrowserObject, InAppBrowserOptions} from "@ionic-native/in-app-browser";
export class HomePage {
options : InAppBrowserOptions = {
location : 'no',//Or 'no'
hidden : 'no', //Or 'yes'
clearcache : 'yes',
clearsessioncache : 'yes',
zoom : 'no',//Android only ,shows browser zoom controls
hardwareback : 'yes',
mediaPlaybackRequiresUserAction : 'no',
shouldPauseOnSuspend : 'no', //Android only
closebuttoncaption : 'Close', //iOS only
disallowoverscroll : 'no', //iOS only
toolbar : 'no', //iOS only
enableViewportScale : 'no', //iOS only
allowInlineMediaPlayback : 'no',//iOS only
presentationstyle : 'pagesheet',//iOS only
fullscreen : 'yes'//Windows only
};
constructor(private inAppBrowser: InAppBrowser) {
this.openWithCordovaBrowser('http://url.tohomepage.com');
}
public openWithCordovaBrowser(url : string){
let target = "_self";
this.browser = this.inAppBrowser.create(url,target,this.options);
this.browser.on('loadstart').subscribe((event) => {
if(event.url.endsWith('.pdf'))
{
//Open PDF in some other way
}
});
this.browser.on('loadstop').subscribe((event) => {
});
this.browser.on('exit').subscribe((event) => {
});
}
}
My problem now is, that when a PDF-URL is called, none of the 3 events (loadstart, loadstop, loaderror) are fired. With an usual URL these events fire as expected. Can I change that somehow, or is there any other way I could intercept these calls? (The beforeload event does not exist in this version as far as I can see)
Thanks for any help/hints!
EDIT:
I installed the cordova-plugin-inappbrowser directly from the github master repo, since ‘beforeload’ was added as an unreleased feature.
The ‘beforeload’ channel is implemented in the module as far as I can see. But the ‘beforeload’ event is still not firing. (‘loadstart’ however is working for none-PDF URLs).
My code:
declare var cordova: any;
...
constructor() {
var iabRef = cordova.InAppBrowser.open("http://someurl.com", "_blank", "beforeload=yes");
iabRef.addEventListener('beforeload', function(params, callback){
alert('Beforeload fired');
// If the URL being loaded is a PDF
if(params.url.match(".pdf")){
// Open PDFs in system browser (instead of InAppBrowser)
cordova.inAppBrowser.open(params.url, "_system");
}else{
// Invoke callback to load this URL in InAppBrowser
callback(params.url);
}
});
iabRef.addEventListener('loadstart', function(params, callback){
alert('Loadstart fired');
});
}