Nativescript-angular: How to set timeout for Http / HttpClient request

[manojdcoder]

How to set the timeout for Http / HttpClient request, which is already implemented in {N} core.

[jogboms]

@manojdcoder using HTTPInterceptors, you can add the Timeout RxJs operator before making the request

[manojdcoder]

@jogboms It could be a workaround but I don't think that is the actual timeout of NativeScript's Http Request.

[jogboms]

okay.
if you say so.

[manojdcoder]

@tsonevn I believe actual timeout terminates the Http Request but Observable's timeout operator just breaks the subscription. Any comments on this?

[tsonevn]

Hi @manojdcoder,
The HTTP module from the tns-core-modules indeed provides an additional option for adding timeout for the request. This module is mainly used for a non-Angular project.

At this point, NativeScript implemented HTTPClient modules, which was introduced in the latest versions of Angular.
For NativeScript Angular project we should use HTTPClient. The usage of this module is demonstrated in our nativescript-sdk-examples-ng application.
After researching the case about setting the timeout to the HTTPClient I also find that the best way to do that in Angular is to use HTTPInterceptor.

Regarding that, I would suggest the same solution, as @jogboms already did, to using HTTPInterceptors and to add the Timeout RxJs operator before making the request.

[manojdcoder]

@tsonevn As I already mentioned the real issue is that the Http request will never end (or may run for too long) when it is not the native timeout.

I used charlesproxy to monitor the Http calls made by app on my android app, using Observable's timeout operator it just unsubscribes the callbacks but not originally stop / kill the living Http request. Is it not going to be a real issue?

[tsonevn]

Hi @manojdcoder,
We have tested the HttpClient on our side, however, was unable to recreate with the HTTP request, which never ends.
It would help if you provide sample project, which demonstrates the problem and could be used for debugging. We will review it and will provide more info about the case.

[manojdcoder]

@tsonevn Strange I'm not able reproduce it myself, seems to work as expected now hence closing this issue.

@jogboms @tsonevn Thanks for the support.

[hackerunet]

Sorry to open this again, but original post is right, you can break the subscription adding the timeout option but in java there is no interruption of the async process so no matter if angular stops and throw a timeout exception java will still remain running the request until it fails and returns a timeout exception like 5 minutes later. So how can I set up an option from angular and pass that parameter to the java network library on android side to make it return a timeout exception in the time passed from angular? to reproduce this just make an http request to a non available host or just pass timeout as this:

this.http.post(url, body, { headers: headers })
            .timeout(100, this.handleTimeout)
            .map(response =>{
                return response;
            })
            .catch(this.handleErrors);

Angular breaks the subscription and java continues the request and after 5 minutes it returns a timeout exception so, angular has it's own timeout and android has it's own.

[AisonBird]

@hackerunet after add .timeout(...), there will be an error.

[manojdcoder]

@AisonBird That is expected, you must handle it with a catch block just like @hackerunet did in his example.

[donny08]

@tsonevn I'm using angular http client for making requests to backend. I have request that takes more 3 minutes to process so i need to wait for request that much long. But my http request fails before 1 minute, so i added rxjs/timeout to increase the wait time of response. It's work well in Android but fails to wait in IOS. Any help on this.

[tsonevn]

Hi @donny08,
I've checked the described scenario on our side. However, I was unable to recreate an issue with the http-client for iOS. On that matter, can you send us the project or sample one, that can be used for recreating the problem?

[lanmaomm]

Hi @tsonevn
I have met the same issue.You can try to upload a file over 600MB here,https://ng.ant.design/version/1.8.x/components/upload/zh . this may help recreating the problem.

[jnorkus]

Still not possible to cancel a HTTP request. I believe this is the feature request:
https://github.com/NativeScript/NativeScript/issues/1845