angular6 http requests returns isTrusted

Question

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.

Answer 1

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;
    }
  }
}