一种云无线控制器前端页面的加载方法及系统技术方案

本发明专利技术提供一种云无线控制器前端页面的加载方法及系统，其中，所述方法包括：根据前端页面中页面元素的业务类型，预先将所述前端页面拆分为预设数量的前端模块；为各个所述前端模块配置各自的模块路由，并将各个所述模块路由加入预设系统路由中；其中，所述模块路由中包括所述前端模块的至少一个业务组件；当用户访问目标页面元素时，通过所述预设系统路由定位所述目标页面元素指向的目标前端模块，并加载所述目标前端模块的业务组件。本发明专利技术提供的一种云无线控制器前端页面的加载方法及系统，能够减少移动设备的流量消耗和资源消耗。

Loading method and system for front page of cloud wireless controller

The present invention provides a method and system for loading, cloud wireless controller front page, the method comprises: according to the front page in the page elements of the type of business, will advance to the front page is split into the preset front-end module number; for each of the front-end module configuration module routing respectively, and each of the the routing module to add a default routing system; which comprises at least one service components of the front-end module of the module routing; when the user access to the target page elements, the default routing system through the positioning the target object to the front-end module page elements, and load the business component of the target module the. The invention provides a method and a system for loading a page of a front end of a cloud wireless controller.

【技术实现步骤摘要】

