网页渲染方法、装置、终端及服务器制造方法及图纸

技术编号:15895367 阅读:29 留言:0更新日期:2017-07-28 19:50
本发明专利技术实施例公开了一种网页渲染方法、装置、终端及服务器,所述方法包括:向服务器发送第一请求消息,以使所述服务器根据所述第一请求消息向所述Web客户端返回预先存储的页面配置信息,所述页面配置信息中包含预先根据所述待显示页面的结构特征抽象出的组件信息;根据所述组件信息进行页面结构布局,生成页面基础结构;根据所述服务器返回的渲染数据对所述页面基础结构进行渲染。本发明专利技术实施例通过向服务器发送第一请求消息,使所述服务器根据所述第一请求消息返回预先根据待显示页面的结构特征抽象出的组件信息,并根据所述组件信息进行页面结构布局,从而进行渲染,可以根据组件信息实现页面组件的渲染,利于客户端的维护。

Web page rendering method, device, terminal and server

The embodiment of the invention discloses a web page rendering method and device, terminal and server, the method includes: a first request message to the server, the server page according to the configuration information stored in advance of the first request message to the Web client to return, the page configuration information contained in advance according to the the display component information structure page abstract; according to the assembly information page layout, page generation infrastructure; according to the data returned by the server to render the page structure based rendering. The embodiment of the invention the first request message to the server, the server according to the first request message is returned in advance according to the structural characteristics of the component information page abstracts to be displayed, and the page layout according to the component information, thus rendering, can realize according to the component information page component rendering, maintenance for the client.

