如何在UniApp中每次请求都携带Cookie

UniApp中每次请求都携带Cookie

如何确保每次请求都携带Cookie是我们开发中很常见的需求。UniApp在这方面也有自己的处理方式，下面我们来一一探讨：

1. 使用uni.request封装请求

在UniApp中，我们可以使用uni.request来进行网络请求。它与原生的wx.request类似，只不过做了一些兼容处理和封装，使得在UniApp中更加方便使用。我们可以在公共的请求函数中对uni.request进行二次封装，以实现每次请求都携带Cookie的需求。

我们可以将请求函数封装成一个公共的JS文件，命名为request.js。首先，在该文件中定义一个常量cookie，用于存储Cookie值：

let cookie = '';

然后，我们定义一个request函数，该函数接收传入的参数及requestConfig，用于进行更细致的配置（例如请求方式、请求头等）：

const request = (url, params, requestConfig) => {
  const reqConfig = requestConfig || {}
  const contentType = reqConfig.contentType || 'application/json';
  return new Promise((resolve, reject) => {
    uni.request({
      url,
      method: reqConfig.method || 'GET',
      data: params,
      header: {
        'Content-Type': contentType,
        'Cookie': cookie // 携带Cookie
      },
      success: (res) => {
        const data = res.data;
        if (data.code === 0) {
          resolve(data)
        } else {
          reject(data.msg)
        }
      },
      fail: (err) => {
        reject(err)
      }
    });
  });
};

在该函数中，我们在请求头中添加了Cookie键值对，将存储在cookie常量中的Cookie值一并带上。需要注意的是，如果每次请求都需要携带Cookie的话，那么我们需要确保cookie变量在请求之前就已经被赋值了。

最后，我们还需要编写一个setCookie函数，用来设置cookie变量的值：

const setCookie = val => {
  cookie = `SESSION=${val}`;
};

需要注意：这种方式并不适用于uni.uploadFile方法，在使用上传文件功能时，需要进行特别的处理。

2. 在请求拦截器中处理Cookie

UniApp中提供了请求拦截器，我们可以在请求拦截器里面对请求进行处理。在main.js文件中，我们可以定义一个请求拦截器，该函数会在每次请求发送之前被调用。

uni.interceptors.request.use(config => {
  config.header.Cookie = 'xxx'; // 添加Cookie
  return config
}, error => {
  return Promise.reject(error)
});

在该函数中，我们可以通过config.header.Cookie的方式添加Cookie。需要注意的是，该方法仅适用于ajax请求，对于上传文件、下载文件等情况需要进行特别处理。

3. 在请求头里添加Cookie

如果我们已经有了Cookie的值，那么我们可以直接将其添加到请求头里。对于uni.request方法，我们可以在请求头中添加Cookie键值对：

const request = (url, params) => {
  const header = {
    'Content-Type': 'application/json;charset=UTF-8',
    'Cookie': 'Session=xxxxx'
  };
  return new Promise((resolve, reject) => {
    uni.request({
      url,
      method: 'POST',
      data: params,
      header,
      success: (res) => {
        const data = res.data;
        if (data.code === 0) {
          resolve(data)
        } else {
          reject(data.msg)
        }
      },
      fail: (err) => {
        reject(err)
      }
    });
  })
};

在请求头中添加Cookie键值对，将存储在Cookie变量中的Cookie值带上即可。

总结

以上就是UniApp中每次请求都携带Cookie的三种实现方式。根据实际开发的需求，我们可以选择适合自己的方式。需要注意的是，对于上传文件、下载文件等操作，我们需要进行特别的处理。