网页页面加载方法、装置、计算机设备及存储介质制造方法及图纸

技术编号:21952653 阅读:24 留言:0更新日期:2019-08-24 17:47
本申请揭示了一种网页页面加载方法、装置、计算机设备及存储介质,其中,网页页面加载方法,包括:根据预存的菜单数据生成含有菜单列表的应用界面,并对菜单列表中的各个菜单项进行路由的加载;接收用户针对目标菜单项的菜单内容访问请求,并判断目标菜单项是否已完成路由的加载;若目标菜单项已完成路由的加载,则响应菜单内容访问请求,加载出对应目标菜单项的菜单内容。该网页页面加载方法可动态配置菜单,当需要增删改菜单时,无需修改主框架的js文件,提高了灵活性。

Web Page Loading Method, Device, Computer Equipment and Storage Media

【技术实现步骤摘要】
网页页面加载方法、装置、计算机设备及存储介质
本申请涉及到计算机
,特别是涉及到一种网页页面加载方法、装置、计算机设备及存储介质。
技术介绍
AngularJS是一款基于JavaScript的前端MVC框架,主要用于动态应用程序的开发工作,能有效的简化开发过程的复杂度,提高测试和开发效率,通过AngularJS可以实现多视图的单页面应用,而所谓单页面应用是指一种基于Web的应用或者网站,这种单页面在与用户交互的时候,当用户点击某个物件或者按键的时候不会跳转到其他的页面。其中,在单页面应用的开发中,路由是前端构建单页面应用必不可少的组成部分,通过AngularJS路由,用户可通过不同的URL(UniformResourceLocator,统一资源定位符)访问不同的内容,实现单页面跳转。然而AngularJS的路由一般都是写在主框架的js文件中的(即路由是写在代码中的),无法动态进行配置,而菜单与路由又是一一对应的关系(即不同的菜单对应不同的路由),当需要增删改菜单时,通常需要频繁地修改主框架的js文件,因此灵活性较差。
技术实现思路
本申请的主要目的为提供一种网页页面加载方法、装置、计算机设备及存储介质,该网页页面加载方法可动态配置菜单,当需要增删改菜单时,无需修改主框架的js文件,提高了灵活性。本申请提出一种网页页面加载方法,包括:根据预存的菜单数据生成含有菜单列表的应用界面,并对菜单列表中的各个菜单项进行路由的加载;接收用户针对目标菜单项的菜单内容访问请求,并判断目标菜单项是否已完成路由的加载,其中,菜单项包括目标菜单项;若目标菜单项已完成路由的加载,则响应菜单内容访问请求,加载出对应目标菜单项的菜单内容。进一步地,根据预存的菜单数据生成含有菜单列表的应用界面的步骤,包括:从目标数据库中获取预存的菜单数据并进行框架页面的加载,其中,菜单数据包括菜单名称和菜单图标;根据菜单名称和菜单图标,对框架页面进行渲染,获得应用界面。进一步地,菜单数据还包括各个菜单项对应的路由地址、模板地址和菜单控制器,对菜单列表中的各个菜单项进行路由的加载的步骤,包括:将路由地址、模板地址和菜单控制器进行关联,以建立路由地址、模板地址和菜单控制器之间的映射关系;将关联后的路由地址、模板地址和菜单控制器与对应的菜单项进行绑定。进一步地,判断目标菜单项是否已完成路由的加载的步骤,包括:判断是否接收到路由加载完成的广播通知;若接收到路由加载完成的广播通知,则判定目标菜单项已完成路由的加载。进一步地,当各个菜单项均已完成路由的加载时,将预设的全局变量设置为真,判断目标菜单项是否已完成路由的加载的步骤,包括:判断全局变量是否为真;若全局变量为真,则判定目标菜单项已完成路由的加载。进一步地,菜单内容访问请求包括路由地址,响应菜单内容访问请求,加载出对应目标菜单项的菜单内容的步骤,包括:根据路由地址,确定出与路由地址相对应的菜单控制器和模板地址;根据模板地址从目标数据库中查询出与模板地址相对应的菜单内容;将菜单内容渲染至应用界面的指定显示区域内,加载出对应目标菜单项的菜单内容。进一步地,前述的网页页面加载方法,还包括:间隔预设时间获取菜单内容访问请求的历史访问记录;根据历史访问记录,挑选出指定路由地址,其中,指定路由地址为历史访问记录中出现次数最多的路由地址;将指定路由地址设置为默认路由地址。本申请还提出一种网页页面加载装置,包括:数据处理模块,用于根据预存的菜单数据生成含有菜单列表的应用界面,并对菜单列表中的各个菜单项进行路由的加载;判断模块,用于接收用户针对目标菜单项的菜单内容访问请求,并判断目标菜单项是否已完成路由的加载,其中,菜单项包括目标菜单项;加载模块,用于当目标菜单项已完成路由的加载时,响应菜单内容访问请求,加载出对应目标菜单项的菜单内容。本申请还提出一种计算机设备,包括存储器和处理器,存储器存储有计算机程序,处理器执行计算机程序时实现前述的网页页面加载方法的步骤。本申请还提出一种计算机可读存储介质,其上存储有计算机程序,计算机程序被处理器执行时实现前述的网页页面加载方法的步骤。本申请的有益效果是:本申请实施例提供的网页页面加载方法通过将菜单数据预存于数据库中,实现了逻辑与数据的分离,当进行页面加载时,通过从数据库中异步获取菜单数据,并根据获取到的菜单数据生成含有菜单列表的应用界面,同时根据菜单数据对菜单列表中的各个菜单项进行路由的加载,这样,当目标菜单项完成路由的加载时,即可响应用户针对目标菜单项的菜单内容访问请求,加载出对应的菜单内容,当需要增删改菜单时,只需对后台数据库中的菜单数据进行维护即可,而无需修改主框架的js文件,使得开发人员在前端开发过程中,可更专注于每个菜单功能自身的代码,从而实现了菜单的动态配置,提高了灵活性。附图说明图1是本申请一实施中网页页面加载方法的流程示意图;图2是本申请一实施中网页页面加载装置的结构示意图;图3是本申请一实施中数据处理模块的结构示意图;图4是本申请一实施中判断模块的结构示意图;图5是本申请另一实施中判断模块的结构示意图;图6是本申请一实施中加载模块的结构示意图;图7是本申请另一实施中网页页面加载装置的结构示意图;图8是本申请一实施中AngularJS的框架页面示意图;图9是本申请一实施中计算机设备的结构示意图。本专利技术目的的实现、功能特点及优点将结合实施例,参照附图做进一步说明。具体实施方式应当理解,此处所描述的具体实施例仅仅用以解释本专利技术,并不用于限定本专利技术。参照图1,本申请实施例提出一种网页页面加载方法,可适用于在单页面应用中进行网页页面的加载的情况,该方法可以由网页页面加载装置来执行,该网页页面加载装置可由硬件和/或软件组成,且一般可集成在所有包含Web前端系统开发功能的智能终端设备中,该方法包括:S11,根据预存的菜单数据生成含有菜单列表的应用界面,并对菜单列表中的各个菜单项进行路由的加载;S12,接收用户针对目标菜单项的菜单内容访问请求,并判断目标菜单项是否已完成路由的加载,其中,菜单项包括目标菜单项;若是,则执行S13,响应菜单内容访问请求,加载出对应目标菜单项的菜单内容。在上述步骤S11中,预存的菜单数据为存储在数据库中与菜单项的信息相对应的数据,例如菜单项为“人员管理”,则预存的菜单数据为存储在数据库中与“人员管理”相关的信息所对应的数据,其主要作用在于向用户展示应用界面的布局及页面内容(即应用界面中所含有的菜单项以及各个菜单项所对应的菜单内容),具体地,当触发开启页面加载时(如通过登录页面进行触发),网页页面加载装置将从数据库中异步获取菜单数据并进行菜单数据的加载,以生成含有菜单列表的应用界面以及对菜单列表中的各个菜单项进行路由的加载,其中,在菜单数据加载的过程中,根据菜单数据对前端的显示界面进行渲染可生成含有菜单列表的应用界面,而根据菜单数据对菜单项进行路由的加载,其目的在于为菜单列表中的各个菜单项配置对应的路由,当某个菜单项配置好对应的路由后,后续才能通过路由的跳转加载出与该菜单项相对应的菜单内容,例如,菜单列表中含有“设备管理”和“人员管理”这两个菜单项,则需要为这两个菜单项配置对应的路由,路由配置好后,在前端的应用界面上才能加载出对应“设备管本文档来自技高网...