【技术实现步骤摘要】
网页渲染方法、装置、终端及服务器
本专利技术实施例涉及互联网
,尤其涉及一种网页渲染方法、装置、终端及服务器。
技术介绍
Web页面运行在各种各样的浏览器当中,浏览器载入、渲染页面的速度直接影响着用户体验简单地说,页面渲染就是浏览器将超级文本标记语言(HyperTextMarkupLanguage,html)代码根据层叠样式表(CascadingStyleSheets,CSS)定义的规则显示在浏览器窗口中的这个过程。目前,主要有以下两种渲染方法:一是,全球广域网(WorldWideWeb,Web)客户端根据请求向服务器发起请求,服务器返回的是一种轻量级的数据交换格式(JavaScriptObjectNotation,json)数据,Web客户端利用预先写的超文本标记语言(HyperTextMarkupLanguage,html)模板,循环读取json数据,拼接字符串,并插入页面,完成页面渲染。二是,Web客户端根据请求向服务器发起请求,服务器利用后台模板引擎直接生成html片段,并返回Web客户端,Web客户端将html片段直接插入页面。但是,第一种方式的缺点是,Web客户端包含较多的模板代码,后续不利于代码维护。第二种方式的缺点是,由于文档对象模型(DocumentObjectModel,DOM)结构已经固定,不便于前端代码的模块化构建,同样不易于前端代码的维护。
技术实现思路
本专利技术实施例提供一种网页渲染方法及装置,利于客户端的维护。第一方面,本专利技术实施例提供了一种网页渲染方法,包括:向服务器发送第一请求消息,以使所述服务器根据所述第一请求消息向所述客户端返回预先存储的页面配置信息,所述页面配置信息中包含预先根据所述待显示页面的结构特征抽象出的组件信息;根据所述组件信息进行页面结构布局,生成页面基础结构;根据所述服务器返回的渲染数据对所述页面基础结构进行渲染。第二方面,本专利技术实施例还提供了一种网页渲染方法,包括:接收客户端发送的第一请求消息;根据所述第一请求消息向所述客户端返回预先存储的页面配置信息,所述页面配置信息中包含预先根据所述待显示页面的结构特征抽象出的组件信息,以使所述客户端根据所述组件信息进行页面结构布局,生成页面基础结构;向所述客户端返回渲染数据,以使所述客户端根据所述渲染数据对所述页面基础结构进行渲染。第三方面,本专利技术实施例还提供了一种装置,包括:消息发送模块,用于向服务器发送第一请求消息,以使所述服务器根据所述第一请求消息向所述客户端返回预先存储的页面配置信息,所述页面配置信息中包含预先根据所述待显示页面的结构特征抽象出的组件信息;页面生成模块,用于根据所述组件信息进行页面结构布局,生成页面基础结构;页面渲染模块,用于根据所述服务器返回的渲染数据对所述页面基础结构进行渲染。第四方面,本专利技术实施例还提供了一种装置,包括:消息接收模块,用于接收客户端发送的第一请求消息;组件信息返回模块,用于根据所述第一请求消息向所述客户端返回预先存储的页面配置信息,所述页面配置信息中包含预先根据所述待显示页面的结构特征抽象出的组件信息,以使所述客户端根据所述组件信息进行页面结构布局,生成页面基础结构;渲染数据返回模块,用于向所述客户端返回渲染数据,以使所述客户端根据所述渲染数据对所述页面基础结构进行渲染。第五方面,本专利技术实施例还提供了一种装置,包括:一个或多个处理器;存储装置,用于存储一个或多个程序,当所述一个或多个程序被所述一个或多个处理器执行,使得所述一个或多个处理器实现如本专利技术实施例所述的网页渲染方法。第六方面,本专利技术实施例还提供了一种服务器,包括:一个或多个处理器;存储装置,用于存储一个或多个程序,当所述一个或多个程序被所述一个或多个处理器执行,使得所述一个或多个处理器实现本专利技术实施例所述的网页渲染方法。第七方面,本专利技术实施例还提供了一种计算机可读存储介质,其上存储有计算机程序,该程序被处理器执行时实现本专利技术实施例任一所述的网页渲染方法。第八方面,本专利技术实施例还提供了一种计算机可读存储介质,其上存储有计算机程序,该程序被处理器执行时实现本专利技术实施例任一所述的网页渲染方法。本专利技术实施例通过向服务器发送第一请求消息,使所述服务器根据所述第一请求消息返回预先根据待显示页面的结构特征抽象出的组件信息,并根据所述组件信息进行页面结构布局,从而进行渲染,可以根据组件信息实现页面组件的渲染,利于客户端的维护。附图说明图1是本专利技术实施例一中的一种网页渲染方法的流程图;图2是本专利技术实施例二中的一种网页渲染方法的流程图;图3是本专利技术实施例三中的一种网页渲染方法的流程图;图4是本专利技术实施例四中的一种网页渲染方法的流程图;图5是本专利技术实施例五中的一种网页渲染方法的流程图;图6是本专利技术实施例六中的一种网页渲染装置的结构图;图7是本专利技术实施例七中的一种网页渲染装置的结构图;图8是本专利技术实施例八中的一种终端的结构图;图9是本专利技术实施例九中的一种终端的结构图。具体实施方式下面结合附图和实施例对本专利技术作进一步的详细说明。可以理解的是,此处所描述的具体实施例仅仅用于解释本专利技术,而非对本专利技术的限定。另外还需要说明的是,为了便于描述,附图中仅示出了与本专利技术相关的部分而非全部结构。实施例一图1为本专利技术实施例一提供的一种网页渲染方法的流程图,该方法可以由本专利技术实施例提供的网页渲染装置来执行,该装置可采用软件和/或硬件的方式实现,该装置可集成在客户端软件或终端设备中,例如终端设备可以是移动终端(例如手机)、平板电脑和台式电脑等,客户端软件可以是Web客户端等。如图1所示,具体包括:S110、向服务器发送第一请求消息,以使所述服务器根据所述第一请求消息向所述客户端返回预先存储的页面配置信息,所述页面配置信息中包含预先根据所述待显示页面的结构特征抽象出的组件信息。本实施例的执行主体优选为Web客户端或终端。其中,第一请求消息用于向服务器获取页面配置信息。具体可以为用户发起的Web客户端开启指令或者发起的网页链接请求。在本实施例中,可以把具有基础功能的页面结构抽象为组件,在页面配置信息中写明组件信息。或者可以为研发人员预先根据待显示页面的结构特征研发抽象出的组件信息。组件信息可以包含以下至少一项信息:至少一个组件、各组件间的位置关系和各组件间的影响关系。具体的,在用户有网页浏览需求时,通过Web客户端或终端向服务器发送第一请求消息。服务器接收到第一请求消息后,向Web客户端返回预先存储的页面配置信息,其中,页面配置信息中包含预先根据所述待显示页面的结构特征抽象出的组件信息。S120、根据所述组件信息进行页面结构布局,生成页面基础结构。客户端接收到服务器返回的组件信息之后,根据组件信息进行页面结构布局,主要包括页面中需要显示的组件、组件间的位置和组件间的影响关系,生成页面基础结构。S130、根据所述服务器返回的渲染数据对所述页面基础结构进行渲染。其中,渲染数据可以包括以下任意一种:返回的数据、数据渲染的位置和页面渲染行为。返回的数据可以为但不限于为页面中需要显示的数据,例如文字、图片等。数据渲染的位置为针对页面中哪个组件或哪部分数据进行渲染。页面渲染行为可以为用户触发事件,例如刷新操作、添加操作、删除操作或编辑操作等。具体的,所述服本文档来自技高网...
网页渲染方法、装置、终端及服务器

