更新记录

1.0.1（2024-04-23）

• 增加了Gitee仓库地址
• 测试接口更新为自己用 uniCloud 写的测试接口，原来的聚合数据的接口不能用了
• 配置了 h5 devServer，解决 h5 请求时的跨域问题
• 更新了示例工程，可以直接运行示例工程

1.0.0（2024-04-09）

第一次发布

平台兼容性

hi-request

对 uni.request() 扩展封装 可以下载示例项目查看更加详细的使用方法

仓库地址

Gitee

开始

实例化

// config: 单个实例的基础配置项,会和默认配置项进行合并成
const hr = new HiRequest(config);

// 也可以通过下面的方法设置实例的基础配置项
hr.setConfig(config);

请求接口

// 第一种方式: 选项式回调函数方式
// 第1个参数: 请求地址
// 第2个参数: 单次请求的配置
// 注意: 如果控制台报错 Uncaught (in promise),这是因为 promise 没有 catch 的原因,使用 try...catch.. 或增加 .catch() 即刻解决此报错
const promise = hr.get("url", {
    // ... 其他配置项

    // 只有 HTTP 和返回的数据状态码正常才会调用此函数
    // data: 接口返回的数据
    // config: 本次请求的配置项
    success: (data, config) => {
        console.log("请求成功 →", data, config);
    },

    // 如果 HTTP 或返回数据的状态码有一个不正常就会调用此回调函数
    // response: HTTP Response 对象
    // config: 本次请求的配置项
    error: (response, config) => {
        console.log("请求错误 →", response, config);
    },

    // 请求失败,包括: 网络不通 | 请求被强行中断 | 请求超时 | 找不到域名 | ssl握手失败等会调用此函数
    // 1. 通过 requestTask.abort() 中止的请求, error = {errMsg: 'request:fail abort'}
    // 2. 网络离线时, error = {errMsg: 'request:fail'}
    // 3. 其他情况 error 可能会是任何类型的数据
    // config: 本次请求的配置项
    fail: (error, config) => {
        console.log("请求失败 →", response, config);
    },

    // 请求完成,不管成功或失败都会调用此函数
    // response: HTTP Response 对象
    // config: 本次请求的配置项
    complete: (response, config) => {
        console.log("请求完成 →", response, config);
    }
});

// 第二种方式: then/catch 调用方式
// 第1个参数: 请求地址
// 第2个参数: 单次请求的配置
const promise = hr.post("url", {
    // ... 其他配置项

    // 请求参数
    data: {
        username: "ChenWanzhao"
    }
})
    // 只有 HTTP 和返回的数据状态码正常才会调用此函数
    // data: 接口返回的数据
    // config: 本次请求的配置项
    .then((data, config) => {
        console.log("请求成功 →", data, config);
    })

    // 除去上方的情况外,都会走 catch()
    // response: HTTP Response 对象
    // config: 本次请求的配置项
    .catch((response, config) => {
        console.log("请求错误或失败 →", response, config);
    });

// 第三种方式: 即使用选项式回调函数又使用 then/catch
// 第1个参数: 请求地址
// 第2个参数: 单次请求的配置
const promise = hr.get("url", {
    // ... 其他配置项

    // 选项式回调函数
    success: (data, config) => {},
    error: (response, config) => {},
    fail: (error, config) => {},
    complete: (response, config) => {}
})
    .then((data, config) => {})
    .catch((response, config) => {})

// 中断请求
// requestTask 对象默认被挂载到了请求函数的返回值 promise 上
// 可以通过 promise.requestTask.abort() 中断请求
// 如:
const promise = hr.get("url", config);
promise.requestTask.abort();

// 注意: 因为 Promise 的 then/catch/finally 会返回一个新的 Promise,如果通过链式调用相关函数会导致 promise.requestTask 为 undefined
// 比如;
const promise = hr.get("url", config).then().catch().finally();
promise.requestTask.abort(); // 此时会报错

// 这时,可以将链式调用拆分出来,具体如下:
const promise = hr.get("url", config);
promise.then().catch().finally(); // 这样不会影响 promise
promise.requestTask.abort(); // 中断请求

配置项说明

uni.request() 自带配置

uni.request() 官方文档地址

重写 uni.request() 的回调函数

扩展配置 - 基础配置

扩展配置 - 和提示相关的配置