更新记录

1.0.4（2024-05-13）

fix: 重构本插件，重新实现了拦截器逻辑

1.0.3（2023-12-09）

fix: 新增一些使用示例，更新文档

1.0.2（2023-12-07）

fix: 优化拦截器逻辑，提升用户体验

平台兼容性

ux-request 封装请求

1. 基于uts封装uni.request请求
2. 带拦截器，支持多拦截器
3. 支持uni-app x

使用注意事项

1. 本插件支持Android、Web、Ios端
2. ios端未测试，因为作者没有mac
3. 因为官方的泛型只用于类型推断，无法作为值传递，所以封装本插件时，返回的数据均以UTSJSONObject方式操作，参考UTSJSONObject文档
4. 如果有任何问题，可以在uni-im留言

插件通用配置

使用方式

在项目根目录下创建common/request/index.uts配置拦截器，也可根据自己的项目自行配置
创建拦截器需要注意的是：

1. 定义的拦截器须继承UxInterceptor基类
2. 继承之后，须重写beforeRequest/afterResponseSucc/afterResponseFail三个方法
3. 重写之后，在各个方法里面实现自己的拦截逻辑（如下示例）

// 当前common/request/index.uts
import UxRequest from '@/uni_modules/ux-request/js_sdk/request.uts'
import UxInterceptor from '@/uni_modules/ux-request/js_sdk/interceptors.uts'
import { UxParam, UxRequestOptions, UxResponseFail } from '@/uni_modules/ux-request/js_sdk/types.uts'

// 请求拦截器示例
class HttpInterceptor extends UxInterceptor {
    constructor() {
        super()
    }
    override beforeRequest(config : UxRequestOptions) : UxRequestOptions {
        config.baseURL = 'http://127.0.0.1:8888' // 请填写自己的域名或者本机ip
        config.url = config.baseURL + config.api
        config.timeout = 50000
        config.header['Content-Type'] = 'application/x-www-form-urlencoded'
        return config
    }
    override afterResponseSucc(response : UTSJSONObject) : UTSJSONObject {
        return response
    }
    override afterResponseFail(error : UxResponseFail) : UxResponseFail {
        uni.showToast({
            title: '错误码: ' + error.errCode + ', 错误信息: ' + error.errMsg,
            icon: 'none'
        })
        return error
    }
}
const ins = UxRequest.create()
ins.addInterceptor(new HttpInterceptor())

export default ins

多拦截器说明

本插件支持多拦截器，按照ins.addInterceptor添加的顺序执行

// 本插件支持多拦截器
import UxRequest from '@/uni_modules/ux-request/js_sdk/request.uts'
import UxInterceptor from '@/uni_modules/ux-request/js_sdk/interceptors.uts'
import { UxRequestOptions, UxResponseFail } from '@/uni_modules/ux-request/js_sdk/types.uts'

// 请求拦截器示例
class HttpInterceptor extends UxInterceptor {
    constructor() {
        super()
    }
    override beforeRequest(config : UxRequestOptions) : UxRequestOptions {
        config.baseURL = 'http://127.0.0.1:8888' // 请填写自己的域名或者本机ip
        config.url = config.baseURL + config.api
        config.timeout = 50000
        config.header['Content-Type'] = 'application/x-www-form-urlencoded'
        return config
    }
    override afterResponseSucc(response : UTSJSONObject) : UTSJSONObject {
        // 根据返回的数，在此处做请求状态处理
        // ...
        return response
    }
    override afterResponseFail(error : UxResponseFail) : UxResponseFail {
        uni.showToast({
            title: '错误码: ' + error.errCode + ', 错误信息: ' + error.errMsg,
            icon: 'none'
        })
        return error
    }
}

// 日志拦截器示例
class LogInterceptor extends UxInterceptor {
    constructor() {
        super()
    }
    override beforeRequest(config : UxRequestOptions) : UxRequestOptions {
        console.log('请求前拦截器日志：', config)
        return config
    }
    override afterResponseFail(error : UxResponseFail) : UxResponseFail {
        console.log('请求失败拦截器日志：', error)
        return error
    }
}
const ins = UxRequest.create()
ins.addInterceptor(new HttpInterceptor())
ins.addInterceptor(new LogInterceptor())

export default ins

定义sevices

// 当前common/request/apis/app.uts

import ins from "../index.uts"

export const getList = (): Promise<UTSJSONObject> => {
    return ins.getData('/project/list', null)
}

页面中使用

import { getList } from '@/common/request/apis/app.uts'

getList().then((res: UTSJSONObject)  => {
    console.log(res) // UTSJSONObject
})