Flutter 三方库 http_mock_adapter — 赋能鸿蒙应用开发的高效率网络接口 Mock 与自动化测试注入引擎(适配鸿蒙 HarmonyOS Next ohos)

Flutter 三方库 http_mock_adapter — 赋能鸿蒙应用开发的高效率网络接口 Mock 与自动化测试注入引擎(适配鸿蒙 HarmonyOS Next ohos)

欢迎加入开源鸿蒙跨平台社区:https://openharmonycrossplatform.ZEEKLOG.net

Flutter for OpenHarmony:Flutter 三方库 http_mock_adapter — 赋能鸿蒙应用开发的高效率网络接口 Mock 与自动化测试注入引擎(适配鸿蒙 HarmonyOS Next ohos)

请添加图片描述

前言

在华为鸿蒙(OpenHarmony)生态的应用开发中,前后端并行开发(Parallel Development)是常态。当后端 API 还在设计或局域网联调环境不稳定时,如果客户端开发者只能干等着真实数据,开发进度将会大打折扣。此外,在进行健壮性测试(如模拟服务器 500 错误、超时、返回脏数据)时,真实服务器往往难以配合。

http_mock_adapter 是一款专为 Dio 打造的高性能 Mock 拦截器。它能拦截应用发出的任何网络请求,并根据预设规则(Endpoint/Post Data/Headers)即时返回自定义的模拟响应。在鸿蒙跨平台应用的开发与自动化测试中,它让开发者能够摆脱对物理网络的依赖,构建出 100% 确定性的测试闭环。在构建鸿蒙平台的交付级测试套件、离线演示 Demo 或快速原型开发时,它是不可或缺的效率利器。

一、原理展示 / 概念介绍

1.1 基础概念

本库实现了在应用内部对网络协议栈的“中间人注入”。

鸿蒙自动化测试沙箱

匹配命中

未匹配

鸿蒙 App 业务代码

Dio 网络框架

http_mock_adapter 拦截器

返回虚拟 JSON/状态码

可选转发给真实网络

隔离物理网络 IO

1.2 核心要点解析

  • 无感注入:只需为 Dio 实例添加一个 DioAdapter,业务层代码无需做任何修改(如切换 URL)。
  • 丰富的匹配算子:支持根据路径通配符、请求体(Request Body)内容、特定 Header 甚至 Query 参数进行精准拦截。
  • 状态全覆盖:支持模拟 200 (Success), 401 (Unauthorized), 404 (Not Found), 500 (Internal Server Error) 等各种网络状态及其响应时延。

二、核心 API / 组件详解

2.1 依赖引入

在鸿蒙工程的 pubspec.yaml 中添加以下开发辅助依赖:

dependencies:dio: ^5.0.0 dev_dependencies:http_mock_adapter: ^0.5.0 # 建议参考最新主流版本

2.2 初始化 Mock 适配器

在鸿蒙端初始化一个用于测试的模块:

