muzhiyu-ui 1.0.0

package/utils/request.js

@@ -0,0 +1,265 @@
+/**
+ * MuZhiYu UI 极速网络请求客户端 (Enterprise Uni.Request HTTP Client)
+ * 支持请求/响应拦截器、Token 自动读取注入、HTTP/业务 Code 拦截、401 自动无感登出与防重叠 Loading 计数器
+ * @author muzhiyu
+ * @version 2.0.0
+ */
+
+/**
+ * 默认请求全局配置
+ */
+const defaultConfig = {
+	baseURL: 'https://api.example.com', // 默认 API 接口域名 (项目启动时建议通过 setBaseURL 覆盖)
+	timeout: 10000,                      // 全局请求超时时间 (10000 毫秒)
+	header: {
+		'Content-Type': 'application/json;charset=UTF-8',
+		'Accept': 'application/json'
+	}
+}
+
+/**
+ * 防重叠 Loading 计数器 (防止多个并发请求导致 Loading 框闪烁)
+ */
+let loadingCount = 0
+
+/**
+ * 显示全屏 Loading 遮罩
+ * @param {string} [title='加载中...'] - 加载提示语
+ */
+function showLoading(title = '加载中...') {
+	if (loadingCount === 0) {
+		uni.showLoading({ title, mask: true })
+	}
+	loadingCount++
+}
+
+/**
+ * 隐藏全屏 Loading 遮罩
+ */
+function hideLoading() {
+	if (loadingCount > 0) {
+		loadingCount--
+	}
+	if (loadingCount === 0) {
+		uni.hideLoading()
+	}
+}
+
+/**
+ * HTTP 请求核心客户端类
+ */
+class HttpClient {
+	/**
+	 * 构造函数
+	 * @param {Object} [config={}] - 自定义初始化配置对象
+	 */
+	constructor(config = {}) {
+		this.config = { ...defaultConfig, ...config }
+		this.requestInterceptor = null
+		this.responseInterceptor = null
+		this.interceptors = {
+			request: {
+				use: (fn) => { this.requestInterceptor = fn }
+			},
+			response: {
+				use: (fn) => { this.responseInterceptor = fn }
+			}
+		}
+	}
+
+	/**
+	 * 动态设置请求根域名 (BaseURL)
+	 * @param {string} baseURL - API 接口服务器根地址 (例如: 'https://api.yourdomain.com')
+	 */
+	setBaseURL(baseURL) {
+		this.config.baseURL = baseURL
+	}
+
+	/**
+	 * 核心通用 Request 发起请求函数
+	 * @param {Object} [options={}] - 请求选项
+	 * @param {string} options.url - 接口相对或绝对路径 (例如: '/api/v1/user')
+	 * @param {string} [options.method='GET'] - HTTP 请求方法 (GET, POST, PUT, DELETE 等)
+	 * @param {Object} [options.data] - POST / PUT 请求体 payload
+	 * @param {Object} [options.params] - GET 请求 URL 参数对象
+	 * @param {Object} [options.header] - 自定义请求头
+	 * @param {boolean} [options.showLoading=true] - 是否自动开启全屏 Loading 遮罩
+	 * @param {string} [options.loadingText='加载中...'] - Loading 提示文字
+	 * @returns {Promise<any>} 返回接口成功的 Data 数据对象
+	 */
+	request(options = {}) {
+		return new Promise((resolve, reject) => {
+			// 1. 拼接 URL 与合并请求参数
+			let opts = {
+				url: options.url.startsWith('http') ? options.url : `${this.config.baseURL}${options.url}`,
+				method: (options.method || 'GET').toUpperCase(),
+				data: options.data || options.params || {},
+				header: { ...this.config.header, ...options.header },
+				timeout: options.timeout || this.config.timeout,
+				showLoading: options.showLoading !== false,
+				loadingText: options.loadingText || '加载中...'
+			}
+
+			// 2. 自动读取并注入 Bearer Token
+			const token = uni.getStorageSync('token') || uni.getStorageSync('mu_token')
+			if (token) {
+				opts.header['Authorization'] = `Bearer ${token}`
+			}
+
+			// 3. 执行前置请求拦截器
+			if (typeof this.requestInterceptor === 'function') {
+				opts = this.requestInterceptor(opts) || opts
+			}
+
+			// 4. 显示 Loading 遮罩
+			if (opts.showLoading) {
+				showLoading(opts.loadingText)
+			}
+
+			// 5. 调用 uni.request 原生发起网络通信
+			uni.request({
+				url: opts.url,
+				method: opts.method,
+				data: opts.data,
+				header: opts.header,
+				timeout: opts.timeout,
+				success: (res) => {
+					if (opts.showLoading) hideLoading()
+
+					// 执行后置响应拦截器
+					let responseData = res
+					if (typeof this.responseInterceptor === 'function') {
+						responseData = this.responseInterceptor(res)
+					}
+
+					// HTTP 响应状态码 2XX 判断
+					if (res.statusCode >= 200 && res.statusCode < 300) {
+						const data = res.data
+						// 业务 Code 状态判空与兼容 (支持 code: 0 或 code: 200 或 success: true)
+						if (data && (data.code === 0 || data.code === 200 || data.success === true || data.code === undefined)) {
+							resolve(data)
+						} else {
+							const errorMsg = data.message || data.msg || '业务处理失败'
+							uni.showToast({ title: errorMsg, icon: 'none' })
+							reject(data)
+						}
+					} else if (res.statusCode === 401) {
+						// 401 未授权处理：自动清空 Token 缓存并平滑跳转至登录界面
+						uni.removeStorageSync('token')
+						uni.removeStorageSync('mu_token')
+						uni.showToast({ title: '登录已过期，请重新登录', icon: 'none' })
+						setTimeout(() => {
+							uni.navigateTo({ url: '/pages/common/login/login' })
+						}, 1200)
+						reject({ code: 401, message: '未授权或登录过期' })
+					} else {
+						const errorMsg = `HTTP 错误 ${res.statusCode}`
+						uni.showToast({ title: errorMsg, icon: 'none' })
+						reject(res)
+					}
+				},
+				fail: (err) => {
+					if (opts.showLoading) hideLoading()
+					const errMsg = err.errMsg || '网络开小差了，请稍后再试'
+					uni.showToast({ title: errMsg, icon: 'none' })
+					reject(err)
+				}
+			})
+		})
+	}
+
+	/**
+	 * 快捷 GET 请求方法
+	 * @param {string} url - 请求相对或绝对路径
+	 * @param {Object} [params={}] - GET Query 参数
+	 * @param {Object} [config={}] - 额外配置 (如 header, showLoading)
+	 * @returns {Promise<any>} 响应数据
+	 */
+	get(url, params = {}, config = {}) {
+		return this.request({ url, method: 'GET', params, ...config })
+	}
+
+	/**
+	 * 快捷 POST 请求方法
+	 * @param {string} url - 请求相对或绝对路径
+	 * @param {Object} [data={}] - POST Payload 数据
+	 * @param {Object} [config={}] - 额外配置
+	 * @returns {Promise<any>} 响应数据
+	 */
+	post(url, data = {}, config = {}) {
+		return this.request({ url, method: 'POST', data, ...config })
+	}
+
+	/**
+	 * 快捷 PUT 请求方法
+	 * @param {string} url - 请求相对或绝对路径
+	 * @param {Object} [data={}] - PUT Payload 数据
+	 * @param {Object} [config={}] - 额外配置
+	 * @returns {Promise<any>} 响应数据
+	 */
+	put(url, data = {}, config = {}) {
+		return this.request({ url, method: 'PUT', data, ...config })
+	}
+
+	/**
+	 * 快捷 DELETE 请求方法
+	 * @param {string} url - 请求相对或绝对路径
+	 * @param {Object} [params={}] - DELETE Query 参数
+	 * @param {Object} [config={}] - 额外配置
+	 * @returns {Promise<any>} 响应数据
+	 */
+	delete(url, params = {}, config = {}) {
+		return this.request({ url, method: 'DELETE', params, ...config })
+	}
+
+	/**
+	 * 全平台单文件上传封装 (支持 H5 / 小程序 / App)
+	 * @param {string} url - 文件上传接口相对或绝对路径
+	 * @param {string} filePath - 原生临时文件路径
+	 * @param {string} [name='file'] - 后端接收文件的表单字段 key
+	 * @param {Object} [formData={}] - 随文件一并提交的额外表单键值对
+	 * @param {Object} [config={}] - 额外配置
+	 * @returns {Promise<any>} 响应数据对象
+	 */
+	upload(url, filePath, name = 'file', formData = {}, config = {}) {
+		return new Promise((resolve, reject) => {
+			const fullUrl = url.startsWith('http') ? url : `${this.config.baseURL}${url}`
+			const token = uni.getStorageSync('token') || uni.getStorageSync('mu_token')
+			
+			showLoading(config.loadingText || '文件上传中...')
+
+			uni.uploadFile({
+				url: fullUrl,
+				filePath,
+				name,
+				formData,
+				header: {
+					Authorization: token ? `Bearer ${token}` : '',
+					...config.header
+				},
+				success: (res) => {
+					hideLoading()
+					try {
+						const data = JSON.parse(res.data)
+						uni.showToast({ title: '上传成功', icon: 'success' })
+						resolve(data)
+					} catch (e) {
+						resolve(res.data)
+					}
+				},
+				fail: (err) => {
+					hideLoading()
+					uni.showToast({ title: '上传失败', icon: 'none' })
+					reject(err)
+				}
+			})
+		})
+	}
+}
+
+/**
+ * 实例化并导出默认单例客户端
+ */
+export const http = new HttpClient()
+
+export default http