Ionic - $http 在移动设备中有效,但在浏览器中显示 CORS 和预检错误

Ionic - $http works in mobile device but in browser it shows CORS and preflight error

我正在使用 Ionic 框架开发移动应用程序。我使用 $http(POST 和自定义 header),当我尝试

离子发球

在浏览器(chrome、firefox、...)中,我得到

对预检请求的响应未通过访问控制检查:请求的资源上不存在 'Access-Control-Allow-Origin' header。因此不允许 Origin 'null' 访问。响应具有 HTTP 状态代码 405。

错误。如果我在 chrome 中启用 CORS 插件并尝试相同,我得到

预检响应具有无效的 HTTP 状态代码 405

错误。

但是当我使用

将它安装到我的手机(Android/IOS)时一切正常

离子运行android

离子运行ios

是什么让我的浏览器限制 $http 以及为什么我的手机允许它。? Webview 和浏览器有区别吗?

信息: - 我正在使用(默认)cordova 插件 - 控制台、设备、闪屏、状态栏、白名单、键盘

请帮帮我。没有正确的理解,我不能简单地构建移动应用程序。提前致谢。

编辑 1

我正在使用处理自定义 Header 请求的 REST API。截至目前,我不允许修改 API 代码,因为它 运行ning 对于原生 android 应用程序来说已经很长一段时间了。问题是当我使用 Ionic 时,令我惊讶的是它在我的 Samsung Tab 和 IPad 中工作(当我 运行 没有 livereload 模式时)。

我只想知道,是什么导致我的浏览器受到限制而我的移动设备无法正常工作?

移动设备中的 WebView 不像浏览器中那样具有安全策略吗?

为什么我的移动应用可以正常运行,但在浏览器中却不行?

我在我的 Ionic 项目中使用 cordova-plugin-whitelist。它实现了用于导航应用程序 webview 的白名单策略。 check source

要使浏览器正常工作,请在我的 ionic.config.json 中定义代理。但这只是一种解决方法。对于生产,我们应该让服务器允许它明确地将 API 调用列入白名单。 check source

@Naveen - Ionic 写了一篇关于浏览器和 in-app 处理 http 源 header 之间差异的博客文章:http://blog.ionicframework.com/handling-cors-issues-in-ionic