本专利技术实施方式涉及数据处理
，尤其涉及一种云无线控制器前端页面的加载方法及系统。
技术介绍
云无线控制器(AccessController，AC)系统往往通过超文本标记语言(HyperTextMarkupLanguage，HTML)呈现系统的功能接口，用户可以通过浏览器连接云AC系统，从而可以进行各种操作。在实施本专利技术的过程中，专利技术人发现现有技术至少存在如下问题：目前，当用户第一次通过浏览器访问云AC系统时，浏览器通过index.html文件获取云AC的前端页面。这样，index.html中包含了云AC系统中所有需要的HTML文件、Javascript文件和CSS文件。这些文件都会在第一次访问时，从后端服务器返回。如果用户只使用云AC系统中的一个功能模块，也会装载系统所有的文件进入内存。这就造成如果用户在移动设备中访问云AC系统，不管用户使用什么功能，都会消耗一些不必要的移动流量。同时因为所有的文件都会被装载进设备的内存，从而会增加设备的资源消耗，相应减少了设备电量的可使用时长。应该注意，上面对技术背景的介绍只是为了方便对本专利技术的技术方案进行清楚、完整的说明，并方便本领域技术人员的理解而阐述的。不能仅仅因为这些方案在本专利技术的
技术介绍
部分进行了阐述而认为上述技术方案为本领域技术人员所公知。
技术实现思路
针对上述问题，本专利技术实施方式的目的在于提供了一种云无线控制器前端页面的加载方法及系统，能够减少移动设备的流量消耗和资源消耗。为实现上述目的，本专利技术实施方式提供一种云无线控制器前端页面的加载方法，包括：根据前端页面中页面元素的业务类型，预先将所述前端页面拆分为预设数量的前端模块；为各个所述前端模块配置各自的模块路由，并将各个所述模块路由加入预设系统路由中；其中，所述模块路由中包括所述前端模块的至少一个业务组件；当用户访问目标页面元素时，通过所述预设系统路由定位所述目标页面元素指向的目标前端模块，并加载所述目标前端模块的业务组件。进一步地，所述为各个所述前端模块配置各自的模块路由，包括：为各个所述前端模块创建各自的至少一个业务组件；为各个所述前端模块创建各自的模块根组件，并在所述模块根组件中建立路由视图；将所述前端模块中的业务组件加入所述前端模块的路由视图中，并为各个所述业务组件配置路由路径，以形成所述前端模块的模块路由。进一步地，所述加载所述目标前端模块的业务组件，包括：通过所述预设系统路由中的预设加载接口对所述目标前端模块中的业务组件进行加载。进一步地，所述加载所述目标前端模块的业务组件，包括：判断所述目标前端模块是否是第一次被定位，若是，从服务端将所述目标前端模块的所有业务组件加载至本地；若不是，从本地存储的业务组件中加载所述目标前端模块的业务组件。进一步地，所述服务端中存储的业务组件具备第一数据格式；相应地，从所述服务端将具备第一数据格式的业务组件加载至本地之后，所述方法还包括：将加载的业务组件从第一数据格式转换为第二数据格式；其中，所述业务组件处于所述第二数据格式时的数据量大于所述业务组件处于所述第一数据格式时的数据量。进一步地，所述从本地存储的业务组件中加载所述目标前端模块的业务组件，包括：获取所述业务组件的路由路径，并将所述路由路径转换为业务标识；在本地第一存储器中查询是否存在与所述业务标识相匹配的业务组件，若存在，加载查询的所述业务组件；若不存在，在本地第二存储器中查询与所述业务标识相匹配的业务组件，并将查询得到的业务组件写入所述第一存储器中；其中，所述第一存储器的读写速度大于所述第二存储器的读写速度。为实现上述目的，本专利技术实施方式还提供一种云无线控制器前端页面的加载系统，包括：前端模块拆分单元，用于根据前端页面中页面元素的业务类型，预先将所述前端页面拆分为预设数量的前端模块；模块路由配置单元，用于为各个所述前端模块配置各自的模块路由，并将各个所述模块路由加入预设系统路由中；其中，所述模块路由中包括所述前端模块的至少一个业务组件；业务组件加载单元，用于当用户访问目标页面元素时，通过所述预设系统路由定位所述目标页面元素指向的目标前端模块，并加载所述目标前端模块的业务组件。进一步地，所述所述模块路由配置单元，具体包括：业务组件创建模块，用于为各个所述前端模块创建各自的至少一个业务组件；模块根组件创建模块，用于为各个所述前端模块创建各自的模块根组件，并在所述模块根组件中建立路由视图；路由路径配置模块，用于将所述前端模块中的业务组件加入所述前端模块的路由视图中，并为各个所述业务组件配置路由路径，以形成所述前端模块的模块路由。进一步地，所述业务组件加载单元，具体包括：远程加载模块，用于判断所述目标前端模块是否是第一次被定位，若是，从服务端将所述目标前端模块的所有业务组件加载至本地；本地加载模块，用于判断所述目标前端模块是否是第一次被定位，若不是，从本地存储的业务组件中加载所述目标前端模块的业务组件。进一步地，所述服务端中存储的业务组件具备第一数据格式；相应地，所述业务组件加载单元，还包括：数据格式转换模块，用于将加载的业务组件从第一数据格式转换为第二数据格式；其中，所述业务组件处于所述第二数据格式时的数据量大于所述业务组件处于所述第一数据格式时的数据量。由上可见，本专利技术实施方式提供的一种云无线控制器前端页面的加载方法及系统，通过把前端相关业务划分成不同的前端模块，在各个前端模块中可以通过模块路由配置各个业务组件。当用户访问目标页面元素时，可以仅仅加载该目标页面元素指向的前端模块的业务组件，而不需要加载所有前端模块的业务组件，从而能够降低移动设备消耗的数据流量和内存的使用，从而最终减少对移动设备的资源消耗。附图说明为了更清楚地说明本专利技术实施方式或现有技术中的技术方案，下面将对实施方式或现有技术描述中所需要使用的附图逐一简单地介绍，显而易见地，下面描述中的附图是本专利技术的一些实施方式，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。图1为本专利技术实施方式提供的一种云无线控制器前端页面的加载方法流程图；图2为本专利技术实施方式提供的一种云无线控制器前端页面的加载系统的功能模块图。具体实施方式为使本专利技术实施方式的目的、技术方案和优点更加清楚，下面将结合本专利技术实施方式中的附图，对本专利技术实施方式中的技术方案进行清楚、完整地描述，显然，所描述的实施方式是本专利技术一部分实施方式，而不是全部的实施方式。基于本专利技术中的实施方式，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施方式，都属于本专利技术保护的范围。请参阅图1，本专利技术实施方式提供一种云无线控制器前端页面的加载方法，所述方法包括以下步骤。步骤S1：根据前端页面中页面元素的业务类型，预先将所述前端页面拆分为预设数量的前端模块。在本实施方式中，所述前端页面展示的页面元素通常具备不同的业务类型。所述业务类型可以根据实现的功能来进行区分。根据不同的业务类型，可以将所述前端页面拆分为多个前端模块。这些前端模块例如可以包括配置模块、告警模块、系统监控模块等。在本实施方式中，可以通过angular2来实现云AC系统的前端模块化。Angular2可以把模板转换成代码，针对现代JavaScript虚拟机进行高度优化。同时本文档来自技高网...

