14
votes

I have an angular6 application running in production, sporadically a few users are getting an error during http requests.

Http failure response for (unknown url): 0 Unknown Error response: {"isTrusted":true}

This affects users randomly, there is no pattern in the HTTP method the user or anything else as far as I can tell, I use sentry to log errors.

I already spent a lot of time searching for a solution, so far almost everything hinted at wrong cors headers. All requests are going through an api gateway where the cors headers are set.

'Access-Control-Allow-Headers': 'Content-Type, x-internal-token, Origin, Accept, X-Requested-With, If-Modified-Since, Cache-Control, Keep-Alive'
'Access-Control-Allow-Origin': 'http://example.com'
'Access-Control-Allow-Methods': 'PUT, POST, GET, DELETE, PATCH, OPTIONS'
'Access-Control-Max-Age': 3600

So far I haven't received any errors when the app is first loading and is getting some information from the api gateway, only later while the user is using the app. Even stranger I also got this error for ./assets/i18n/de.json (normal get request), which is not cors but just some static json for dynamic translations.

I'm totally out of ideas and any help is very much appreciated.

EDIT: Please read carefully; this problem only exists for some users and not all the time, this is not a general misconfiguration!

EDIT2: To further debug this issue I set up a second api-gateway (same code) that was configured to log all requests. A slight modification was made to the angular app so it would do the same request twice; one time against the real api-gateway and one time against the logging api-gateway (for some api calls). In one instance the app was able to do the request to the real api-gateway but not the logging gateway (same code, both nginx, cors header are the same).

EDIT3: The log gateway and the real api-gateway are located on different servers (different providers) and I can see the OPTIONS request in the nginx log with status 200.

EDIT4: I've moved the cors handling from api-gateway to nginx and so far I haven't received more errors.

2
Check and see if any of these solutions might help. stackoverflow.com/questions/47180634/… - Budhead2004
Thanks, already saw this and no solution did help. - redshark1802
The error message cited in the question is unrelated to CORS - sideshowbarker
Have you tried to turn off AdBlock? - Wojciech K
Is there any way you can verify if the users that experience this are being stripped of their CORS header? Depending on corporate network settings this could explain why only some users would experience it. - Maartenw

2 Answers

1
votes

It seems like Nginx configuration issue. The following Nginx codes will add HTML header responses Access-Control-Allow-Origin: * : public web static files of domain to let other domains access these web static files without issues:

location / {
  location ~* ^.+\.(?:css|cur|json|js|jpeg|gif|htc|ico|png|txt|otf|ttf|eot|woff|svg|webp|webm|zip|gz|tar|rar)$ {
    # If request comes from allowed subdomain
    # (yourdomain.com) then we enable CORS
    # if ($http_origin ~* (https?://yourdomain\.com(:[0-9]+)?$)) {
    #  set $cors "1";
    # }

    set $cors "1";

    # OPTIONS indicates a CORS pre-flight request
    if ($request_method = 'OPTIONS') {
      set $cors "${cors}o";
    }

    # Append CORS headers to any request from 
    # allowed CORS domain, except OPTIONS
    if ($cors = "1") {
      more_set_headers 'Access-Control-Allow-Origin: $http_origin';
      more_set_headers 'Access-Control-Allow-Credentials: true';
    }

    # OPTIONS (pre-flight) request from allowed 
    # CORS domain. return response directly
    if ($cors = "1o") {
      more_set_headers 'Access-Control-Allow-Origin: $http_origin';
      more_set_headers 'Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE';
      more_set_headers 'Access-Control-Allow-Credentials: true';
      more_set_headers 'Access-Control-Allow-Headers: Origin,Content-Type,Accept';
      add_header Content-Length 0;
      add_header Content-Type text/plain;
      return 204;
    }
  }
}
0
votes

I think, this will solve the problem. In json file, please update the assets property to include an 'array' instead of 'string'.

It an issue with Angular CLI beta versions vs stable releases.

"apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": "assets"
    }
]

 "apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": [
        "assets"
      ]
    }
]