vue2 Access-Control-Allow-Origin
时间: 2023-10-29 09:56:02 浏览: 237
对于 Vue 2 中的跨域请求,处理 `Access-Control-Allow-Origin` 的方式有几种。下面是其中两种常见的方法:
1. 代理方式:在 `vue.config.js` 文件中配置代理,将请求转发到目标域名。首先,确保你已经安装了 `http-proxy-middleware`:
```bash
npm install http-proxy-middleware --save
```
然后,在项目根目录下创建或编辑 `vue.config.js` 文件,并添加以下代码:
```javascript
module.exports = {
devServer: {
proxy: {
'/api': {
target: 'http://目标域名',
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
}
}
};
```
将 `'http://目标域名'` 替换为你想要请求的 API 地址的域名。
2. 设置响应头:如果你有权限修改服务器配置,可以在服务器端设置响应头来允许跨域请求。在返回响应时,添加以下头部信息:
```
Access-Control-Allow-Origin: 允许访问的域名
```
将 `'允许访问的域名'` 替换为允许访问你的 API 的域名。这样做的话,服务器会允许该域名的请求访问资源。
需要注意的是,第二种方法需要在服务器端进行配置,而第一种方法只需要在前端进行配置。根据你具体的情况选择适合的方法。
阅读全文