【技术保护点】
一种云无线控制器前端页面的加载方法，其特征在于，包括：根据前端页面中页面元素的业务类型，预先将所述前端页面拆分为预设数量的前端模块；为各个所述前端模块配置各自的模块路由，并将各个所述模块路由加入预设系统路由中；其中，所述模块路由中包括所述前端模块的至少一个业务组件；当用户访问目标页面元素时，通过所述预设系统路由定位所述目标页面元素指向的目标前端模块，并加载所述目标前端模块的业务组件。

【技术特征摘要】
1.一种云无线控制器前端页面的加载方法，其特征在于，包括：根据前端页面中页面元素的业务类型，预先将所述前端页面拆分为预设数量的前端模块；为各个所述前端模块配置各自的模块路由，并将各个所述模块路由加入预设系统路由中；其中，所述模块路由中包括所述前端模块的至少一个业务组件；当用户访问目标页面元素时，通过所述预设系统路由定位所述目标页面元素指向的目标前端模块，并加载所述目标前端模块的业务组件。2.根据权利要求1所述的云无线控制器前端页面的加载方法，其特征在于，所述为各个所述前端模块配置各自的模块路由，包括：为各个所述前端模块创建各自的至少一个业务组件；为各个所述前端模块创建各自的模块根组件，并在所述模块根组件中建立路由视图；将所述前端模块中的业务组件加入所述前端模块的路由视图中，并为各个所述业务组件配置路由路径，以形成所述前端模块的模块路由。3.根据权利要求1所述的云无线控制器前端页面的加载方法，其特征在于，所述加载所述目标前端模块的业务组件，包括：通过所述预设系统路由中的预设加载接口对所述目标前端模块中的业务组件进行加载。4.根据权利要求1所述的云无线控制器前端页面的加载方法，其特征在于，所述加载所述目标前端模块的业务组件，包括：判断所述目标前端模块是否是第一次被定位，若是，从服务端将所述目标前端模块的所有业务组件加载至本地；若不是，从本地存储的业务组件中加载所述目标前端模块的业务组件。5.根据权利要求4所述的云无线控制器前端页面的加载方法，其特征在于，所述服务端中存储的业务组件具备第一数据格式；相应地，从所述服务端将具备第一数据格式的业务组件加载至本地之后，所述方法还包括：将加载的业务组件从第一数据格式转换为第二数据格式；其中，所述业务组件处于所述第二数据格式时的数据量大于所述业务组件处于所述第一数据格式时的数据量。6.根据权利要求4所述的云无线控制器前端页面的加载方法，其特征在于，所述从本地存储的业务组件中加载所述目标前端模块的业务组件，包括：获取所述业务组件的路由路径，并将所述路由路径转换为业务标识；在本地第一存储器中查询是否...

【专利技术属性】
技术研发人员：陈昊，
申请(专利权)人：上海斐讯数据通信技术有限公司，
类型：发明
国别省市：上海;31