BLOB file not opening or/ downloading using INAPPBROWSER

ionic-v1
1

Hi,

This is my third post on this forum seeking for help. So far no one has cooperated with my posts.
I have still hope that someone could help me out with this one.

I’m trying to download a blob file, so far we have succeeded this on the Ionic serve/ Webview.
When clicking the button the file immediately downloads from the chrome browser.

The problem is that the same code does not download the file when it’s running on an Android device.
My team and I have been trying to solve this for days now with no luck. We are using the Inappbrowser version=“0.2.4”.

Here below is the code we are using to accomplish this task.

Index.js:
Initialize the inappbrowser.

onDeviceReady: function() {
app.receivedEvent(‘deviceready’);
window.open = cordova.InAppBrowser.open;
},

Html:
Calling method when pressing button.

   <a>
    <b>One Page Overview:</b> <button style="float: right;" ng-click="DownloadOPO()">Bekijk</button>
    </a>

Controller:
Get object “opo” convert this to a blob and fire this with window.open

$scope.DownloadOPO = function () {

            var opo = $localstorage.getObject("OPO");
            console.log(opo);
            var contentType = opo.contentType || '';

            console.log(contentType);

            var sliceSize = sliceSize || 512;
            var byteCharacters = atob(opo.file);
            var byteArrays = [];

            for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
                var slice = byteCharacters.slice(offset, offset + sliceSize);

                var byteNumbers = new Array(slice.length);
                for (var i = 0; i < slice.length; i++) {
                    byteNumbers[i] = slice.charCodeAt(i);
                }
                var byteArray = new Uint8Array(byteNumbers);
                byteArrays.push(byteArray);
            }

             var blob = new Blob(byteArrays, {type: contentType});
             var blobUrl = URL.createObjectURL(blob);
             window.open(blobUrl,'_system','location=yes');

};

App.js:

$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|maps|mailto|tel|file|geo|blob|blob:http|chrome|http:|blob:file):/);

This is all of the code we are using to make this work.
Once again; this works perfectly on the Webview/browser/ Ionic serve, when clicking(button) the file is immediately downloaded. The problem is that, the same code does nothing when it’s compiled and run on a Android device. The file we want to download is never downloaded nor showed on the device using the inappbrowser.

Probably this is not the right way to get a blob file downloaded or showed on device.
If this is the case, what would be the right approach to download a file that is originally a base64 string with his contentType.

In advance thank you guys for the help :slight_smile:

1 Like
2

Did you find a solutions for this? I have the same problem ((.

3

I have the same problem. But in my case file type is.doc
Did you get any solution for this ?

Please reply as it may be useful for other too.

4

Hi! Do you have a solution?

5

So I worked on this problem for a while and found a simple way around it.
what i ended up doing is listening for the event and using

     > window.open(myURL)

this will open it up in the devices native browser. it’s not ideal but it works. the download dialog starts immediately, after which the download will begin and the user should then just switch back to the app.

If you are looking for a better, more in-app solution, consider using ‘file-transfer’ (native cordova/ionic plug in) . I havn’t done it myself yet. see link below v