跨域问题是一个很烦的问题,IONIC 可以通过配置代理来解决,或者使用@ionic-native/http/ngx这个插件,下面展示用法:
1:代理解决跨域问题
在项目根目录增加 proxy.config.json 文件内容为:
{
"/XXX": {
"target": "http://XXX.cn/XX",
"secure": false,
"logLevel": "debug",
"changeOrigin": true,
"pathRewrite": {
"^/Punch": ""
}
},
"/img": {
"target": "http://XX.cn/img",
"secure": false,
"logLevel": "debug",
"changeOrigin": true,
"pathRewrite": {
"^/img": ""
}
}
}
XXX 为你需要的代理路径
然后在 angular.json 中的 修改
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "app:build",
"proxyConfig": "proxy.config.json"
即可。
2:下面通过设置浏览器,不增加ionic 代码来解决跨域问题
只针对谷歌浏览器:
在浏览器快捷方式增加 --disable-web-security --user-data-dir 属性 dir 后面跟随你的安装路径
例如
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir=C:\Program Files (x86)\Google\Chrome\Application
image.png
3 : 使用 @ionic-native/http/ngx 来解决跨域,通过 Platform 来判断是否为真机,如果真机使用@ionic-native/http/ngx 否则使用angular ,可以配合方法2来使用