【技术保护点】
1.一种网页页面加载方法,其特征在于,包括:根据预存的菜单数据生成含有菜单列表的应用界面,并对所述菜单列表中的各个菜单项进行路由的加载;接收用户针对目标菜单项的菜单内容访问请求,并判断所述目标菜单项是否已完成路由的加载,其中,所述菜单项包括所述目标菜单项;若所述目标菜单项已完成路由的加载,则响应所述菜单内容访问请求,加载出对应所述目标菜单项的菜单内容。

【技术特征摘要】
1.一种网页页面加载方法,其特征在于,包括:根据预存的菜单数据生成含有菜单列表的应用界面,并对所述菜单列表中的各个菜单项进行路由的加载;接收用户针对目标菜单项的菜单内容访问请求,并判断所述目标菜单项是否已完成路由的加载,其中,所述菜单项包括所述目标菜单项;若所述目标菜单项已完成路由的加载,则响应所述菜单内容访问请求,加载出对应所述目标菜单项的菜单内容。2.根据权利要求1所述的网页页面加载方法,其特征在于,根据预存的菜单数据生成含有菜单列表的应用界面的步骤,包括:从目标数据库中获取预存的菜单数据并进行框架页面的加载,其中,所述菜单数据包括菜单名称和菜单图标;根据所述菜单名称和菜单图标,对所述框架页面进行渲染,获得所述应用界面。3.根据权利要求2所述的网页页面加载方法,其特征在于,所述菜单数据还包括各个所述菜单项对应的路由地址、模板地址和菜单控制器,所述对所述菜单列表中的各个菜单项进行路由的加载的步骤,包括:将所述路由地址、模板地址和菜单控制器进行关联,以建立所述路由地址、模板地址和菜单控制器之间的映射关系;将关联后的所述路由地址、模板地址和菜单控制器与对应的所述菜单项进行绑定。4.根据权利要求3所述的网页页面加载方法,其特征在于,所述判断所述目标菜单项是否已完成路由的加载的步骤,包括:判断是否接收到路由加载完成的广播通知;若接收到路由加载完成的广播通知,则判定所述目标菜单项已完成路由的加载。5.根据权利要求3所述的网页页面加载方法,其特征在于,当各个所述菜单项均已完成路由的加载时,将预设的全局变量设置为真,所述判断所述目标菜单项是否已完成路由的加载的步骤,包括:判断所述全局变量是否为真;若所述全局变...

【专利技术属性】
技术研发人员:陈林丁磊磊
申请(专利权)人:平安科技深圳有限公司
类型:发明
国别省市:广东,44

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1