离子应用程序中的 CORS 问题

Question

我正在构建一个简单的 ionic/angular 移动应用程序。 我正在使用 IntelliJ IDEA 进行开发。

在开发过程中，我只是使用 Intellij 终端的“ionic serve”命令，在浏览器中启动移动应用程序。 该应用程序连接到部署在 Tomcat 服务器上的 REST 服务。

当应用程序尝试连接到 REST 服务时，它在浏览器控制台中给我以下错误

XMLHttpRequest 无法加载http://localhost:8080/MyWorkflows/rest/UserService/users 。 请求的资源上不存在“Access-Control-Allow-Origin”标头。 因此，不允许访问 Origin ' http://localhost:8100 '。 响应的 HTTP 状态代码为 500。

我知道这是因为 REST 服务在不同的域上运行，因此浏览器会阻止它。 但是，我不知该如何进行？

有人可以帮忙吗。

Answer 1

在部署在 Tomcat 上的 REST 服务中，您应该设置Access-Control-Allow-Origin: http://localhost:8100并且您需要允许与Access-Control-Allow-Methods一起使用的 http 请求方法：POST、GET、OPTIONS .

这告诉浏览器您的服务允许在http://localhost:8100上运行的 Web 应用程序访问该服务。 浏览器在资源请求时检查这一点。 对于 GET 以外的 http 请求方法，可能会添加一个额外的预检请求，因此您还需要让 WebService 回答该请求。

见https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

Answer 2

如果您不控制远程端，请使用Ionic CLI 代理服务器。 Ionic 博客上有非常好的操作方法文章： Handling CORS issues in Ionic 。