在前后端分离开发中,前端发送ajax请求因为受到了浏览器同源策略的限制,会出现跨域的问题,在Vue项目中使用代理请求解决跨域问题
- 如果使用vue/cli 4.x以上版本创建的Vue项目,在项目的根目录中创建 vue.config.js 配置文件。
- 在Vue项目根目录创建 vue.config.js 配置文件,配置代码如下:
module.exports = {
devServer: {
proxy: {
'/api': {
target: 'http://localhost:3000', //服务端地址
ws: true, //如果要代理 websockets,配置这个参数
changeOrigin: true, // 允许跨域
pathRewrite: {
'^/api': '' // 标识替换,使用 '/api' 代替真实的接口地址
}
}
}
}
}