HarmonyOS ：面向对象式网络请求库，我发布的第一个鸿蒙三方库

引言

为处理大量重复的代码逻辑，基于 http 封装的一套面向对象式的网络请求库，支持将请求返回的数据直接转换成指定类型的对象。本篇记录封装前后的使用对比，以及在鸿蒙ohpm发布三方库的操作记录。

官网的 http 案例

如下代码，是官方给出的请求案例：

// 引入包名
import http from '@ohos.net.http';

// 每一个httpRequest对应一个HTTP请求任务，不可复用
let httpRequest = http.createHttp();
// 用于订阅HTTP响应头，此接口会比request请求先返回。可以根据业务需要订阅此消息
// 从API 8开始，使用on('headersReceive', Callback)替代on('headerReceive', AsyncCallback)。 8+
httpRequest.on('headersReceive', (header) => {
    console.info('header: ' + JSON.stringify(header));
});
httpRequest.request(
    // 填写HTTP请求的URL地址，可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定
    "EXAMPLE_URL",
    {
        method: http.RequestMethod.POST, // 可选，默认为http.RequestMethod.GET
        // 开发者根据自身业务需要添加header字段
        header: {
            'Content-Type': 'application/json'
        },
        // 当使用POST请求时此字段用于传递内容
        extraData: {
            "data": "data to send",
        },
        expectDataType: http.HttpDataType.STRING, // 可选，指定返回数据的类型
        usingCache: true, // 可选，默认为true
        priority: 1, // 可选，默认为1
        connectTimeout: 60000, // 可选，默认为60000ms
        readTimeout: 60000, // 可选，默认为60000ms
        usingProtocol: http.HttpProtocol.HTTP1_1, // 可选，协议类型默认值由系统自动指定
    }, (err, data) => {
        if (!err) {
            // data.result为HTTP响应内容，可根据业务需要进行解析
            console.info('Result:' + JSON.stringify(data.result));
            console.info('code:' + JSON.stringify(data.responseCode));
            // data.header为HTTP响应头，可根据业务需要进行解析
            console.info('header:' + JSON.stringify(data.header));
            console.info('cookies:' + JSON.stringify(data.cookies)); // 8+
            // 取消订阅HTTP响应头事件
            httpRequest.off('headersReceive');
            // 当该请求使用完毕时，调用destroy方法主动销毁
            httpRequest.destroy();
        } else {
            console.info('error:' + JSON.stringify(err));
            // 取消订阅HTTP响应头事件
            httpRequest.off('headersReceive');
            // 当该请求使用完毕时，调用destroy方法主动销毁。
            httpRequest.destroy();
        }
    }
);

可以看到，上述请求的代码量庞大，在实际开发中，我们需要将公共的部分进行抽取封装，将可变的参数暴露到上层进行动态填充或者重写，达到简化请求代码的目标。

fast_http，一个简易面向对象式的网络库

1. 安装

ohpm install @rex/fast_https_request

2. 导入引用

import { http } from '@kit.NetworkKit'
import { HttpRequest } from '@rex/fast_https_request/Index';

3. 定义通用数据模型

首先，我们定义一个常规返回数据模型，比如这样的JSON结构：

{
    'code': 100
    'data': {
        // 里面是具体的业务模型
    }
}

对应的模型我们定义如下：

/// 接口返回结果通用模型, 泛型T为具体的业务模型对象
interface CommonResponseModel<T> {
  code: number
  data: T
}

4. 定义业务数据模型

定义具体的业务数据模型，也就是上述 CommponResponseModel 里的 T 泛型，例如这样

/// 具体的业务模型
class ResponseModel {
  artistsname: string
  name: string
  picurl: string
  url: string

  constructor(
    artistsname: string,
    name: string, picurl:
    string, url: string
  ) {
    this.artistsname = artistsname
    this.name = name
    this.picurl = picurl
    this.url = url
  }
}

5. 创建网络请求

声明网络请求，指定将返回结果直接转换成上面的业务模型，我们这么做：

如果是GET请求，这么写

// HttpRequest<T> 将response的返回数据直接转成指定的泛型
class GetRequest extends HttpRequest<CommonResponseModel<ResponseModel>> {
// 重写请求类型，默认是 POST
public method: http.RequestMethod = http.RequestMethod.GET;
// 重写域名domain
public domain: string = 'https://api.uomg.com';
// 重写请求路径
public path: string = '/api/rand.music';
// GET 传参赋值
public getQuery: Record<string, string> = {
  'sort': '热歌榜',
  'format': 'json',
}
}

如果是POST请求，这么写

class PostRequest extends HttpRequest<CommonResponseModel<ResponseModel>> {
  // 重写请求类型，默认是 POST
  public method: http.RequestMethod = http.RequestMethod.POST;
  // 重写域名domain
  public domain: string = 'https://api.uomg.com';
  // 重写请求路径
  public path: string = '/api/comments.163';
  // POST 传参赋值
  public postBody: Record<string, string> = {
    'format': 'json',
  }
}

6. 发送网络请求

try {
      const response : CommonResponseModel<ResponseModel> = await new GetRequest().execute()
      let responseTxt = JSON.stringify(response);
      console.log(`response == ${responseTxt}`)
    } catch (e) {
      let errorMessage = JSON.stringify(e);
      console.log(`error == ${errorMessage}`)
    }

使用上面声明的请求 new GetRequest().excute() 或者 new PostRequest().excute() 获取到的结果为 CommonResponseModel<ResponseModel> 对象

let data : ResponseModel = await new GetRequest().execute().data

这样就获取到了我们的业务模型对象

7. 如何打印网络日志

