错误代码：0 ExceptionMessage：Http 失败响应（未知 url）：0 Angular 5 中的未知错误

Question

I am getting this error "Error Code: 0 ExceptionMessage: Http failure response for (unknown URL): 0 Unknown Error" on my Angular 5 project.

However, I am not able to recreate this issue, I saw this repeated issue on the Rollbar error log. I tried the same steps on my local machine, also tried to recreate in different browsers like chrome, safari, etc but no luck.

I'm using AWS lambda with .NET core 2.1, API proxy gateway, and Angular 5 on FrontEnd.

AngularJs code

getOrgPublicAssetName(id: number): Observable<any> {
    let content = this.appSharedService.getSitecontents();
    if (content !== '')
      return Observable.of(content);
    if (id !== undefined)
      return <Observable<any>>(
        this.httpClient
          .get(this.organizationUrl + '/SiteContent/' + id)
          .map(result => {
            this.appSharedService.setsitecontents(result);
            return result;
          })
          .pipe(catchError(this.exceptionService.catchBadResponse))
      );
    else return Observable.of();
  }

Following is my startup.cs configure function where I am already using cors.

public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)
        {
            app.UseXRay("Organizations");
            app.UseMiddleware(typeof(ErrorHandlingMiddleware));

            Environment.SetEnvironmentVariable(EnvironmentVariableAWSRegion.ENVIRONMENT_VARIABLE_REGION, Configuration["AWS:Region"]);

            // Create a logging provider based on the configuration information passed through the appsettings.json
            // You can even provide your custom formatting.
            loggerFactory.AddLambdaLogger(Configuration.GetLambdaLoggerOptions());

            //Enable swagger endpoint if the environment is not production

            if (!IsProductionEnvironment)
            {
                // Enable middleware to serve generated Swagger as a JSON endpoint.
                app.UseSwagger();

                // Enable middleware to serve swagger-ui (HTML, JS, CSS, etc.), specifying the Swagger JSON endpoint.
                app.UseSwaggerUI(c =>
                {
                    if (env.EnvironmentName == "Local")
                        c.SwaggerEndpoint(SwaggerLocalEndpoint, ApiName);
                    else
                        c.SwaggerEndpoint(SwaggerEndpoint, ApiName);
                });
            }

            app.UseCors(policy =>
            {
                //TODO: This has to be addressed once we deploy both api and ui under the same domain
                policy.AllowAnyOrigin();
                policy.AllowAnyHeader();
                policy.AllowAnyMethod();
                policy.WithExposedHeaders("WWW-Authenticate");
                policy.WithExposedHeaders("X-Total-Count");
            });
            app.UseAuthentication();
            app.UseMvc(routeBuilder =>
            {
                routeBuilder.Count().Filter().OrderBy().Expand().Select().MaxTop(null);
                routeBuilder.MapODataServiceRoute("odata", "odata", OrganizationModelBuilder.GetEdmModel());
            });
            app.UseForwardedHeaders(new ForwardedHeadersOptions
            {
                ForwardedHeaders = ForwardedHeaders.XForwardedFor | ForwardedHeaders.XForwardedProto
            });
            app.UseResponseCaching();
        }
    }

Answer 1

Your browser is not allowing your code to read the HTTP response because of the CORS error.

You will see the error in browser console logs (Chrome shows it)

1. Check AWS ApiGateway if OPTIONS request is correctly handled
2. In the Network TAB (if you are using Chrome), check the pre-flight request
3. You must check access-control-allow-origin header param sent by server in the network logs (response headers) and ensure it is correctly configured

If nothing works, delete the API gateway configuration and recreate them (it would be easy if you have cloud formation scripts). It always works