angular6 http 请求返回 isTrusted

Question

我有一个在生产环境中运行的 angular6 应用程序，偶尔会有一些用户在 http 请求期间遇到错误。

(未知 url)的 Http 失败响应:0 未知错误响应:{"isTrusted":true}

这会随机影响用户，据我所知，用户的 HTTP 方法或其他任何内容都没有模式，我使用 sentry 来记录错误。

我已经花了很多时间寻找解决方案，到目前为止，几乎所有内容都暗示错误的 cors header 。所有请求都通过设置了 cors header 的 api 网关。

'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

到目前为止，当应用程序首次加载并从 api 网关获取一些信息时，我没有收到任何错误，只是在稍后用户使用该应用程序时。甚至陌生人我也收到了 ./assets/i18n/de.json 的错误(正常的获取请求)，这不是 cors，而是一些用于动态翻译的静态 json。

我完全没有想法，非常感谢任何帮助。

编辑:请仔细阅读；这个问题只存在于一些用户而不是一直存在，这不是一般的错误配置!

EDIT2:为了进一步调试这个问题，我设置了第二个 api 网关(相同的代码)，该网关被配置为记录所有请求。对 Angular 应用程序进行了轻微修改，因此它会两次执行相同的请求；一次针对真实的 api 网关，另一次针对日志记录 api 网关(对于某些 api 调用)。在一个实例中，应用程序能够向真正的 api 网关发出请求，但不能向日志记录网关发出请求(相同的代码，nginx、cors header 相同)。

EDIT3:日志网关和真正的 api 网关位于不同的服务器(不同的提供商)，我可以在 nginx 日志中看到状态为 200 的 OPTIONS 请求。

EDIT4:我已将 cors 处理从 api-gateway 移至 nginx，到目前为止我还没有收到更多错误。

Answer 1

这似乎是 Nginx 配置问题。以下 Nginx 代码将添加 HTML header 响应 Access-Control-Allow-Origin: * : 域的公共(public) Web 静态文件，让其他域可以毫无问题地访问这些 Web 静态文件:

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