ionic跨域(Access-control-allow-origin)

浏览器测试运行ionic serve发送异步请求是会出现403跨域。

esponse to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8100' is therefore not allowed access. The response had HTTP status code 403.

403跨域请求错误.png

一、在 app.config.json 文件配置 proxies ，复制时删除注释

//ionicProject/ionic.config.json
{
    "name": "ionicProject",
    "app_id": "",
    "type": "ionic-angular",
    "integrations": {
        "cordova": {}
    },
    "proxies": [
        {
            "path": "/mobile/", //需要替换的标识符
            "proxyUrl": "http://192.168.1.178:8089/mobile/"  //最终替换的地址
        }
    ]
}

二、全局请求地址调整

//SERVE_URL = "http://192.168.1.178:8089/mobile/";
SERVE_URL = "/mobile/";

三、angular http请求代码

this.http.post(SERVE_URL + 'user/sendMobileMsg.json', {
    phone: this.mobile
}).subscribe((res: Response) => {
    console.log(res);
});

四、请求结果

请求结果