一种移动APP开发的架构方法及系统与流程

本发明属于移动app的技术领域，具体地涉及一种移动app开发的架构方法及系统。

背景技术：

移动app一般会安装到android、ios、windows等设备，若要做到对android、ios、windows等设备全兼容，开发成本极高；再由于watch、phone、pad等多机型的存在，适配成本也很高；版本迭代时所有app都要升级，升级成本极其高昂。

目前，业内也有app混合web的架构，但只是将部分的ui(userinterface,用户界面)工作由web方式实现，并且不兼容web的离线模式。

技术实现要素：

本发明的技术解决问题是：克服现有技术的不足，提供一种移动app开发的架构方法，其能够适用android、ios、windows等设备，自适应watch、phone、pad等各种机型，ui功能升级时，不需要升级整个app，极大简化了app开发，将全部的ui工作都由web方式实现，并兼容web的离线模式。

本发明的技术解决方案是：这种移动app开发的架构方法，将app的所有功能分为ui与本地服务两部分，二者之间进行全双工异步通讯；包括以下步骤：

(a)所有ui全部由html5技术绘制，部署至公网成为一个web站点，app内嵌web浏览器访问web站点，渲染出ui供用户操作；

(b)各种非ui功能由app提供api实现。

本发明通过所有ui全部由html5技术绘制，部署至公网成为一个web站点，app内嵌web浏览器访问web站点，渲染出ui供用户操作，各种非ui功能由app提供api实现，从而能够适用android、ios、windows等设备，自适应watch、phone、pad等各种机型，ui功能升级时，不需要升级整个app，极大简化了app开发，将全部的ui工作都由web方式实现，并兼容web的离线模式。

还提供了采用这种方法的系统，其包括:

ui模块，其配置来所有ui全部由html5技术绘制，部署至公网成为一个web站点，app内嵌web浏览器访问web站点，渲染出ui供用户操作；

本地服务模块，其各种非ui功能由app提供api实现；

ui模块与本地服务模块之间进行全双工异步通讯。

附图说明

图1示出了根据本发明的移动app开发的架构方法的流程图。

图2示出了采用本发明的移动app开发的架构方法的架构图。

具体实施方式

如图1所示，这种移动app开发的架构方法，将app的所有功能分为ui与本地服务两部分，二者之间进行全双工异步通讯；包括以下步骤：

(a)所有ui全部由html5技术绘制，部署至公网成为一个web站点，app内嵌web浏览器访问web站点，渲染出ui供用户操作；

(b)各种非ui功能由app提供api实现。

本发明通过所有ui全部由html5技术绘制，部署至公网成为一个web站点，app内嵌web浏览器访问web站点，渲染出ui供用户操作，各种非ui功能由app提供api实现，从而能够适用android、ios、windows等设备，自适应watch、phone、pad等各种机型，ui功能升级时，不需要升级整个app，极大简化了app开发，将全部的ui工作都由web方式实现，并兼容web的离线模式。

另外，所述步骤(a)包括以下分步骤：

(a1)当app联网时，直接访问在线web站点；

(a2)当app断网时，访问web站点在app本地的缓存。

另外，所述非ui功能包括：访问后台服务、访问本地数据库、文件下载/压缩/解压缩、拍照、记录日志。

另外，该方法根据业务需要，按照屏幕的宽度划分自适应空间；根据自适应空间的不同，动态调整ui基础字体和宽度标尺，达到自适应目标。

另外，所述步骤(a)中ui动态升级包括以下分步骤：

(a11)创建manifest文件，指定所有需要缓存的资源；

(a12)当需要更新时，变更manifest文件中指定的版本号；

(a13)刷新ui。

另外，所述步骤(a13)包括以下分步骤：

(a131)判断web站点的参数updateready，如果为true，执行步骤

(a132)，否则执行步骤(a131)；

(a132)清空本地缓存；

(a133)重新加载整个web站点；

(a134)重新缓存web站点。

本领域普通技术人员可以理解，实现上述实施例方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成，所述的程序可以存储于一计算机可读取存储介质中，该程序在执行时，包括上述实施例方法的各步骤，而所述的存储介质可以是：rom/ram、磁碟、光盘、存储卡等。因此，与本发明的方法相对应的，本发明还同时包括一种移动app开发的架构系统，该系统通常以与方法各步骤相对应的功能模块的形式表示。使用该方法的系统，其包括:

ui模块，其配置来所有ui全部由html5技术绘制，部署至公网成为一个web站点，app内嵌web浏览器访问web站点，渲染出ui供用户操作；

本地服务模块，其各种非ui功能由app提供api实现；

ui模块与本地服务模块之间进行全双工异步通讯。

另外，所述ui模块执行以下分步骤：

(a1)当app联网时，直接访问在线web站点；

(a2)当app断网时，访问web站点在app本地的缓存。

另外，所述本地服务模块的非ui功能包括：访问后台服务、访问本地数据库、文件下载/压缩/解压缩、拍照、记录日志。

另外，该系统根据业务需要，按照屏幕的宽度划分自适应空间；根据自适应空间的不同，动态调整ui基础字体和宽度标尺，达到自适应目标。

以上所述，仅是本发明的较佳实施例，并非对本发明作任何形式上的限制，凡是依据本发明的技术实质对以上实施例所作的任何简单修改、等同变化与修饰，均仍属本发明技术方案的保护范围。

技术特征：

技术总结
本发明公开一种移动APP开发的架构方法，其能够适用android、ios、windows等设备，自适应watch、phone、pad等各种机型，UI功能升级时，不需要升级整个APP，极大简化了APP开发，将全部的UI工作都由Web方式实现，并兼容Web的离线模式。这种移动APP开发的架构方法，将APP的所有功能分为UI与本地服务两部分，二者之间进行全双工异步通讯；包括：(a)所有UI全部由HTML5技术绘制，部署至公网成为一个Web站点，APP内嵌Web浏览器访问Web站点，渲染出UI供用户操作；(b)各种非UI功能由APP提供API实现。还提供了移动APP开发的架构系统。

技术研发人员：屠文珂;杨英;俞晖;延琦;邱磊;李见伟;卢杰文;赵孟恩;付玉豪
受保护的技术使用者：北京数字医视文化传媒有限公司
技术研发日：2017.07.11
技术公布日：2017.12.22