如何在vue的请求头中添加 'Access-Control-Allow-Origin'
时间: 2023-06-19 12:06:23 浏览: 109
在 Vue 中,可以通过设置 Axios 的请求拦截器来添加请求头。具体步骤如下:
1. 创建 Axios 实例:
```javascript
import axios from 'axios'
const instance = axios.create({
baseURL: 'http://api.example.com',
timeout: 5000
})
export default instance
```
2. 在 main.js 中引入 Axios 实例,并设置请求拦截器:
```javascript
import Vue from 'vue'
import App from './App.vue'
import axios from './axios'
Vue.config.productionTip = false
axios.interceptors.request.use(config => {
config.headers['Access-Control-Allow-Origin'] = '*';
return config
})
new Vue({
render: h => h(App),
}).$mount('#app')
```
以上代码中,我们通过 `axios.interceptors.request.use` 方法设置了请求拦截器。在请求拦截器中,我们可以对请求做出修改,这里我们添加了 `Access-Control-Allow-Origin` 头信息,值为 `*`,表示允许跨域请求。
注意:添加 `Access-Control-Allow-Origin` 头信息只对跨域请求有效,同域请求无需设置。
阅读全文