最近需要在Vue開發(fā)環(huán)境中用到進行跨域請求，整理了一下proxy
用料：vue-cli3淑趾，http-proxy-middleware吱殉，@vue/cli-service，axios
- 首先對于cli3版本來說珊拼，在根目錄下少了build和config目錄食呻，那么這時候就需要去手動創(chuàng)建 vue.config.js 來配置。
//文件中格式如下
module.exports = {
devServer:{
proxy:{
"/api":{ //設置跨域變量代號
target:"https://m.mi.com/", //你想要代理的目標源鏈接
changeOrigin:true, //開啟代理
pathRewrite:{ //設置二級
"^/api": "/",
"^/api2": "/body"
}
}
}
}
}
- 接下來需要安裝sevice（如果已經存在，請忽略）仅胞，會自動去匹配 vue.config.js 中是否有指定的鏈接字段
npm install @vue/cli-service --save
- 使用浪感。比如在axios中使用。
method:'post',
url:"/api/v1/home/page",
headers:{
'Content-Type':'application/x-www-form-urlencoded'
}
})
那么實際在使用的時候饼问，雖然還是顯示的是localhost8080,但是實際已經被替換過了
替換成功后影兽，顯示的是localhost，但是其實是自己設置的代理鏈接
