1.在根目录创建 vue.config.js
2.在里面写入vue.config.js
module.exports = {
// 服务项配置
devServer: {
proxy: {
"/home": {
target: "http://127.0.0.1:3000",
changeOrigin: true, //表示是否跨域,
pathRewrite: {
//表示需要rewrite重写的
"^/home": "/home"
}
}
}
}
};
3.发送请求
<script>
import axios from "axios";
export default {
created() {
console.log(axios.get("/home/banner"));
}
};
</script>
4.后台的接口地址 :127.0.0.1:3000/home/banner
思路:
1.在vue.config.js中添加proxy进行反向代理实现 前端跨域
2.在vue.config.js中 写了 3个 /home 尽量保持统一 也可不重写路劲 也可以 / 发送请求 下面想咋改咋改
module.exports = {
// 服务项 proxy 跨域配置
devServer: {
proxy: {
// 下面的 / 代表所有接口都可以发送
"/": {
target: "http://127.0.0.1:3000", // 跨域目标地址
changeOrigin: true, //表示是否跨域,
pathRewrite: {
//表示需要rewrite重写的
"^/home": "/home"
}
}
}
}
};
3.通过axios发送请求的 不用在写 默认地址了 proxy 已经配置了跨域地址
发表评论