javascript - Ionic 3 中的 CORS hell

Question

我有一个后端服务器(Spring Boot，由 nginx 代理)，我的 Ionic 应用程序与之通信。对于每个请求，它都会发送以下 header :access-control-request-headers: *, access-control-allow-headers: *, access- control-allow-origin: *, access-control-allow-methods: GET, POST, PUT, HEAD, OPTIONS, DELETE, PATCH.没有异常(exception)。

它还允许 OPTIONS 请求并为每个请求返回 HTTP 200。

现在，我有一个使用 @angular/common/http 的 ionic 应用程序。在浏览器中，一切正常，我可以优雅地发出 GET 和 POST 请求。

但是在模拟器中(当我使用 ionic cordova emulate ios 运行时，我只能发出 GET 请求，POST 失败并显示以下内容:

{"headers":{"normalizedNames":{},"lazyUpdate":null,"headers":{}},"status":0,"statusText":"Unknown Error","url":null,"ok":false,"name":"HttpErrorResponse","message":"Http failure response for (unknown url): 0 Unknown Error","error":{"isTrusted":true}}

如您所见，它显示status: 0。这是指 CORS 问题，但我不知道如何进一步调试它。

我的请求在 Postman 中都成功了，甚至在 curl 中也是如此。只有在模拟器中它们才会失败。

Answer 1

CORS 再次，我希望这可能对某人有所帮助:

显然，Access-Control-Allow-Headers header 的通配符 (*) 值仅在 2016 年 5 月才被接受(reference1，reference2)，所以一些浏览器可能仍然不支持它。因此，从:

Access-Control-Allow-Headers: *

到

Access-Control-Allow-Headers: Content-Type, X-Auth-Token

(基本上，我的应用程序使用的 header 的确切值)，我能够解决这个问题。显然我在桌面上使用的浏览器支持通配符 header 值，但模拟器和设备的浏览器不支持。绝对不是设备与模拟器的问题，而是浏览器与浏览器的问题。