uniapp怎么设置请求头

1. 什么是请求头

在发送请求时，请求头是一个包含请求信息的 HTTP 报文头部。通常包含了请求的标识、发送端信息、请求类型、请求参数等内容，以便服务端对请求进行处理。

2. 使用 uniapp 发送带请求头的请求

uniapp 是一个基于 Vue.js 的跨平台框架，可以方便地开发多端应用，支持发送 Ajax 请求。下面就来介绍如何使用 uniapp 发送带请求头的请求。

2.1 在 App.vue 中设置全局请求头

在 App.vue 中添加全局请求头可以方便地在应用的任何地方使用。可以在 App.vue 的 created 钩子中使用 uni.setStorageSync 方法设置全局请求头，代码如下：

export default {

  created() {
    uni.setStorageSync('Authorization', 'Bearer xxxxxxxxx')
  }
}

其中，setStorageSync 方法用于设置同步本地缓存，Authorization 是请求头的名称，Bearer xxxxxxxxx 是请求头的值。此处为了演示方便，我们模拟了一个 token，实际应用中需要根据项目需求进行修改。

2.2 在请求中添加请求头

在发送请求时，可以通过配置 headers 参数添加请求头。例如，我们可以在发送 GET 请求时带上刚才设置的请求头，代码如下：

uni.request({

  url: 'https://example.com/api',
  method: 'GET',
  header: {
    Authorization: uni.getStorageSync('Authorization')
  },
  success(res) {
    console.log(res.data)
  },
  fail(err) {
    console.log(err)
  }
})

其中，headers 参数是一个对象，可以添加多个请求头。在此处我们只添加了一个 Authorization 请求头，其值为刚才设置的 token。

如果要发送 POST 请求，同样可以添加 headers 参数，例如：

uni.request({

  url: 'https://example.com/api',
  method: 'POST',
  header: {
    'Content-Type': 'application/json',
    Authorization: uni.getStorageSync('Authorization')
  },
  data: {
    name: 'example',
    age: 18
  },
  success(res) {
    console.log(res.data)
  },
  fail(err) {
    console.log(err)
  }
})

在 POST 请求中，除了设置 Authorization 请求头之外，还需要设置 Content-Type 请求头，参数值为 application/json 表示发送的数据格式为 JSON。

3. 总结

从上面的示例代码可以看出，使用 uniapp 发送带请求头的请求非常简单，只需要在发送请求时添加 headers 参数即可。在实际开发过程中，我们通常需要设置 token 请求头来进行身份验证，或者设置其他自定义的请求头来进行数据传递。

总之，了解如何设置请求头是每个前端开发人员必备的技能之一，能够帮助我们更好地进行开发。