import'package:dio/dio.dart';import'package:http_mock_adapter/http_mock_adapter.dart';voidsetupHarmonyMock(){final dio =Dio();// ✅ 推荐做法:创建 DioAdapter 并关联 Dio 实例final dioAdapter =DioAdapter(dio: dio);// 1. 定义拦截逻辑 dioAdapter.onGet('/api/harmony/profile',(server)=> server.reply(200,{'name':'鸿蒙开发者','level':99}), data:null, queryParameters:{}, headers:{},);}
在这里插入图片描述

2.3 模拟复杂的异步错误

💡 技巧:在鸿蒙端验证应用的容错率。

dioAdapter.onPost('/api/login',(server)=> server.throws(403,DioException(requestOptions:RequestOptions(path:'/api/login'), type:DioExceptionType.badResponse),),);
在这里插入图片描述

三、场景示例

3.1 场景一:鸿蒙端 UI 的“冒烟测试”

通过 Mock 不同长度的 JSON 列表,验证鸿蒙端列表视图在“数据过多”时的流畅度,以及在“数据为空”时的空状态占位图展示。

在这里插入图片描述

3.2 场景二:复杂支付流程的本地闭环

模拟支付成功、余额不足、系统扣费中等多种后端状态,让鸿蒙客户端能根据 Mock 返回跳转不同的业务结果页,提高测试覆盖率。

在这里插入图片描述

四、OpenHarmony 平台适配挑战

4.1 Mock 代码的打包隔离

Mock 逻辑不应该被打入正式发布的鸿蒙 HAP 包中。

适配策略建议

  1. 统一工厂注入:建议在项目中建立一个 HttpFactory。根据当前的编译宏(如 kDebugMode)或自定义的鸿蒙编译参数,决定是否装载 http_mock_adapter
  2. 本地测试目录隔离:将 Mock JSON 数据文件存放在鸿蒙测试资源的独立目录下,避免污染生产环境的包体大小。

五、综合实战示例代码

以下是一个演示如何在鸿蒙端实现的“接口联调模拟实验室”组件:

import'package:flutter/material.dart';import'package:dio/dio.dart';import'package:http_mock_adapter/http_mock_adapter.dart';classHttpMockLabPageextendsStatefulWidget{constHttpMockLabPage({super.key});@overrideState<HttpMockLabPage>createState()=>_HttpMockLabPageState();}class _HttpMockLabPageState extendsState<HttpMockLabPage>{final _dio =Dio();String _response ="点击按钮发起请求";@overridevoidinitState(){super.initState();_initMock();}void_initMock(){// 💡 实战技巧:拦截器注入final adapter =DioAdapter(dio: _dio); adapter.onGet('/harmony_data',(s)=> s.reply(200,{'msg':'来自模拟器的鸿蒙专属数据'}));}void_fetchData()async{try{final res =await _dio.get('/harmony_data');setState(()=> _response ="🎉 收到 Mock 数据:\n${res.data}");}catch(e){setState(()=> _response ="❌ 请求失败");}}@overrideWidgetbuild(BuildContext context){returnScaffold( appBar:AppBar(title:constText('网络 Mock 模拟实验室')), body:Center( child:Column( mainAxisAlignment:MainAxisAlignment.center, children:[constIcon(Icons.webhook_outlined, size:80, color:Colors.teal),constSizedBox(height:30),Container( padding:constEdgeInsets.all(16), margin:constEdgeInsets.symmetric(horizontal:20), decoration:BoxDecoration(color:Colors.teal[50], borderRadius:BorderRadius.circular(12)), child:Text(_response, textAlign:TextAlign.center),),constSizedBox(height:50),ElevatedButton(onPressed: _fetchData, child:constText('发起模拟接口调用')),],),),);}}
在这里插入图片描述

六、总结

http_mock_adapter 是保证 OpenHarmony 高质量交付的“消音器”。它消除了网络的不确定性噪点,让开发者能专注于业务逻辑与 UI 交互的打磨。

核心建议

  1. JSON 本地化:对于超大的响应体,建议配合 rootBundle.loadString 读取本地 JSON 文件再传入 reply,保持 Mock 逻辑的代码整洁。
  2. 模拟延迟:通过 delay 参数模拟真实环境下的 200ms~2s 延迟,验证鸿蒙端 Loading 动画的视觉衔接。
  3. 保持同步:前端 Mock 的结构定义应与后端 Swagger/OpenAPI 文档保持强一致,防止“Mock 是好的,一上线全是报错”。

Read more

鸿蒙APP开发从入门到精通:鸿蒙电商购物车全栈项目——订单管理、支付管理、AI原生

鸿蒙APP开发从入门到精通:鸿蒙电商购物车全栈项目——订单管理、支付管理、AI原生

《鸿蒙APP开发从入门到精通》第14篇:鸿蒙电商购物车全栈项目——订单管理、支付管理、AI原生 📱💳🤖 内容承接与核心价值 这是《鸿蒙APP开发从入门到精通》的第14篇——订单管理、支付管理、AI原生篇,100%承接第13篇的「用户管理、商品列表、购物车」项目架构,完成鸿蒙电商购物车全栈项目的核心业务功能实现。 学习目标: * 掌握订单管理的设计与实现; * 实现创建订单、查看订单、取消订单; * 理解支付管理的设计与实现; * 实现微信支付、支付宝支付; * 掌握AI原生的设计与实现; * 实现AI搜索、AI推荐、AI客服; * 优化订单管理、支付管理、AI原生的用户体验(响应速度、数据安全、用户反馈)。 学习重点: * 鸿蒙APP订单管理的开发流程; * 订单管理的分类与使用场景; * 支付管理的设计与实现; * AI原生的设计与实现。 一、 订单管理基础 🎯 1.1 订单管理定义 订单管理是指对应用的订单进行管理,主要包括以下方面:

By Ne0inhk
Flutter for OpenHarmony: Flutter 三方库 shamsi_date 助力鸿蒙应用精准适配波斯历法(中东出海必备)

Flutter for OpenHarmony: Flutter 三方库 shamsi_date 助力鸿蒙应用精准适配波斯历法(中东出海必备)

欢迎加入开源鸿蒙跨平台社区:https://openharmonycrossplatform.ZEEKLOG.net 前言 在进行 OpenHarmony 的全球化(Internationalization)应用开发时,进军中东市场(尤其是波斯语地区)是一项充满潜力的战略。但在这些地区,用户习惯使用的并非公历(Gregorian),而是 波斯历(Shamsi/Jalali)。 1. 如何将用户的生日从公历转换成波斯历? 2. 鸿蒙应用的时间轴、日历选择器如何呈现 Jalali 格式? 3. 业务系统中的合同到期日如何按波斯历进行逻辑计算? shamsi_date 是 Dart 生态中处理波斯历法的权威库。它提供了极其简单的转换 API,是你开发鸿蒙出海应用、打入中东市场的关键技术补丁。 一、历法转换算法模型 shamsi_date 实现了公历与波斯历之间的双向精准映射。 Conversion Conversion 公历 (2024-02-20) 波斯历 (1402-12-01)

By Ne0inhk
Ubuntu 24.04 在线安装 Redis 8.x 完整教程

Ubuntu 24.04 在线安装 Redis 8.x 完整教程

✅ Ubuntu 24.04 在线安装 Redis 8.x 完整教程 ✅ 教程说明 ✅ 适配 Ubuntu 24.04 LTS 系统,全程在线安装,最终稳定得到 Redis 8.x 版本(如你的 8.4.0) ✅ 解决版本混淆/安装失败问题,所有命令可直接复制执行,新手友好 ✅ 包含「安装+验证+远程访问配置+防火墙放行+运维命令」全套流程,无额外冗余步骤 📌 一、前置环境准备(更新系统+安装依赖) 先更新系统包索引,安装添加官方源必需的工具,避免后续步骤依赖报错,执行一次即可: # 更新系统软件源+升级已安装包,-y 自动确认所有操作sudoapt update

By Ne0inhk
【AI作画】第2章comfy ui的一般输入节点,文本框的类型和输入形式

【AI作画】第2章comfy ui的一般输入节点,文本框的类型和输入形式

目录 CLIP文本编码器 条件输出和文本输出 转换某一变量为输入 展示作品集 在默认的工作流之外,我们如何自己添加节点呢? 一般我们用到的sampler采样器在“鼠标右键——添加节点——采样——K采样器”  我们用的clip文本编码器在“鼠标右键——添加节点——条件——CLIP文本编码器” 一般我们使用的是默认的CLIP文本编码器 CLIP文本编码器 在comfy ui里面,文本输入有很多不同的类型。我们在默认的文本编码器里只能输入英文。如果我们想输入中文,就要打开翻译器,有条件和文本两种类型。 条件输入在“鼠标右键——添加节点——Alek节点——条件——CLIP文本编码器(翻译)” 文本输入在“鼠标右键——添加节点——Alek节点——文本——翻译文本(翻译)” 那么两者有什么不同呢?我们反别来看一下。 我们分别添加CLIP文本编码器(Argos翻译),Clip文本编码器(翻译高级),翻译文本(Argos翻译),翻译文本(高级)

By Ne0inhk