Http request and response in Angular 2.0

Question

I am stuck in a problem, where my webservice (written in Spring boot) takes 5-6 minutes for a http response. I send a http post request from angular but chrome waits for only 2 minutes gives me a null response since there was no response from server. But server will give a response after 5 minutes. So how can I implement this scenario, since I think my http connection closes after 2 minutes and I want to extend it till 5-6 minutes. FYI I have already used rxjs timeout function but it doesn't work, the default timeout of 2 mins always wins. Thank you

Marshall

did you use promises? – Stoner

Check your server code performance – Ream

Add your code of Angular. – Atwitter

@SuvethanNantha yes i used promise but its of no use – Marshall

@DarshilGada is your issue is not resolved yet? what about the solution I gave ain't it working? – Walkthrough

@Walkthrough yes it worked – Marshall

Answer 1

The issue is not with chrome You must be using Proxying support in which dev-server makes use http-proxy-middleware package and the proxy options provided in this package is from underlying http-proxy library. one among them is

proxyTimeout:

timeout (in millis) when the proxy receives no response

The default value is ~120 seconds and a new request is made if the backend fails to respond within the stipulated time. overriding the default timeout with "timeout":360000 in the proxy config file will resolve the issue.

{
  "/api/*": {
     "target":  {
       "host": "localhost",
       "protocol": "http:",
       "port": 8080
     },
     "secure": false,
     "changeOrigin": true,
     "logLevel": "debug",
     "timeout":360000
  
  }
}

you also need to enable Cross-Origin Requests for a RESTful Web Service using @CrossOrigin annotation in your controller link.The @CrossOrigin is used to allow Cross-Origin Resource Sharing (CORS) so that our angular application running on a different server can consume these APIs from a browser.

    @CrossOrigin(origins = "http://localhost:4200", maxAge = 3600)
    @RestController
    @RequestMapping({"/api"})
    public class UserController {
           ......
}

I assume your angular is running on port 4200 with above configuration you can consume your API's.

NOTE: The proxy configuration is intended to proxy calls when running the dev server via ng serve. After you run ng build you are responsible for the web server and its configurations

Walkthrough

Its giving me HPE_INVALID_CHUNK_SIZE, when I try to use the data that I got from my webService. Can you please help me with that? – Marshall

Hi if this answer has solved your question please consider accepting it by clicking the check-mark. This indicates to the wider community that you've found a solution and gives some reputation to both the answerer and yourself. There is no obligation to do this. – Walkthrough