Question

我正在使用Ionic 3，并连接到简单的PHP api。首先，我遇到了CORS的问题，但可以使用以下代理来解决这些问题：

{
  "name": "demoApp",
  "integrations": {
    "cordova": {}
  },
  "type": "ionic-angular",
  "proxies": [
    {
      "path": "/mapi",
      "proxyUrl": "https://external.domain.com/mapi"
    }
  ]
}

使用ionic serve在浏览器中进行测试时，一切正常。但是，当在模拟器（iOS和android）或实际设备中运行时，我在干净简单的GET请求中收到404错误。同样在网络浏览器中运行--prod版本（例如：ionic cordova run browser --prod -l -c）将返回相同的404 not found。

我收到的实际错误是：

Http failure response for http://localhost:8000/mapi/test: 404 Not Found

有人可以在这里向我指出正确的方向吗？

离子信息：

Ionic:

   ionic (Ionic CLI)  : 4.1.2 (/usr/local/lib/node_modules/ionic)
   Ionic Framework    : ionic-angular 3.9.2
   @ionic/app-scripts : 3.2.0

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : android 7.0.0, browser 5.0.4, ios 4.5.4
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.0.5, cordova-plugin-ionic-webview 1.2.0, (and 5 other plugins)

System:

   Android SDK Tools : 25.1.7 (/Users/Vincent/Library/Android/sdk)
   ios-deploy        : 1.9.2
   NodeJS            : v9.1.0 (/usr/local/bin/node)
   npm               : 6.4.1
   OS                : macOS High Sierra
   Xcode             : Xcode 9.4.1 Build version 9F2000

Answer 1

将应用程序部署到模拟器或设备上与将其部署到Web浏览器不同。浏览器是计算机的“一部分”，而模拟器则有所不同。尤其是在部署到电话时，您的电话未连接到计算机，因此当您致电localhost时，它不会知道您要连接到计算机。

这是两个不同的问题：

模拟器：由于在计算机上运行，因此在模拟器上连接到本地主机要容易得多。在模拟器中，您可以使用以下IP地址而不是localhost访问您的API：http://10.0.2.2:hostport
设备：就像在一台计算机上运行 ionic serve 并在另一台计算机上运行API一样。您可以在此处了解有关如何连接它们的更多信息：Accessing localhost:port from Android emulator

Answer 2

我已经遇到了问题，您可以看一下这篇文章：https://blog.ionicframework.com/handling-cors-issues-in-ionic/

为简化起见，CROSS问题仅在您使用“离子服务”时出现，当您在模拟器或设备上使用应用程序时，您应该不会遇到问题，只需使用“真实网址”即可。

正确处理此问题的一种方法是管理“环境”配置文件，并在更改环境时更改“地址”。检索网址可能如下所示：

const url = AppConfig.SERVER_URL +'/ mapi”

使用代理解决CORS问题可在浏览器中运行，而不是在模拟器或设备上

2 个答案: