How to perform GET request as blob in Ionic 4 / Capacitor

Question

I'm trying to perform a GET request to download a PDF document to the phone. The responseType is blob as I need the result as a Blob file.

import {
  HttpClient
} from '@angular/common/http';

this.httpClient
   .get(specSheet.link, {
     responseType: 'blob'
   })
   .subscribe(result => {

     console.log('http client download result: ', result)

Everything works as expected on web and ran in Chrome. http client download result: Blob {size: 174016, type: "application/pdf"}

But on iOS or Android the result is empty http client download result: {}.

What am I missing? Any help is greatly appreciated.

PS: Here's a simple playground just downloading a test image: https://github.com/davidseek/ionic-playground

It works perfectly fine ran on web. But not at all on a physical device. Web result is a Blob, phone result is empty: {}

as an experiment, try to run `this.httpClient.get('https://httpbin.org/image', { headers: new HttpHeaders({ accept: 'image/*', }), responseType: 'blob' }).subscribe((data) => { console.log('Data', data); }); ` — sneas, Sep 19 '19 at 15:30
this is how I've just verified blob request in iOS on my machine — sneas, Sep 19 '19 at 15:31
I've used your exact code, ran on my iPhone X and Data is `{}`. On Chrome in web it's a valid blob. — David Seek, Sep 19 '19 at 17:27
This is weird I tried the code on this repo https://github.com/sneas/ionic-4-http-test `no-be` branch. Run simulator with `npm run ios` and switch to tab2. Got the expected result in the Safari console. — sneas, Sep 19 '19 at 17:33
Creating an isolated playground project myself right now to check again. I'll be back in like 5mins. — David Seek, Sep 19 '19 at 17:35
I'm very happy to announce, that I have tried it with your code as well as mine in an isolated repo and it does NOT work. On my iPhone the `Data` log remains empty `{}` — David Seek, Sep 19 '19 at 17:51
does this `result` is supposed to be saved on file or stored? can I show it directly into a ? — Carlos.V, Feb 18 '21 at 16:18

score 2 · Accepted Answer · answered Sep 20 '19 at 17:12

2

That's just the console plugin not being able to display complex objects on the Xcode console.

If you debug the app using Safari remote inspector you'll see the actual blob.

answered Sep 20 '19 at 17:12

jcesarmobile

51,328
11
132
176

Unbelievable. Yeah you helped me tremendously... Thank you! Since I got you here right now, do you have a little tip for me how I can deploy changes as fast as it gets from Visual Code -> Xcode -> iPhone? Right now I do: `ng build` -> `npx cap copy` -> switch to Xcode -> build. Is there like a faster way? Even with my iMac Pro this seems like a huge time waste. – David Seek Sep 20 '19 at 20:37
you can use live reload, see https://stackoverflow.com/questions/53328647/ionic4-capacitor-android-livereload/53338145#53338145 – jcesarmobile Sep 20 '19 at 21:42

How to perform GET request as blob in Ionic 4 / Capacitor

1 Answers1