Can't have a timeout of over 2 minutes with this.http.get? [duplicate]

Question

My angular 4.3.2 code is calling my back-end service that takes 2-4 minutes to return. Using just the default this.http.get code, I see that the default timeout kicks in after 2 minutes. However when I try to put in a timeout of anything OVER 2 minutes, it fails in that it will never let the timeout be over 2 minutes.

I've tried with 100, 100000 (1.7m) and 114000(1.9m) and those work in that it gets timed out right at those values. But when I try 126000 (2.1m), 180000 (3m) and 1800000 (30m), again I see it times out after 2 minutes.

this.http.get('myUrl')
.timeout(126000)
.map((res: Response) => this.convertResponse(res));

I've also tried it with .timeoutWith(126000, Observable.throw(new Error("Timed out"))) to no avail.

Kolnos

Were you able to increase the timeout over 2 minutes for making server call using httpClient? I am also working on a similar scenario where one server call takes more than 2 minutes to respond and using this.http.get('url').timeout(180000) did not work. – Wheeze

Where does it happen, on your dev machine? If so, are you using the proxy config? – Colley

Answer 1

You can not change the web browser's network timeout setting for HTTP requests. The timeout() operator throws a JavaScript error when the timer is reached, but this has nothing to do with the network timeout for communications.

For example; I can use the timeout() operator on any observable.

of("hello").pipe(delay(5000), timeout(1000));

The above will timeout after 1 second.

My angular 4.3.2 code is calling my back-end service that takes 2-4 minutes to return

The server must transmit a HTTP header and a partial body during the duration of 2-4 minutes. This is required to continue the HTTP connection, and there is nothing the client can do to keep the connection alive.

It is a bad practice for a HTTP request to not complete quickly.

You can either ask the server to start a task, and then poll on an interval to see if the task is complete, or you can use websockets to communicate with the server and remain connected until it is complete.

Both approaches are broad topics and I can't go into more details than that.

Coreycorf

Agreed. Tasks that are known to be long running on the server should immediately return some type of task id from the initial request, then logic should be implemented on the client and server to allow periodically polling for the result. Or you can get fancy and implement some kind of asynchronous eventing over WebSockets for delivery of results. – Marler

I just faced this issue and I am seeing one strange issue of browser. there is one post api api.xyz.com/image/upload When I hit this api from abc.xyz.com, browser terminate the connection after 2 mins with fail response and when I hit same backend api from def.xyz.com it's getting succeeded after 2.4 minutes and browser wait till 2.4 minutes. Code for both abc.xyz.com and def.xyz.com is same. – Depository

@reactgular So we cannot wait for Api call more then 2 minutes? – Cataclinal

Answer 2

I don't think it's a problem with the browser's network timeout, since I can make a much longer request using jQuery.ajax(), without even transmitting an HTTP header or a partial body from the backend, and the request is kept alive.

I didn't get a reply from you in the comments, but I was having this exact issue on my dev machine. I was using the proxy config, and the proxy's default timeout is 120 seconds (2 minutes). If that's your case, you just need to define a higher value in the configuration.

{
  "/api": {
    "target": "http://localhost:3000",
    "secure": false,
    "timeout": 360000
  }
}

But I agree with @Reactgular that in most cases, you'll want HTTP requests that return quickly.

Colley

This might work for local setup but, what about the actual environment. In my case, UI code is deployed as part of Java application. and the request times out in 30s. In local I am able to hold it for as long as I want. – Oro