Search code examples
angular.net-coretimeout

Backend returned code 0, body was: [object ProgressEvent] - Angular 5

In my angular application, I'm calling an API that takes more than 2 minutes to respond but after 2 minutes, angular throws following error;

Access to XMLHttpRequest from origin has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Backend returned code 0, body was: [object ProgressEvent]

Failed to load resource: net::ERR_FAILED

I've tried every possible solution that I found on internet and SO like;

  1. Adding timeout on service call;

    return this.httpClient.post<ViewModelResponse>(this.baseUrl + this._getMetaDataUrl, { headers: this.configurations.getHeaderWithAuth() }).timeout(300000);

  2. Adding timeout with pipe

    return this.httpClient.post<ViewModelResponse>(this.baseUrl + this._getMetaDataUrl, { headers: this.configurations.getHeaderWithAuth() }).pipe(timeout(300000));

  3. Implements HttpInterceptor followed this answer

  4. Added timeout in headers "timeout": ${300000}

  5. Increased IIS server timeout to 20 minutes..

  6. People also suggested changes in Proxy file but I don't have any proxy file..

But nothing worked for me.. all these solutions failed once the API response exceeds 2 minutes. I'm using dotnet core at backend and it returns proper response everytime.

In case of Pipe(timeout()), call was at backend but angular throws error that response is null

Any kind of help will be appreciated.

Solution

  • After a lot of searching, I finally found my issue. And as everyone was saying, it was a backend server (Dotnet Core) Issue.

    Setting the RequestTimeout="00:20:00" on the aspNetCore tag in web.config and deploying the site resolved my problem.

    This article has details of adding timeout in dotnet core application.