在開發(fā)環(huán)境下可以前端配置devServer解決跨域問題
在package.json同級目錄下新建一個vue.config.js文件蓬戚，配置如下代碼
module.exports = {
devServer: {
overlay: {
// 讓瀏覽器 overlay 同時顯示警告和錯誤
warnings: true,
errors: true
},
host: 'localhost',
port: 8080, // 端口號
https: false, // https:{type:Boolean}
open: true, // 配置自動啟動瀏覽器
hotOnly: true, // 熱更新
proxy: {
// 配置多個跨域
'/api': {
target: 'http://192.168.1.106:8002',//跨域接口的地址
changeOrigin: false,
pathRewrite: {
'^/api': ''
}
}
},
headers: {
'Access-Control-Allow-Origin': '*',
}
}
};
溫馨提示:axios中baseURL的地址需要與devServer中保持一致，否則即使配置成功仍然會顯示跨域浪规，或者地址不存在的話還會報404錯誤。我就遇到了這個問題仑乌，“||”分割開的地址應用順序是從第一個開始绣檬，如果第一個地址存在就不再使用后面的地址，所以如果前面配置了錯誤的地址颈抚，可不就404了嘛！＝鲤摹贩汉！我這么理解可有問題，大家告訴我一下唄
axios.js
