混合开发 离线包实现

2,288 阅读3分钟

在众多移动客户端的跨平台技术中,我仍然认为基于 H5 的混合开发方案是目前最好的。对于如何提升这种混合开发方案的体验,以及他们的优缺点和使用场景,离线包方案在其中扮演什么角色,我以前的这篇文章有所涉及,大家请移步这里

如何实现这种基于离线包的混合开发方案,上面那篇文章有所简述,下面我以这张图为基础,更详细的说明下实现思路。

离线包实现思路

离线包的使用流程

后管客户端

管理员通过后管界面,输入版本号 1.0.0,上传离线包到后管平台,该离线包是前端项目打包后的 zip 压缩包。此时因为服务器没有其他离线版本,所以没有对应的其他版本补丁包,只有 1.0.0 的全量离线包。

管理员再次通过后管界面,输入版本号 1.0.1,上传离线包到后管平台,此时服务器有 1.0.1 的全量离线包,也生成了对应旧版本 1.0.0 的差量补丁包。

以此类推,如图所示。

移动客户端

app 内置一版 1.0.0 版本的离线包,app 启动后默认使用内置版本,同时向后管平台请求是否有最新版本的离线包,后管平台接到请求后,找到 1.0.0 版本的补丁包下发给 app,app 下载好补丁包后与本地的 1.0.0 版本进行合并操作,合并成功后就生成服务器最新版本的 H5 资源,重启 app 本地的 web server 指向最新资源,再通过 WebView 访问本地 web server 即可。

离线包的实现介绍

离线包前后端具体实现请看这里, 👉OCat-MobilePlatform

离线包后管平台,是一个 SpringBoot Java 项目,实现了基础的用户,角色,权限,菜单功能,Shiro 做权限控制和身份认证。差量更新是文件级的,每次根据上传的全量离线包生成一个完整的资源描述对象,属性包括相对路径,文件名及文件md5 hash值。差量的比较就是基于不同版本的资源描述对象,递归比对,查找出所有变更的资源,生成对应旧版本的补丁包。目前项目中离线包的默认实现的是基于 nginx 的,如果用户要自定义离线包的存储(云存储)可以继承 AbstractPublishPackage 抽象类实现。

离线包后管前端,是一个基于 vue 框架,前后端分离的项目。

移动客户端,iOS 的 zip 解压缩工具依赖 SSZipArchive,web server 依赖 GCDWebServer,Android 的 web server 依赖 andserver, 版本资源的合并依靠服务端下发的补丁资源包和 merge 信息进行操作。

以下是项目的使用方法和开发环境的介绍,请查看 OCat-MobilePlatform 的 README 文档,具体实现细节请查看代码。

查看使用视频

最后

大家对这个客户端移动平台的项目有什么想法,可以提 issue,适合这个移动平台的功能,后续都可以基于此实现。