如何解决真实设备中的 CORS 问题？

Posted 2023-03-04

【中文标题】如何解决真实设备中的 CORS 问题？

【英文标题】：How to resolve CORS issue in real device?

【发布时间】：2019-03-01 11:31:43

【问题描述】：

我正在使用 Ionic 开发一个 android 应用程序。我正在调用一些 API 作为数据提供者。在调用 API 时，即使在真实设备上我们也会收到 CORS 错误来解决这个问题，我们使用了代理。添加代理 API 后，在 Web 浏览器上可以正常工作，但在真实设备上却不行。

“代理”：[ "路径": "/api", "proxyUrl": "http://192.168.43.221:9090/api" ]

现在这将我的来源更改为 localhost:8080 例如URL http://192.168.43.221:9090/api/getvisitorcount 被转换为 http://localhost:8080/api/getvisitorcount

【问题讨论】：

如果您在真实设备上运行应用程序，请不要使用代理。

【参考方案1】：

记住Ionic只用于client side的编程，cors中间件的配置建立在server side之上，取决于你使用的语言、框架、库等。

在您的 http 调用中，您只能添加一些选项，例如 headers。

const headers = new Headers(
  'Content-Type': 'application/json',
  'Authorization': token
);
const options = new RequestOptions(
  headers: headers
);
this.http.post(url, query, options).subscribe(response => 
  console.log(response);
)

【讨论】：

我使用了一个在浏览器中启用 CORS 的扩展程序，一切正常。如果这是服务器端问题，这怎么可能？

查看 fullstack-developer.academy/what-is-cors 服务器端的 cors 中间件确定允许的方式和来源。