angualr5 跨域请求

最近开发新项目碰到了跨域请求问题，解决办法采用前端代理；

1.首先需要建立一个JSON文件,文件名”proxy.config.json”在angular目录下

{

"/v1.1":{

        "target":http://192.168.123.12, //需要连接机器的ip地址

        "secure": "false" //根据个人需求添加是否要跨域传cookie

        }
}

/api是代理的名称,一般都是接口请求的ip地址后面的第一个参数名

比如: http://192.168.123.12/v1.1/application/info,为一个登录的接口,反向代理后写接口请求的时候只需要写

httpClient.get(‘/v1.1/application/info’).subscribe(req => {console.log(req);});

因为http://192.168.123.12已经被代理到/v1.1上!

2.然后配置”package.json”文件

"scripts": {

    "ng": "ng",

    "start": "ng serve --proxy-config proxy.config.json",

    "build": "ng build --prod --aot",

    "test": "ng test",

    "lint": "ng lint",

    "e2e": "ng e2e"
}

3.重启项目

因为前端的代码和后台代码都是放在一个同一个服务器上，所以上述的http://192.168.123.12在服务器上改为localhost:4200即可，不用担心域名暴露的问题，会被后台重定向到项目网站域名上。目前还没试过前后端代码不在同一个服务器。