Viewing URLs with PDF content (without .pdf extension) on Android

I’ve researched, and researched, and researched… to a point of frustration.

I have a web app. I’m using an InAppBrowser top wrap that app inside Ionic (using Ionic 4 + Angular).

On my Android device testing, the PDFs simply WILL NOT load in the in the InAppBrowser. They load for iOS.

The URL may look like:

The user MUST be authenticated on the website to view the PDF.

I’ve tried Document Viewer, FIle Transfer, etc.

I’m clearly missing something. Below is my post on Stack Overflow:

I have an Ionic 4 app developed using InAppBrowser. The app is, in fact, almost all purely done via InAppBrowser:

Splash Screen > URL passed to InAppBrowser > Site loads. User logins in, clicks links and navigates through site. Some links the user may click are PDFS (content type = application/pdf) but does not have a .pdf extension at the end of the filename.

In iOS, these load fine. In Android, the PDFs never show…

I’ve read this is a known workaround. I cannot use the Google Docs viewer embed workaround as the URL to the pdf files are based on being authenticated into our site to see and access the PDFs.

The other option I’m reading is to get the URL, download the file to the user’s local system browser; then open it up - all of this using FileSystem, File, FileTransfer, and FileOpener. Below is my code block and output from Android Studio LOGCAT:

 downloadPDF(pUrl: string) {
    console.log("==== in downloadOpenPDF function ====");

    if('android')) {
      var permissions = cordova.plugins.permissions;
      permissions.hasPermission(permissions.WRITE_EXTERNAL_STORAGE , function( status ){
        if ( status.hasPermission ) {
          console.log("We DO have access to write to external storage");
        else {
          console.warn("We DO NOT have access to write to external storage");
          permissions.requestPermission(permissions.WRITE_EXTERNAL_STORAGE, this.success, this.error);

      permissions.hasPermission(permissions.READ_EXTERNAL_STORAGE , function( status ){
        if ( status.hasPermission ) {
          console.log("We DO have access to read to external storage");
        else {
          console.warn("We DO NOT have access to read to external storage");
          permissions.requestPermission(permissions.READ_EXTERNAL_STORAGE, this.success, this.error);


    let downloadUrl = pUrl;
    console.log("downloadUrl is ================"+downloadUrl);
    let path = this.file.dataDirectory;
    let filepath = path+'mcfrenderPDF.pdf';
    console.log("path is =================="+path);

    const transfer: FileTransferObject = this.fileTransfer.create();, filepath,true).then(entry => {
      let url = entry.toUrl();
      console.log("url is ================="+url);
      if('ios') ||'android')) {
        console.log("================ Use Document Viewer");
        this.document.viewDocument(url, 'application/pdf',{});
      } else {
        //console.log("Device is Android = Use Google Docs");
        console.log("local path to file is: "+path+'mcfrenderPDF.podf');, 'application/pdf');

My output of my log is as follows:

2019-11-03 13:26:05.401 5213-5333/ D/FileTransfer: Saved file: file:///data/user/0/
2019-11-03 13:26:05.401 5213-5333/ E/FileTransfer: File plugin cannot represent download path