在vue项目中,很多情况下需要解决跨域问题,跨域文件的配置方法入下:
- 首先在项目根目录下创建
vue.config.js
文件,在该文件内配置跨域相关代码:
module.exports = {
devServer: {
proxy: {
'/api': { // 使用 /api 来代替真实地址
target: 'http://172.16.8.32:8080/', // 真实地址
changeOrigin: true, // 改变源
secure: false, // https
pathRewrite: { // 路径重写
'^/api': ''
}
}
}
}
}
- 可以配置多个:
module.exports = {
devServer:{
proxy:{
'/api':{
target:'http://localhost:1234',
changeOrigin:true,
secure:false,
pathRewrite:{
'^/api':''
}
},
// 代理多个
'/api2':{
target:'http://localhost:5678',
changeOrigin:true,
secure:false,
pathRewrite:{
'^/api':''
}
}
}
}
}
- 配置该文件之后需要重启项目