angular6 访问跨域问题

设置反向代理

1）建立本地代理proxyconfig.json文件

angular6项目里新建proxyconfig.json文件，放在根目录（和angular.json同级）

{
  "/apidata":{
    "target":"http://localhost:8093",
    "secure":false,
    "logLevel":"debug",
    "changeOrigin":true,
    "pathRewrite":{
      "^/apidata":""
    }  
  }
}复制代码

这里定义的/apidata就是路由匹配规则，遇到这个开始解析，并且跟pathRewrite 定义的要一致

target 设置的就是跨域域名端口

2）angular.json配置文件加载配置代理文件proxyconfig.json

然后在angular.json文件中使用上面的配置文件

"serve": {
  "builder": "@angular-devkit/build-angular:dev-server",
  "options": {
    "browserTarget": "project1:build",
    "proxyConfig":"proxyconfig.json"
  },复制代码

添加

 "proxyConfig":"proxyconfig.json"复制代码

3）服务文件里使用http.get获取接口数据，url地址需要配置上代理重写规则的 /apidata

转载于:https://juejin.im/post/5be5322ff265da611c267ac9