在 Vue.js 项目中，你可以通过在
vue.config.js 文件中配置代理服务器来解决跨域问题。Vue CLI 提供了一种方法，即使用 devServer.proxy 选项。以下是一个基本的例子
module.exports = {
devServer: {
proxy: {
'/api': {
target: '<url>', //你要代理的服务器地址
ws: true, //是否代理 websockets
changeOrigin: true, //是否允许跨域，在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据
pathRewrite: {
'^/api': '' //这里理解成用'/api'代替target里面的地址，后面的组件中我们掉接口时直接用/api代替
}
}
}
}
}
请将
<url> 替换为你希望代理的服务器地址。你可以把它当作一个映射表，用于把某个 URL 的前缀映射到某个 URL 目标上。例如，你在进行开发时，可能会有一些 API 请求需要发送给开发服务器，这时，你就可以通过配置这个 proxy 选项来将这些 API 请求发送给开发服务器，而非直接发送给生产服务器。
module.exports = {
devServer: {
open: true,
host: 'localhost',
port: 8000,
https: false,
//以上的ip和端口是我们本机的;下面为需要跨域的
proxy: { //配置跨域
'/api': {
target: 'http://127.0.0.1:8000/api/', //这里后台的地址模拟的;应该填写你们真实的后台接口
ws: true,
changOrigin: true, //允许跨域
pathRewrite: {
'^/api': '' //请求的时候使用这个api就可以
}
}
}
}
}