Angular HttpClient stream

Question

I'm developing an Angular application for Cordova/iOS. I get about 100 MB of data from the backend services which seems to let iOS' web-view (WKWebView) crash. At least I don't experience crashes with the test-backend which returns less data.

The data will be stored in IndexedDB, so there is no reason to fill the RAM with all this data.

So my idea is to stream the response directly into IndexedDB. There are libraries available which can do this even with JSON, e.g. Oboe.js or JSONStream.

Angular's HttpClient returns the whole response in a big string or JSON object which is not what I want. Is there a way I can process the response incrementally similar to this: https://mcmap.net/q/257535/-jquery-read-ajax-stream-incrementally

Terpineol

Answer 1

In Angular, there is currently no way of streaming data.

The closest that you can get is with the use of websockets.

The correct workflow would then be:

1. Add websocket functionality on the server side of your application.
2. Create an Angular service that manages the connect and disconnect of the websockets.
3. Ensure your Angular service exposes an observable that can be subscribed on. This will provide the sensation of streaming that you are looking for.
4. Subscribe to the data stream provided by the service and a update your data/view as new values are emitted.

Jesus

Wouldn't be implementing the XHR logic on my own closer instead of using websockets? XHR supports streaming. Angular's HttpClient abstraction probably just doesn't. – Terpineol

You can implement an XHR logic if you feel more confortable. I would not advise against it directly. I would advise to read this #14704127 You can implement the server-sent events in angular as per the following link: medium.com/@chrisbautistaaa/… At the end, you need to do what is appropriate and practical. For me it would be websockets but this is also xhr stream or server-sent events are both feasible.. – Jesus