一种由云端驱动的APP动态页面实现方法

技术领域

本发明涉及移动APP领域，具体涉及一种由云端驱动的APP动态页面实现方法。

背景技术

移动APP的更新需要提交应用商店审核，顺利的话需要1-3个工作日才能正式面向用户。面对如今快速增长的用户需求和营销需求，如何让用户最快体验到新功能是每个APP都需要思考的问题，其实质就是如何实现APP功能/内容更新不依赖其版本。现阶段主流的实现方案是使用RN(ReactNative，Facebook开发的开发框架)实现云端向APP下发补丁，APP合并补丁后实现新的功能，这一技术被称之为热更新。其主要步骤为：1.APP集成热更新框架(比如说RN)；2.开发者基于热更新框架编写并制作补丁包，并将其托管至热更新平台；3.APP端在下次启动时会请求并下载该补丁包，并合并到APP中；4.APP端运行补丁提供的最新功能。

然而上述步骤存在如下问题和缺陷：1.新增页面受应用版本限制，需用户更新后才能使用；2.APP内容受页面布局约束，无法自由扩展；3.模版页面UI布局单一，性能差；4.无法复用活动页面，多次迭代下来存在大量无用代码，造成资源浪费；5.灰度测试中的版本控制问题；6.页面性能弱，无法支撑起交互性强的页面；7.开发成本高，大量活动页面开发时间长，生命周期短；8.开发效率低，每次制作的补丁都要适配各个APP版本；9.项目管理混乱，补丁的大量使用会造成APP版本和内容失控。

发明内容

本发明针对上述缺陷和问题，提供一种由云端驱动的APP动态页面的实现方法。该方法通过请求云端的页面数据，再解析渲染为APP功能页面，实现了APP动态更新的功能。

具体步骤如下：

一种由云端驱动的APP动态页面实现方法，包括如下步骤。

(1)编辑页面，通过Web端的页面编辑功能，用已有的UI元素构建页面，并将其与数据类型绑定；

(2)页面抽象化，将编辑好的页面保留页面结构和数据类型，分别转成json数据格式保存；

(3)APP端访问动态页面，首先会在该页面显示加载动画，并向后端请求页面数据；

(4)后端接收到APP端请求后，匹配对应的页面，并根据页面绑定的数据类型进行业务数据填充；

(5)后端将填充好的页面数据返回给APP端；

(6)APP端接收到页面数据后，首先会根据页面绑定的数据类型对业务数据进行实例化；

(7)APP端对接收到的页面结构进行遍历，取出所有节点组件，并通过页面解析器依次对其实例化；

(8)所有节点组件实例化后，将业务数据填充到节点中；

(9)按照页面结构，依次将组件进行组装；

(10)渲染页面。

进一步的，对于步骤(7)，若此时本地有页面缓存，则会触发diff算法对节点进行差分比对，找出差异的节点。

进一步的，后续只需要实例化有差异的节点即可，可大幅提升页面加载速度。

Web端页面编辑功能：提供基础UI组件，用户通过添加组件到画板完成页面编辑功能，每个组件支持绑定数据。

Json生成器：将编辑好的页面保留页面结构和数据类型，分别转成json数据格式保存。

页面解析器：遍历json页面数据，解析出组件树和数据对象。

本发明通过1.Web端提供APP页面编辑功能，将保存的页面抽象为一种树结构，这里使用Json数据格式保存；2.服务端根据页面Json定义的数据类型为其填充数据；3.APP端接收到页面Json的数据后对其解析并渲染出页面；4.diff算法实现页面Json差异更新，提升解析速度。

具有如下有益效果：1.支持免发版动态更新；2.开发成本低，通过Web页面编辑功能直接开发页面；3.页面加载快(数据在云端填充，diff差异更新)，交互性强(基于原生的渲染)；4.APP功能动态可配(云端控制)；5.灰度更新版本控制(云端控制)。

附图说明

图1本发明方法流程示意图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

如图1所示：本发明流程流程步骤如下：

1.页面的创建通过Web端的页面编辑功能，用已有的UI元素构建页面，并将其与数据类型绑定；

2.页面保存会剥离显示效果和数据，只保留页面结构和绑定的数据类型(Json生成器)；

3.APP端访问动态页面，首先会在该页面显示加载动画，并向后端请求页面数据；

4.后端接收到APP端请求后，匹配对应的页面，并根据页面绑定的数据类型进行业务数据填充；

5.后端将填充好的页面数据返回给APP端；

6.APP端接收到页面数据后，首先会根据页面绑定的数据类型对业务数据进行实例化；

7.APP端对接收到的页面结构进行遍历，取出所有节点组件，并依次对其实例化(页面解析器)；

8.所有节点组件实例化后，将业务数据填充到节点中；

9.按照页面结构，依次将组件进行组装；

10.渲染页面；

11.第7步补充，若此时本地有页面缓存，则会触发diff算法对节点进行差分比对，找出差异的节点；

12.由于缓存的缘故，所以后续只需要实例化有差异的节点即可，大幅提升了页面加载速度。

其中，Web端页面编辑功能：提供基础UI组件，用户通过添加组件到画板完成页面编辑功能，每个组件支持绑定数据。

Json生成器：将编辑好的页面保留页面结构和数据类型，分别转成json数据格式保存。

页面解析器：遍历json页面数据，解析出组件树和数据对象。

上面对本专利的较佳实施方式作了详细说明，但是本专利并不限于上述实施方式，在本领域的普通技术人员所具备的知识范围内，还可以在不脱离本专利宗旨的前提下作出各种变化。