[发明专利]一种通用WEB页面布局生成装置及方法

权利要求书

1.一种通用WEB页面布局生成装置，包括：

前端处理模块，用于设计所要生成的页面所使用到的基础组件，根据前后端预先定义的数据格式实现对应的方案树解析器，于接收到页面访问请求时，从后端处理模块获取由所述页面的布局方案及其各个组件内容构成的方案树，并利用所述方案解析器解析所述方案树，将所述方案树中对应的组件解析为HTML，插入DOM树中，并根据解析结果将各组件渲染生成所述页面；

后端处理模块，用于设计包括所述页面的布局方案以及各个组件内容的方案树，并于接收到前端处理模块发送的方案树获取请求时，将所述方案树传送至所述前端处理模块。

2.如权利要求1所述的一种通用WEB页面布局生成装置，其特征在于，所述前端处理模块包括：

基础组件设计单元，用于设计所要生成的WEB页面所使用到的基础组件；

方案解析器设计单元，用于根据前后端预先定义的数据格式实现相应的方案树解析器；

方案树获取单元，用于根据接收到的页面访问请求完成前端路由事件注册，并于监听到路由变化时，向所述后端处理模块发送方案树获取请求以获取该路由对应的方案树；

方案树解析处理单元，用于利用所述方案树解析器解析所述方案树，将所述方案树中对应的组件解析为HTML，插入DOM树中，并根据解析结果将各组件渲染生成所述WEB页面。

3.如权利要求2所述的一种通用WEB页面布局生成装置，其特征在于：所述基础组件设计单元通过将所述WEB页面设计图中的公共元素由简单到复杂进行拆分，隔离成独立的基础组件并进行组合，获得所述WEB页面所使用到的所有组件。

4.如权利要求2所述的一种通用WEB页面布局生成装置，其特征在于：所述基础组件包括但不限于布局容器、导航条、表单、按钮。

5.如权利要求2所述的一种通用WEB页面布局生成装置，其特征在于：所述基础组件间的关系可以有组合以及继承。

6.如权利要求2所述的一种通用WEB页面布局生成装置，其特征在于，所述方案树获取单元首先根据该页面访问请求得到一个骨架屏和初始的加载代码，通过所述初始加载代码完成前端路由事件的注册，所述方案树获取单元监听前端路由变化，当监听到路由变化时，请求所述后端处理模块以获取该路由对应的方案树。

7.如权利要求2所述的一种通用WEB页面布局生成装置，其特征在于，所述前端处理模块还包差异比较单元，用于将当前页面的方案树与请求得到的新页面的方案树进行差异比较，得到由当前页面转化为新页面所需要修改的最小部分，并将其作为所要解析的方案树，启动所述方案树解析处理单元。

8.如权利要求7所述的一种通用WEB页面布局生成装置，其特征在于：所述方案树解析处理单元通过解析该最小更新方案树，生成符合HTML规范的代码片段，并将所述DOM树上的对应分支用其替换，以生成新的WEB页面。

9.一种通用WEB页面布局生成方法，包括如下步骤：

步骤S1，利用前端处理模块设计所要生成的页面所使用到的基础组件，利用后端处理模块设计所述页面的布局方案以及各个组件中的内容；

步骤S2，根据前后端预先定义的数据格式实现对应的方案树解析器；

步骤S3，接收页面访问请求，根据接收到的页面访问请求完成前端路由事件注册，并监听前端路由变化，于监听到路由变化时，向所述后端处理模块发送获取方案树请求，请求获取该路由对应的方案树；

步骤S4，后端处理模块于接收到所述前端处理模块发送的获取方案树请求时，将该路由对应的方案树发送至前端处理模块。

步骤S5，解析所述方案树，将所述方案树中对应的组件解析为HTML，插入DOM树中，并根据解析结果将各组件渲染生成所述页面。

10.如权利要求9所述的一种通用WEB页面布局生成方法，其特征在于，于步骤S5之前，还包括如下步骤：

将当前页面的方案树与请求得到的新页面的方案树进行差异比较，得到由当前页面转化为新页面所需要修改的最小部分，并将其作为所要解析的方案树，然后进入步骤S5。