http请求作为数据交互的重要方式，是软件应用必备核心技术之一，它不仅实现了客户端与服务器之间的高效通信，还为现代软件架构提供了强大的灵活性和可扩展性

使用uniapp进行开发时，我们不可避免的会使用到多种http请求，本文展示了如何封装一个通用的请求器，让代码复用率更高，让项目结构更加清晰，以便后续的维护和扩展。

第一步 创建 utils/request.js 文件，用于放请求器代码

第二步 封装请求器

const BASE_URL = "https://域名:端口";

/**
 * 基础请求方法（GET 不转 params，直接传 data）
 * @param {string} method 请求方法
 * @param {string} url    接口路径
 * @param {object} data   请求参数（GET 也直接传 data，不转 params）
 * @param {object} config 自定义配置
 */
const request = async (method, url, data = {}, config = {}) => {
	try {
		const response = await uni.request({
			url: BASE_URL + url,
			method: method.toUpperCase(),
			data: data, 
			header: {
				'Content-Type': config.contentType || 'application/json',
				'Authorization': uni.getStorageSync('token') || '',
				...config.headers
			},
			timeout: config.timeout || 10000
		});
		return response
	} catch (err) {
		uni.showToast({
			title: '网络请求失败',
			icon: 'none'
		});
		throw err;
	} finally {}
};
export const http = {
	get: (url, data, config) => request('GET', url, data, config), 
	post: (url, data, config) => request('POST', url, data, config),
	put: (url, data, config) => request('PUT', url, data, config),
	delete: (url, data, config) => request('DELETE', url, data, config)
};

请求函数中接收http请求路径，请求参数，请求头等信息，动态地进行http请求，最后通过一个http对象导出4种请求方法，如果有更多需要，可以继续往后添加方法

第二步 全局导入方法

在main.js中导入方法

// #ifndef VUE3
import Vue from 'vue'
import App from './App'
Vue.config.productionTip = false
App.mpType = 'app'

const app = new Vue({
    ...App
})
app.$mount()
// #endif

// #ifdef VUE3
import { createSSRApp } from 'vue'
import App from './App.vue'
import { http } from './utils/request.js'
export function createApp() {
  const app = createSSRApp(App)
  app.config.globalProperties.$api = http;
  return {
    app
  }
}
// #endif

注意：这里分成两个作用域，如果是vue2环境，则在上面导入文件，如果是vue3环境，则导入下面的作用域，否则就会出现导入request.js不成功导入不成功的情况。然后导入文件之后，通过app.config.globalProperties.$api = http，将http对象挂载到全局属性中，这样就可以通过this.$api访问

第四步 使用

let res = await this.$api.post(url, data, config);

通过this.$api进行异步http请求，根据需要调用不同的方法和参数

以上就是如何封装http请求器的方法，每个人在使用或撰写代码的时候都会有不同情况出现，根据具体情况调整代码即可