离子框架：Android 模拟器无法访问主机上的服务

Question

我正在尝试实施 Ionic 示例教程，网址为 http://ccoenraets.github.io/ionic-tutorial/install-ionic.html

我能够在 Android 虚拟设备上部署示例应用。但是，该应用程序无法访问笔记本电脑上托管的 REST 服务。我正在尝试通过将“localhost”更改为“10.0.2.2”来访问该服务。我还在 config.xml 中添加了以下内容

<access origin="*"/>

谁能告诉我如何解决这个问题？

Answer 1

如果您使用的是最新版本的 cordova 之一，则必须安装 cordova plugin whitelist：

cordova plugin add cordova-plugin-whitelist

如果您使用选项--save，它将在您的 config.xml 文件中添加一个部分：

cordova plugin add cordova-plugin-whitelist --save

您可以阅读一些有用的信息here，了解近期科尔多瓦更新中的重要变化。

你需要有这个：

<access origin="*" />

在您的 config.xml 文件中设置。

如果您使用的是 android 模拟器，则必须将 localhost 更改为 10.0.2.2，当然，如果端口与默认值不同，则必须添加端口：80。

参考here。

如果你使用Genymotion（比安卓模拟器好很多），IP 地址将是：10.0.3.2 + 端口号。

样本

Android 模拟器：http://10.0.2.2:6050/api/checkstatus
Genymotion：http://10.0.3.2:6050/api/checkstatus

如果您想获得 android 模拟器的调试信息，请从命令行运行：

adb -s emulator-5554 logcat

如果您在 IIS Express 中运行 Web 服务器，您的请求可能无法到达主机。 这里有几个选项。我最喜欢的解决方案是使用iisexpress-proxy。
您可以将其安装为 npm 包：

npm install -g iisexpress-proxy

并指定代理端口运行它：

iisexpress-proxy 6050 to 3000

现在您可以更改模拟器的端口：

Android 模拟器：http://10.0.2.2:3000/api/checkstatus
Genymotion：http://10.0.3.2:3000/api/checkstatus

可能最好的解决方案是使用真正的 android 设备并使用 chrome inspect 调试您的应用。

你必须：

• 在您的手机上启用 USB 调试
• 在 chrome 浏览器中访问 link (chrome://inspect/#devices)

一旦您的设备显示在列表中，您可以按 F12 并查看您在浏览器控制台中遇到的错误类型。

您甚至可以使用端口转发转发请求到内部服务器；基本上，您可以通过要定义的虚拟端口访问笔记本电脑上的托管服务。