CORS 适用于 Chrome 但不适用于 Safari 或 iOS 设备

Question

CORS 适用于 Chrome 但不适用于 Safari 或 iOS 设备（IONIC APP）我试图在我的请求中添加一些 headers 但没有用

        'Access-Control-Allow-Origin': '*',
        'Access-Control-Allow-Methods': 'POST, GET, OPTIONS, PUT',
        'Accept': 'application/json',
        'content-type': 'application/json'

我也尝试在 Safari 中禁用 CROSS-ORIGIN 限制，它运行良好但在 IOS 模拟器或设备

那么，如何解决？

Answer 1

Ionic 应用程序（android、ios 和 ionic serve）在本地主机上运行。默认情况下 web api 不允许来自不同来源的请求。

所以你有 3 个选择：

允许在 web api / 服务器中跨源请求。
在离子应用程序中设置代理 link。我试过它在 android 中有效，而不是在 ios 中有效。
使用 ionic native http link（推荐）它将在两者中解析。

Answer 2

您可以在应用的后端代码中添加以下代码。 header('Access-Control-Allow-Origin: *'); 希望对你有帮助。

Answer 3

最近我遇到了同样的问题，但我通过对 android 和 ios 设备使用 cordova-plugin-advanced-http 解决了它。

安装

ionic cordova plugin add cordova-plugin-advanced-http
npm install @ionic-native/http

使用

import { HTTP } from '@ionic-native/http/ngx';

constructor(private http: HTTP) {}

...

this.http.get('http://ionic.io', {}, {})
  .then(data => {

    console.log(data.status);
    console.log(data.data); // data received by server
    console.log(data.headers);

  })
  .catch(error => {

    console.log(error.status);
    console.log(error.error); // error message as string
    console.log(error.headers);

  });

更多详情：见official link

Answer 4

我通过在服务器端配置

中添加 Access-Control-Allow-Headers:"*" 并用我的自定义 headers 替换 * 来实现

CORS 适用于 Chrome 但不适用于 Safari 或 iOS 设备

CORS works on Chrome but not on Safari or on iOS device

ionic4