【技术保护点】
一种网页渲染方法,其特征在于,包括:向服务器发送第一请求消息,以使所述服务器根据所述第一请求消息向所述客户端返回预先存储的页面配置信息,所述页面配置信息中包含预先根据所述待显示页面的结构特征抽象出的组件信息;根据所述组件信息进行页面结构布局,生成页面基础结构;根据所述服务器返回的渲染数据对所述页面基础结构进行渲染。

【技术特征摘要】
1.一种网页渲染方法,其特征在于,包括:向服务器发送第一请求消息,以使所述服务器根据所述第一请求消息向所述客户端返回预先存储的页面配置信息,所述页面配置信息中包含预先根据所述待显示页面的结构特征抽象出的组件信息;根据所述组件信息进行页面结构布局,生成页面基础结构;根据所述服务器返回的渲染数据对所述页面基础结构进行渲染。2.根据权利要求1所述的方法,其特征在于,根据所述组件信息进行页面布局,生成页面基础结构包括:根据所述组件信息确定页面中包含以下至少一项信息:至少一个组件、各组件间的位置关系和各组件间的影响关系;根据所述页面中包含的以上至少一项信息进行页面结构布局,生成页面基础结构。3.根据权利要求1所述的方法,其特征在于,根据所述服务器返回的渲染数据对所述页面基础结构进行渲染包括:所述页面配置信息中还包含初始渲染数据,根据所述服务器返回的初始渲染数据对所述页面基础结构中的各组件进行初始化渲染,得到初始渲染页面;根据所述服务器返回的二次渲染数据对所述初始渲染页面进行二次渲染。4.根据权利要求3所述的方法,其特征在于,根据所述服务器返回的二次渲染数据对所述初始渲染页面进行二次渲染包括:根据组件的触发事件向服务器发送第二请求消息,以使所述服务器根据所述第二请求消息向客户端返回二渲染数据;根据所述服务器返回的二次渲染数据对所述初始渲染页面进行二次渲染。5.根据权利要求3或4所述的方法,其特征在于,所述二次渲染数据包括以下任意一种:返回的数据、数据渲染的位置和页面渲染行为。6.一种网页渲染方法,其特征在于,包括:接收客户端发送的第一请求消息;根据所述第一请求消息向所述客户端返回预先存储的页面配置信息,所述页面配置信息中包含预先根据所述待显示页面的结构特征抽象出的组件信息,以使所述客户端根据所述组件信息进行页面结构布局,生成页面基础结构;向所述客户端返回渲染数据,以使所述客户端根据所述渲染数据对所述页面基础结构进行渲染。7.根据权利要求6所述的方法,其特征在于,向所述客户端返回渲染数据,以使所述客户端根据所述渲染数据对所述页面基础结构进行渲染包括:所述页面配置信息中还包含初始渲染数据,以使所述客户端根据所述初始渲染数据对所述页面基础结构中的各组件进行初始化渲染,得到初始渲染页面;向所述客户端返回二次渲染数据,以使所述客户端所述二次渲染数据对所述初始渲染页面进行二次渲染。8.根据权利要求7所述的方法,其特征在于,向所述客户端返回二次渲染数据包括:接收所述客户端根据组件的触发事件发送的第二请求消息;根据所述第二请求消息向所述客户端返回二渲染数据。9.根据权利要求7或8所述的方法,其特征在于,所述二次渲染数据包括以下任意一种:返回的数据、数据渲染的位置和页面渲染行为。10.一种网页渲染装置,其特征在于,包括:消息发送模块,用于向服务器发送第一请求消息,以使所述服务器根据所述第一请求消息向所述客户端返回预先存储的页面配置信息,所述页面配置信息中包含预先根据所述待显示页面的结构特征抽象出的组件信息;页面生成模块,用于根据所述组件信息进行页面结构布局,生成页面基础结构;页面渲染模块,用于根据所述服务器返回的渲染数据对所述页面基础结构进行渲染。11...

【专利技术属性】
技术研发人员:张少南梁永清梁栋
申请(专利权)人:百度在线网络技术北京有限公司
类型:发明
国别省市:北京,11

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

1