vue 接口带请求头

在Vue.js中，当向服务器发送HTTP请求时，有时可能需要携带自定义的请求头。这通常是出于认证、跨域资源共享（CORS）、API版本控制等目的。以下是如何设置axios（一个常用的Vue.js网络请求库）以包含请求头的步骤：

1. 首先，确保已经在项目中安装了axios库：

   npm install axios --save

2. 在main.js或某个模块中配置axios实例：

   import axios from 'axios'
   
   // 创建axios实例
   const instance = axios.create({
     baseURL: '你的API地址',
     // 添加默认请求头
     headers: {
       'Authorization': 'Bearer your-token', // 示例：JWT令牌
       'Content-Type': 'application/json', // 格式化请求体（如JSON）
       'X-Custom-Header': 'value' // 其他自定义头
     },
     // 如果有跨域需求，可以添加proxyTable配置
     // ... (适用于Vue CLI 3及更高版本)
   })
   
   Vue.prototype.$http = instance

3. 现在你可以像这样使用封装好的$http方法发送带有头部的请求：

   this.$http.get('/api/data', {headers: {customHeader: 'headerValue'}}).then(response => {
     // 处理响应...
   }).catch(error => {
     // 处理错误...
   })