设备上的生产构建也出现 CORS 错误

Question

我已经使用这个 CLI 构建了 Ionic 4 应用程序：

ionic cordova build android --prod

service.ts

  get(): Observable<any> {
   return this.http.get("http://api.openweathermap.org/data/2.5/forecast?lat=52.974431&lon=70.2398363&appid=myapi&units=metric");
  }

为什么还是会报 CORS 错误？

访问 XMLHttpRequest 在 'http://api.openweathermap.org/data/2.5/forecast?lat=52.974431&lon=70.2398363&appid=myid&units=metric' 来自原点“http://localhost:8100”已被 CORS 策略阻止： 响应中“Access-Control-Allow-Origin”标头的值 当请求的凭证模式为 '包括'。发起请求的凭证模式 XMLHttpRequest 由 withCredentials 属性控制。

据我所知，它应该在设备上运行而不会出错，不是吗？为什么它仍然在设备上显示http://localhost:8100？根据this doc，它应该可以在设备上正常工作吗？

注意：我使用chrome://inspect/#devices 来获得上述错误？

Answer 1

最近我遇到了同样的问题，但我通过在 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