Bagaimana untuk menetapkan pengepala awam dalam uniapp requrst (dua kaedah)

Semasa proses pembangunan, kami sering menggunakan UniApp untuk membina aplikasi merentas platform. UniApp ialah rangka kerja sumber terbuka berdasarkan Vue.js Ia boleh membungkus teras Vue.js dan beberapa keupayaan merentas platform bersama-sama, memberikan pengalaman pembangunan yang lengkap. Semasa proses pembangunan, kami selalunya perlu menghantar permintaan rangkaian untuk mendapatkan data Pada masa ini, kami perlu menetapkan beberapa parameter pengepala awam untuk memastikan ketepatan dan keberkesanan permintaan.

Dalam UniApp, kami boleh menggunakan uni.request yang dirangkumkan untuk menghantar permintaan rangkaian. uni.request mempunyai prestasi merentas platform yang baik Ia merangkumi XMLHttpRequest asli dan sambungan axios asli dalam UniApp dan boleh digunakan untuk memulakan permintaan HTTP/HTTPS. Untuk menetapkan parameter pengepala awam, terdapat dua kaedah biasa berikut.

Kaedah 1: Tetapkan

// main.js
Vue.prototype.$http = function (url, data, method) {
  let token = uni.getStorageSync('token');
  let header = {
    'Authorization': token,
    'Content-type': 'application/json'
  };
  return uni.request({
    url,
    data,
    method,
    header
  })
}

// 调用
this.$http('/api/user', { id: 123, name: 'Tom' }, 'GET').then(res => {
  console.log(res)
})

dalam pilihan permintaan Antaranya, kaedah $ttp ditakrifkan dalam main.js dan parameter pengepala awam ditetapkan dalam pilihan. . Apabila memanggil, Hanya masukkan parameter tertentu.

Kaedah 2: Tetapan bersatu melalui pemintas

// request.js
export function request(opts) {
  let token = uni.getStorageSync('token');
  let header = {
    'Authorization': token,
    'Content-type': 'application/json'
  };
  const interceptor = {
    request: (opts) => {
      opts.header = header;
      return opts;
    },
    response: (res) => {
      const { statusCode, data } = res;
      if (statusCode === 200) {
        return data;
      } else {
        uni.showToast({
          title: '请求失败',
          icon: 'none'
        })
        return Promise.reject(res);
      }
    }
  }
  uni.addInterceptor(interceptor);
  return uni.request(opts).finally(() => {
    uni.removeInterceptor(interceptor);
  })
}

// 调用
request({
  url: '/api/user?id=123&name=Tom',
  method: 'GET'
}).then(res => {
  console.log(res);
})

Dalam kaedah ini, kami mentakrifkan fungsi permintaan, di mana permintaan dipintas melalui pemintas dan parameter pengepala awam ditetapkan memulakan permintaan melalui uni.request. Apabila memanggil permintaan, anda hanya perlu memasukkan parameter tertentu.

Ringkasnya, kami dapat melihat bahawa tidak sukar untuk menetapkan parameter pengepala awam dalam UniApp Anda hanya perlu menetapkannya dalam pilihan uni.request, atau anda juga boleh menetapkannya secara seragam melalui pemintas. Ini boleh meningkatkan kebolehgunaan semula kod dan mengurangkan penulisan kod berulang, yang merupakan pilihan yang baik.

Atas ialah kandungan terperinci Bagaimana untuk menetapkan pengepala awam dalam uniapp requrst (dua kaedah). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!