vue前后端对接（代理转发）

1.vue项目基于webpack
在config目录下的index.js
在cssSourceMap后面添加

proxyTable: {
'/': {
    target: "http://localhost:3000/", //后端地址
    changeOrigin: true, //允许跨域
    pathRewrite: { // 路径重写，
      '^/': '' // 替换target中的请求地址，也就是说以后你在请求http://xxxx/v2/XXXXX这个地址的时候直接写成/v2/XXXXX即可。
    }
  }
}

2.基于vue-cil模板
在项目根目录下创建一个vue.config.js，也是设置代理

 1 devServer: {
 2         open: true,//将服务启动后默认打开浏览器
 3         host: '0.0.0.0',
 4         port: 8080,
 5         https: false,
 6         hotOnly: false, // 热更新
 7         proxy: {// 设置代理
 8             '/': {
 9                 target: '后端地址',
10                 changeOrigin: true,//允许跨域
11                 pathRewrite: { // 路径重写，
12                     '^/': ''// 替换target中的请求地址，也就是说以后你在请求http://xxxx/v2/XXXXX这个地址的时候直接写成/v2/XXXXX即可。
13                 }
14             }
15         },
16         before: app => { }
17     },

 

posted @ 2021-03-23 10:10  浅笑19  阅读(241)  评论(0)    收藏  举报