在继承 HttpRequest 时选择重写内部三方方法，可用于分别打印 request、response、httpError

class PostRequest extends HttpRequest<T> {
  ....省略具体的请求
  
  // 重写该方法打印 request
  protected onRequestChain(request: BaseRequestOption): void {
    console.log(`fast_http_request >>> url : ${this.requestUrl()}`)
    if (request.postBody != null){
      console.log(`fast_http_request >>> POST Parmas : ${JSON.stringify(request.postBody)}`)
    }
  }

  // 重写该方法打印 response
  protected onResponseChain(response: HttpResponse): void {
    console.log(`fast_http_request >>> response : ${JSON.stringify(response)}`)
  }

  // 重写该方法打印 http error
  protected onErrorChain(error: Error): void {
    console.log(`fast_http_request >>> error : ${JSON.stringify(error)}`)
  }
}

8. 如何在工程中，统一管理，进行复用

我们可以按照域名定义一个通用的 CommonRequest，例如：

class CommonRequest<T> extends HttpRequest<CommonResponseModel<T>> {
  // 重写域名domain
  public domain: string = 'https://api.uomg.com';
  
  ///这里自己把log加上，统一打印请求日志
}

遇到具体的业务时

假设我们业务接口返回的的数据，定义模型名称为 BusinessModel

class BusinessModel {
    /// 具体的业务字段
}

所有的业务请求，我们可以通过继承 CommonRequest，创建具体的业务请求，指定泛型即可

class BusinessRequest extends CommonRequest<BusinessModel> {
    // Model 是请求参数，这里我定义为 Record 类型，按照自己的需要也可以定义为其他
    constructor(requestParams: Record<string, Object>){
        this.postBody = requestParams;
    }
    
    // 重写请求路径
  public path: string = '具体的url';
}

如上便完成了一个业务请求的封装, 通过 new 即可使用

let requestParams = {
    'pageIndex': '1',
    'keywords': 'rex',
}

let request = new BusinessRequest(requestParams);

request.excute().then((data)=>{
    // 这里获取的 data 类型为 CommonResponseModel<BusinessModel>
})

聊一下怎么发布到鸿蒙三方库市场

1. 创建组织

先到 OpenHarmony三方库中心仓上面注册个账号，到 个人中心 ->组织管理 中，申请一个组织。这个组织名字以后要用到，因为普通三方作者，是不能使用 ohos 前缀的。

比如我注册的是组织名为 rex，组件为 fast_https_request。那么组件最终的名字就是 @rex/fast_https_request

最后用户可以通过 ohpm install @candies/fast_https_request，来安装使用组件。

2. 创建项目（选择静态库）

创建项目，选择静态库（Static Libray）

对应的 oh_package.json5 文件里配置的是组件的相关信息

其他字段，请查看 OpenHarmony三方库中心仓

3. 发布

在准备发布之前，请先阅读贡献三方库里面内容。

这里简单说一下组件内需要包含的必要的文件：

1. 配置 oh-package.json5 文件，是对当前三方库的元数据描述
1. 创建 README 文件，为了帮助其他人在 ohpm 上找到您的三方库
1. 创建 CHANGELOG 文件，描述版本及更新内容
1. 添加 LICENSE 文件，开源协议

然后将你的组件编译生成静态包 .har

生成完毕后执行命令行进行发布：

ohpm publish xxx.har

(xxx.har 为上传包的本地路径)。上传成功之后，你就可以看到你的个人中心里面的消息和状态了，耐心等待审核。

PS：组织名申请会比较耗时

已开源，附上源码及Example

1. fast_http 仓库地址
1. example 及源码
1. 综合 Demo 示例已上传：
GitHub：https://github.com/liyufengrex/HarmonyAtomicService
GitCode：https://gitcode.com/liyufengrex/HarmonyAtomicService

（基于API11开发，支持NEXT及以上版本运行）已上传可供参考，包含如下内容：

1. 静态库+动态包+多模块设计
1. 状态管理
1. 统一路由管理（router+navPathStack）
1. 网络请求、Loading 等工具库封装
1. 自定义组件、自定义弹窗（解耦）
1. EventBus 事件通知
1. 扩展修饰器，实现节流、防抖、权限申请
1. 动态路由（navPathStack + 动态import + WrappedBuilder）
1. UI动态节点操作 (BuilderNode + NodeController)
1. 折叠屏适配示例
1. 折叠屏适配示例
1. 组件工厂示例
1. 组件动态属性设置示例
1. 云函数、云数据库使用示例
1. 华为账号服务示例（快速登陆、快速验证手机号）

HarmonyOS ：面向对象式网络请求库，我发布的第一个鸿蒙三方库

引言

官网的 http 案例

fast_http，一个简易面向对象式的网络库

1. 安装

2. 导入引用

3. 定义通用数据模型

4. 定义业务数据模型

5. 创建网络请求

6. 发送网络请求

7. 如何打印网络日志

8. 如何在工程中，统一管理，进行复用

聊一下怎么发布到鸿蒙三方库市场

1. 创建组织

2. 创建项目（选择静态库）

3. 发布

已开源，附上源码及Example

李小轰

引用和评论

Cashier 社区：一站式POS跨平台功能方案收录

“一起学 HarmonyOS”第二弹来啦！

HarmonyNext-拉起支付宝的三种方式

HarmonyOS NEXT 技术问答冲榜，等你来战！

参与HarmonyOS开发者洞察调研问卷，赢取多重好礼！

#HarmonyOS NEXT#写了一个任何人都会用的语音播报demo

【Winners】"一起学 HarmonyOS"获奖名单来啦～