如何修复 iOS 12 Safari Cors 预检错误？

Question

我试图更好地理解 COR，因为我们网络应用程序的几个用户在升级到 iOS12 后抱怨他们收到预检错误。

来自网络检查器的错误

[Error] Preflight response is not successful
[Error] Fetch API cannot load https://www.api.com due to access control checks.
[Error] Failed to load resource: Preflight response is not successful (v4, line 0)

客户端应用程序是带有 Apollo 的 React 应用程序。它使用 Apache HTTPD 和 Express JS 通过 HTTPS 调用服务器。

在所有其他浏览器上一切正常，这与 iOS 12.

隔离

奇怪的是，当我查看 HTTPD 访问日志时，我看不到任何预检调用。当我尝试直接访问服务器时（在 iOS 12 上），我在日志中看到了预检选项请求和 POST。但是通过web app调用服务器时，CORs preflight失败

在快递应用中，我也注销了所有请求，也没有出现。

在 HTTPD 中我有

的设置

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS

在快递里我也有同样的东西。

有什么想法吗？！

Answer 1

这是 iOSv12 中的一个错误，但它已在 iOSv12.1 beta (16B5059d) 中修复，假设当前的 beta 代码已投入生产。

问题是 iOSv12 WebKit 预检选项调用不会离开设备。我已经运行 WireShark 和 iOSv12 模拟器来确认这一点。

Answer 2

如果您在 ionic 中遇到错误，请删除此插件 "cordova-plugin-ionic-webview"

Answer 3

如果显示 Header not allowed in "Access-Control-Allow-Headers"，您可以通过从服务器端添加特定的 Header 来修复它，您将发送 "Access-Control-Allow-Headers"。因为通配符不起作用即“Access-Control-Allow-Headers”：“*”

应该是 “Access-Control-Allow-Headers”：“*，接受，Content-Type，Content-Length，Accept-Encoding，CUSTOM-ALLOWED-HEADER”

Answer 4

对于任何运行进入此问题的人来说，问题是 iOS12 不喜欢 <add name="Access-Control-Allow-Headers" value="*" /> 当您有任何自定义 header 时。这是在似乎从未进入正式版本的 BETA 中修复的。

解决方法是分别指定每个自定义header，例如：<add name="Access-Control-Allow-Headers" value="*,customheader1,customheader2" />

如何修复 iOS 12 Safari Cors 预检错误？

How to fix iOS 12 Safari Cors preflight error?

cors

ios

express

apollo

ios12