CN109902247A - 一种页面渲染的方法、装置及电子设备 - Google Patents
一种页面渲染的方法、装置及电子设备 Download PDFInfo
- Publication number
- CN109902247A CN109902247A CN201910113633.6A CN201910113633A CN109902247A CN 109902247 A CN109902247 A CN 109902247A CN 201910113633 A CN201910113633 A CN 201910113633A CN 109902247 A CN109902247 A CN 109902247A
- Authority
- CN
- China
- Prior art keywords
- page
- accessed
- rendering
- configuration file
- file
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
- 238000009877 rendering Methods 0.000 title claims abstract description 222
- 238000000034 method Methods 0.000 title claims abstract description 44
- 239000003638 chemical reducing agent Substances 0.000 claims description 35
- 238000004891 communication Methods 0.000 claims description 19
- 238000004806 packaging method and process Methods 0.000 claims description 13
- 238000004590 computer program Methods 0.000 claims description 12
- 238000012856 packing Methods 0.000 claims description 11
- 230000006870 function Effects 0.000 claims description 7
- 230000006698 induction Effects 0.000 claims description 6
- 238000012545 processing Methods 0.000 claims description 5
- 238000013461 design Methods 0.000 abstract description 2
- 230000008569 process Effects 0.000 description 6
- 230000007774 longterm Effects 0.000 description 5
- 238000012423 maintenance Methods 0.000 description 5
- 238000012360 testing method Methods 0.000 description 4
- 230000009471 action Effects 0.000 description 3
- 238000010586 diagram Methods 0.000 description 3
- 238000013500 data storage Methods 0.000 description 1
- 238000011161 development Methods 0.000 description 1
- 239000000835 fiber Substances 0.000 description 1
- 230000006872 improvement Effects 0.000 description 1
- 230000003993 interaction Effects 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 238000005457 optimization Methods 0.000 description 1
- 230000002093 peripheral effect Effects 0.000 description 1
- 239000004065 semiconductor Substances 0.000 description 1
- 239000007787 solid Substances 0.000 description 1
Landscapes
- Information Transfer Between Computers (AREA)
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
Abstract
本发明实施例提供了一种页面渲染的方法、装置及电子设备,涉及网站应用框架设计技术领域,可以准确地采用合适的渲染方式对网站终端的页面进行渲染,本申请的实施例包括:接收终端发送的页面访问请求消息,然后从预配置路由表中获取待访问页面的页面地址对应的配置文件格式,再根据待访问页面的页面地址对应的配置文件格式确定待访问页面的渲染方式,接着根据确定的渲染方式渲染待访问页面。
Description
技术领域
本发明涉及网站应用框架设计技术领域,特别是涉及一种页面渲染的方法、装置及电子设备。
背景技术
现有的页面渲染方式包括浏览器端渲染和服务端渲染,分别适用于不同的开发与业务场景。浏览器端渲染是指由浏览器将数据渲染为页面,经浏览器渲染得到的页面较为简单,源代码较少,所以实现过程较为简单,但对于通过浏览器端渲染方式得到的页面,搜索引擎通过爬虫方法获取页面信息时,获取到的关键词较少,所以SEO(Search EngineOptimization,搜索引擎优化)不友好。服务端渲染是指先由服务器进行一部分渲染,将渲染结果发送给浏览器,再由浏览器进行一部分渲染,对于通过服务端渲染方式得到的页面,搜索引擎通过爬虫方法获取页面信息时,获取到的关键词较多,所以SEO较为友好,然而实现服务器渲染的编码较为复杂,页面源代码较多。由此可见,服务端渲染适用于页面内容较为复杂,需要长期维护的页面,浏览器端渲染适用于页面内容较为简单,不需要持续维护的页面。
而现有的一个网站的应用框架默认使用一种渲染方式,若使用的渲染方式为浏览器端渲染,则对于该网站中需要长期维护的页面而言,会导致SEO不友好,使得网站收益较低;如使用的渲染方式为服务端渲染,则对于该网站中不需要长期维护的页面而言,则渲染该页面时的编码较为复杂,消耗时间较长,可见无法准确地采用合适的渲染方式对网站中的页面进行渲染。
发明内容
本发明实施例的目的在于提供一种页面渲染的方法、装置及电子设备,用以解决现有技术中无法准确地采用合适的渲染方式对网站终端的页面进行渲染。具体技术方案如下:
第一方面,提供了一种页面渲染的方法,其特征在于,所述方法包括:
接收终端发送的页面访问请求消息,所述页面访问请求消息中包括待访问页面的页面地址;
从预配置路由表中获取所述待访问页面的页面地址对应的配置文件格式,所述预配置路由表中存储了网站中的各页面的页面地址与配置文件路径的一一对应关系,所述配置文件路径中包括配置文件格式,所述配置文件格式用于区分页面特征;
根据所述待访问页面的页面地址对应的配置文件格式确定所述待访问页面的渲染方式,所述渲染方式包括浏览器端渲染和服务端渲染;
根据确定的渲染方式渲染所述待访问页面。
可选的,所述根据所述待访问页面的页面地址对应的配置文件格式确定所述待访问页面的渲染方式,包括:
若所述待访问页面的页面地址对应的配置文件格式为超级文本标记语言HTML,则确定所述待访问页面的渲染方式为浏览器端渲染;
若所述待访问页面的页面地址对应的配置文件格式为脚本语言JS,则确定所述待访问页面的渲染方式为服务端渲染。
可选的,在接收终端发送的页面访问请求消息之前,所述方法还包括:
将所述预配置路由表中的格式为HTML的每个配置文件对应的根组件分别打包为一个JS文件,分别将每个JS文件的路径插入各自对应的配置文件中;
将所述预配置路由表中的格式为JS的每个配置文件对应的根组件打包为一个JS文件,分别将每个JS文件的路径存放在各自对应的临时文件中。
可选的,所述根据确定的渲染方式渲染所述待访问页面,包括:
若确定的渲染方式为浏览器端渲染,则向浏览器发送所述待访问页面的页面地址对应的配置文件,以使得所述浏览器根据所述待访问页面的页面地址对应的配置文件和所述待访问页面的页面地址对应的配置文件中JS文件的路径对所述待访问页面进行页面渲染。
可选的,所述根据确定的渲染方式渲染所述待访问页面,包括:
若确定的渲染方式为服务端渲染,则根据所述待访问页面对应的临时文件中的JS文件的路径,更新所述待访问页面的页面地址对应的配置文件;或者,
若确定的渲染方式为服务端渲染,且首屏数据中不包括归纳函数reducer数据,则根据所述待访问页面对应的临时文件中的JS文件的路径和所述首屏数据,更新所述待访问页面的页面地址对应的配置文件;或者,
若确定的渲染方式为服务端渲染,且首屏数据中包括reducer数据,则根据所述待访问页面对应的临时文件中的JS文件的路径、所述首屏数据和包含所述reducer数据的应用数据流框架redux组件,更新所述待访问页面的页面地址对应的配置文件;
将更新后得到的所述待访问页面的配置文件发送至浏览器,以使得所述浏览器根据所述更新后得到的所述待访问页面的配置文件对所述待访问页面进行页面渲染。
第二方面,提供了一种页面渲染的装置,其特征在于,所述装置包括:
接收模块,用于接收终端发送的页面访问请求消息,所述页面访问请求消息中包括待访问页面的页面地址;
获取模块,用于从预配置路由表中获取所述待访问页面的页面地址对应的配置文件格式,所述预配置路由表中存储了网站中的各页面的页面地址与配置文件路径的一一对应关系,所述配置文件路径中包括配置文件格式,所述配置文件格式用于区分页面特征;
确定模块,用于根据所述获取模块获取的所述待访问页面的页面地址对应的配置文件格式确定所述待访问页面的渲染方式,所述渲染方式包括浏览器端渲染和服务端渲染;
渲染模块,用于根据所述确定模块确定的渲染方式渲染所述待访问页面。
可选的,所述确定模块,具体用于若所述待访问页面的页面地址对应的配置文件格式为超级文本标记语言HTML,则确定所述待访问页面的渲染方式为浏览器端渲染;若所述待访问页面的页面地址对应的配置文件格式为脚本语言JS,则确定所述待访问页面的渲染方式为服务端渲染。
可选的,所述装置还包括:第一打包模块和第二打包模块;
所述第一打包模块,用于将所述预配置路由表中的格式为HTML的每个配置文件对应的根组件分别打包为一个JS文件,分别将每个JS文件的路径插入各自对应的配置文件中;
所述第二打包模块,用于将所述预配置路由表中的格式为JS的每个配置文件对应的根组件打包为一个JS文件,分别将每个JS文件的路径存放在各自对应的临时文件中。
可选的,所述渲染模块,具体用于若确定的渲染方式为浏览器端渲染,则向浏览器发送所述待访问页面的页面地址对应的配置文件,以使得所述浏览器根据所述待访问页面的页面地址对应的配置文件和所述待访问页面的页面地址对应的配置文件中JS文件的路径对所述待访问页面进行页面渲染。
可选的,所述渲染模块,具体用于:
若确定的渲染方式为服务端渲染,则根据所述待访问页面对应的临时文件中的JS文件的路径,更新所述待访问页面的页面地址对应的配置文件;或者,
若确定的渲染方式为服务端渲染,且首屏数据中不包括归纳函数reducer数据,则根据所述待访问页面对应的临时文件中的JS文件的路径和所述首屏数据,更新所述待访问页面的页面地址对应的配置文件;或者,
若确定的渲染方式为服务端渲染,且首屏数据中包括reducer数据,则根据所述待访问页面对应的临时文件中的JS文件的路径、所述首屏数据和包含所述reducer数据的应用数据流框架redux组件,更新所述待访问页面的页面地址对应的配置文件;
将更新后得到的所述待访问页面的配置文件发送至浏览器,以使得所述浏览器根据所述更新后得到的所述待访问页面的配置文件对所述待访问页面进行页面渲染。
第三方面,提供了一种电子设备,其特征在于,包括处理器、通信接口、存储器和通信总线,其中,处理器,通信接口,存储器通过通信总线完成相互间的通信;
存储器,用于存放计算机程序;
处理器,用于执行存储器上所存放的程序时,实现上述任一页面渲染方法的步骤。
第四方面,本发明实施例还提供了一种计算机可读存储介质,所述计算机可读存储介质内存储有计算机程序,所述计算机程序被处理器执行时实现上述任一页面渲染方法的步骤。
第五方面,本发明实施例还提供了一种包含指令的计算机程序产品,当其在计算机上运行时,使得计算机执行上述任一页面渲染方法。
本发明实施例提供的页面渲染的方法、装置及电子设备,可以接收终端发送的页面访问请求,再从预配置路由表中获取待访问页面的页面地址对应的配置文件格式,然后根据待访问页面的页面地址对应的配置文件格式确定待访问页面的渲染方式,接着根据确定的渲染方式渲染待访问页面。这样,由于路由表中每个待访问页面都有对应的配置文件,且配置文件格式可以预先根据待访问页面适合的渲染方式设置,所以根据各个待访问页面对应的配置文件格式,服务器可以确定各个待访问页面的页面渲染方式,实现了准确地采用合适的渲染方式对网站终端的页面进行渲染。
当然,实施本发明的任一产品或方法并不一定需要同时达到以上所述的所有优点。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍。
图1为本发明实施例提供的一种页面渲染系统结构示意图;
图2为本发明实施例提供的一种页面渲染的方法流程图;
图3为本发明实施例提供的另一种页面渲染的方法流程图;
图4为本发明实施例提供的一种页面渲染的装置结构示意图;
图5为本发明实施例提供的一种电子设备的结构示意图。
具体实施方式
下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行描述。
本发明实施例提供的页面渲染的方法可以应用于图1所示的页面渲染系统中,该系统包括服务器和安装有浏览器的终端。终端可以与服务器通信,终端与服务器之间的连接可以为无线连接。图1中终端与服务器之间的连接以WiFi(Wireless-Fidelity,无线保真)连接为例。
其中,本申请实施例中的终端可以为安装有浏览器的计算机、手机、平板电脑或其它电子设备。终端用于向服务器发送页面访问请求消息,以及根据服务器发送的页面渲染反馈消息对终端请求的页面进行页面渲染。
服务器用于接收终端发送的页面访问请求消息,以及将终端请求的页面的页面渲染反馈消息发送给终端。
结合图1,本发明实施例提供的一种页面渲染的方法,应用于服务器,如图2所示,包括如下步骤:
步骤201,接收终端发送的页面访问请求消息。
其中,页面访问请求消息中包括待访问页面的URL(Uniform Resource Locator,统一资源定位符)地址。
步骤202,从预配置路由表中获取待访问页面的页面地址对应的配置文件格式。
其中,预配置路由表中存储了网站中的各页面的页面地址与配置文件路径的一一对应关系,配置文件路径中包括配置文件的名称,可根据配置文件的名称中的扩展名来确定配置文件格式。
示例性地,预配置的路由表可以如表1所示。
表1
页面地址 | 配置文件路径 |
game.iqiyi.com/demo | demo/template.js |
iqiyi.com/test | test/dest/template.html |
例如,在表1中,待访问页面的地址“game.iqiyi.com/demo”对应的配置文件的路径为“demo/template.js”,可见该配置文件的名称为“template.js”,扩展名为“.js”,所以确定该配置文件的格式为JS(javascript,脚本语言)格式;待访问页面的地址“iqiyi.com/test”对应的配置文件的路径为“test/dest/template.html”,可见该配置文件的名称为“template.html”,扩展名为“.html”,所以确定该配置文件的格式为HTML(HyperTextMarkup Language,超级文本标记语言)格式。
一种实现方式中,路由表可以由人工配置,也可以由服务器通过获取网站中各页面的页面地址以及配置文件的路径后,自动生成。在配置路由表的过程中,可以通过配置文件的格式来区分不同特征的页面。
示例性的,若网站中页面的页面特性为需要长期维护,则可以为其配置JS格式的配置文件,例如该配置文件的名称可以为template.js;若网站中页面的页面特性为不需要长期维护,则可以为其配置HTML格式的配置文件,例如该配置文件的名称可以为template.html。其中,template.js文件为JS格式的空白页面模板,template.html文件为HTML格式的空白页面模板。
步骤203,根据待访问页面的页面地址对应的配置文件格式确定待访问页面的渲染方式。
其中,渲染方式包括浏览器端渲染和服务端渲染。
一种实现方式中,若待访问页面的页面地址对应的配置文件格式为HTML,则确定待访问页面的渲染方式为浏览器端渲染;若待访问页面的页面地址对应的配置文件格式为JS,则确定待访问页面的渲染方式为服务端渲染。
步骤204,根据确定的渲染方式渲染待访问页面。
一种实现方式中,若确定的渲染方式为浏览器端渲染,则由终端中的浏览器对待访问页面进行页面渲染;若确定的渲染方式为服务端渲染,则先由服务器对待访问页面进行页面渲染,再将页面渲染反馈消息发送至终端,由终端中的浏览器根据页面渲染反馈消息继续对待访问页面进行页面渲染。
可见,本发明实施例提供的页面渲染的方法,可以接收终端发送的页面访问请求,再从预配置路由表中获取待访问页面的页面地址对应的配置文件格式,然后根据待访问页面的页面地址对应的配置文件格式确定待访问页面的渲染方式,接着根据确定的渲染方式渲染待访问页面。这样,由于路由表中每个待访问页面都有对应的配置文件,且配置文件格式可以预先根据待访问页面适合的渲染方式设置,所以根据各个待访问页面对应的配置文件格式,服务器可以确定各个待访问页面的页面渲染方式,实现了准确地采用合适的渲染方式对网站终端的页面进行渲染。
进一步的,在步骤201之前,还需要预先打包网站中各个网页的根组件,参见图3,图3为本发明实施例提供的另一种页面渲染的方法流程图,应用于服务器,包括步骤301至步骤308。
步骤301,将预配置路由表中的格式为HTML的每个配置文件对应的根组件分别打包为一个JS文件,分别将每个JS文件的路径插入各自对应的配置文件中。
一种实现方式中,可以按照JS类库react编码方式编写网站中各页面的业务代码,然后将各业务代码的react根组件分别打包为文件名为index.js的文件,并分别将各个index.js文件的路径插入各自对应的配置文件template.html中。
其中,根组件为人工根据页面内容编写的业务代码的路径。
步骤302,将预配置路由表中的格式为JS的每个配置文件对应的根组件打包为一个JS文件,分别将每个JS文件的路径存放在各自对应的临时文件中。
一种实现方式中,可以按照react编码方式编写网站中各页面的业务代码,然后将各业务代码的react根组件分别打包为文件名为index.js的文件,并分别将每个index.js文件的路径存放在各自对应的临时文件中。
其中,步骤303至步骤305与步骤201至步骤203相同,可参考上述步骤201至步骤203中的相关描述,在此不再赘述。
在步骤203之后,若确定的渲染方式为浏览器端渲染,则执行步骤306,若确定的渲染方式为服务端渲染,则执行步骤307至308。
步骤306,若确定的渲染方式为浏览器端渲染,则服务器向浏览器发送待访问页面的页面地址对应的配置文件。
其中,在浏览器收到服务器发送的待访问页面的页面地址对应的配置文件后,则由浏览器根据待访问页面的页面地址对应的配置文件和待访问页面的页面地址对应的配置文件中JS文件的路径对待访问页面进行页面渲染。
一种实现方式中,若确定的渲染方式为浏览器端渲染,则服务器将待访问页面的配置文件发送给终端,由终端中的浏览器对待访问页面进行渲染。
可选的,浏览器在收到待访问页面对应的配置文件后,根据配置文件中的JS文件的路径,获取待访问页面的react根组件。然后将react根组件由react对象格式转换为HTML格式,并根据HTML格式的react根组件确定待访问页面的页面信息(包括待访问页面的页面内容),再根据待访问页面的页面信息渲染待访问页面。
步骤307,若确定的渲染方式为服务端渲染,且首屏数据中包括归纳函数reducer数据,则根据待访问页面对应的临时文件中的JS文件的路径、首屏数据和包含reducer数据的应用数据流框架redux组件,更新待访问页面的页面地址对应的配置文件。
在本发明实施例中,服务器在渲染待访问页面后,得到的是至少插入了待访问页面对应的临时文件中的JS文件的路径的配置文件。若服务器中提供了首屏数据接口,则将首屏数据也插入配置文件中;若首屏数据中包括reducer数据,则将包含reducer数据的应用数据流框架redux组件也插入配置文件中。
一种实现方式中,若确定的渲染方式为服务端渲染,则判断服务器中是否提供了首屏数据接口。
若未提供首屏数据接口,则服务器将存放在临时文件中待访问页面对应的JS文件的路径插入待访问页面对应的配置文件中,并将插入了JS文件的路径的待访问页面对应的配置文件的格式转换为HTML格式,然后将转换为HTML格式的配置文件发送给终端,终端中的浏览器根据转换为HTML格式的配置文件对待访问页面进行页面渲染。
若提供了首屏数据接口,则由服务器的节点node.js端向服务器的另一端请求首屏数据,并判断获取到的首屏数据中是否包括reducer数据。
其中,服务器的另一端为首屏数据的提供方,例如程序语言JAVA服务或PHP(PHP:Hypertext Preprocessor,超文本预处理器)服务,首屏数据提供方收到首屏数据请求后,会从数据库中获取首屏数据,并将首屏数据发送至服务器的node.js端。
若首屏数据中不包括reducer数据,则服务器将首屏数据与react根节点通过API(Application Programming Interface,应用程序编程接口)组合后生成一个DOM(文档对象模型,Document Object Model)格式的字符串,并将DOM格式的字符串和存放在临时文件中配置文件对应的JS文件的路径插入待访问页面对应的配置文件template.js中,并将插入了DOM格式的字符串和JS文件的路径的待访问页面对应的配置文件的格式转换为HTML格式,再将转换为HTML格式的配置文件发送给终端,然后终端中安装的浏览器根据转换为HTML格式的配置文件对待访问页面进行页面渲染。
若首屏数据中包括reducer数据,则服务器将首屏数据、包含reducer数据的redux组件和react根节点通过API组合后生成一个DOM格式的字符串,并将DOM格式的字符串和存放在临时文件中待访问文件对应的JS文件的路径插入待访问页面对应的配置文件template.js中,并将插入了DOM格式的字符串和JS文件的路径的待访问页面对应的配置文件的格式转换为HTML格式,再将转换为HTML格式的配置文件发送给终端,然后终端中安装的浏览器根据转换为HTML格式的配置文件对待访问页面进行页面渲染。
其中,若应用程序框架中若包括“preState(前状态)”字符串,则表示服务器中提供了首屏数据接口。若首屏数据中包括“reducer”字符串,则表示获取到的首屏数据中包括reducer数据。
步骤308,将更新后得到的待访问页面的配置文件发送至浏览器。
其中,在浏览器收到服务器发送的待访问页面的页面地址对应的配置文件后,则由浏览器根据更新后得到的待访问页面的配置文件对待访问页面进行页面渲染。
可见,应用本发明实施例,可以在网站开发时,根据预配置路由表中每个配置文件的格式,判断每个页面根组件的打包方式,以使得在上线运行时,可以根据打包结果对网站中页面进行渲染。这样,由于路由表中每个待访问页面都有对应的配置文件,且配置文件格式可以预先根据待访问页面适合的渲染方式设置,所以根据各个待访问页面对应的配置文件格式,服务器可以确定各个待访问页面的页面渲染方式,实现了准确地采用合适的渲染方式对网站终端的页面进行渲染。
另外,在确定待访问页面进行服务端渲染时,可以判断首屏数据在是否包含了reducer数据,若首屏数据中包含了reducer数据,可以根据redux组件对待访问页面的页面地址对应的配置文件进行更新,然后由浏览器根据更新后的待访问页面的页面地址对应的配置文件进行页面渲染。这样,由于redux组件适用于用户使用方式复杂、不同身份用户有不同的使用方式或终端需要与服务器大量交互的页面,可见,本发明实施例进行服务端渲染时,更适合需要长期维护的页面。
对应于上述方法实施例,如图4所示,本发明实施例提供一种页面渲染装置,应用于服务器,该装置包括:
接收模块401,用于接收终端发送的页面访问请求消息,页面访问请求消息中包括待访问页面的页面地址;
获取模块402,用于从预配置路由表中获取待访问页面的页面地址对应的配置文件格式,预配置路由表中存储了网站中的各页面的页面地址与配置文件路径的一一对应关系,配置文件路径中包括配置文件格式,配置文件格式用于区分页面特征;
确定模块403,用于根据获取模块获取的待访问页面的页面地址对应的配置文件格式确定待访问页面的渲染方式,渲染方式包括浏览器端渲染和服务端渲染;
渲染模块404,用于根据确定模块确定的渲染方式渲染待访问页面。
可选的,确定模块403,可以具体用于若待访问页面的页面地址对应的配置文件格式为超级文本标记语言HTML,则确定待访问页面的渲染方式为浏览器端渲染;若待访问页面的页面地址对应的配置文件格式为脚本语言JS,则确定待访问页面的渲染方式为服务端渲染。
可选的,上述装置还可以包括:第一打包模块和第二打包模块;
第一打包模块,用于将预配置路由表中的格式为HTML的每个配置文件对应的根组件分别打包为一个JS文件,分别将每个JS文件的路径插入各自对应的配置文件中;
第二打包模块,用于将预配置路由表中的格式为JS的每个配置文件对应的根组件打包为一个JS文件,分别将每个JS文件的路径存放在各自对应的临时文件中。
可选的,渲染模块404,具体用于若确定的渲染方式为浏览器端渲染,则向浏览器发送待访问页面的页面地址对应的配置文件,以使得浏览器根据待访问页面的页面地址对应的配置文件和待访问页面的页面地址对应的配置文件中JS文件的路径对待访问页面进行页面渲染。
可选的,渲染模块404,可以具体用于:
若确定的渲染方式为服务端渲染,则根据待访问页面对应的临时文件中的JS文件的路径,更新待访问页面的页面地址对应的配置文件;或者,
若确定的渲染方式为服务端渲染,且首屏数据中不包括归纳函数reducer数据,则根据待访问页面对应的临时文件中的JS文件的路径和首屏数据,更新待访问页面的页面地址对应的配置文件;或者,
若确定的渲染方式为服务端渲染,且首屏数据中包括reducer数据,则根据待访问页面对应的临时文件中的JS文件的路径、首屏数据和包含reducer数据的应用数据流框架redux组件,更新待访问页面的页面地址对应的配置文件;
将更新后得到的待访问页面的配置文件发送至浏览器,以使得浏览器根据更新后得到的待访问页面的配置文件对待访问页面进行页面渲染。
本发明实施例提供的页面渲染的装置,可以接收终端发送的页面访问请求,再从预配置路由表中获取待访问页面的页面地址对应的配置文件格式,然后根据待访问页面的页面地址对应的配置文件格式确定待访问页面的渲染方式,接着根据确定的渲染方式渲染待访问页面。这样,由于路由表中每个待访问页面都有对应的配置文件,且配置文件格式可以预先根据待访问页面适合的渲染方式设置,所以根据各个待访问页面对应的配置文件格式,服务器可以确定各个待访问页面的页面渲染方式,实现了准确地采用合适的渲染方式对网站终端的页面进行渲染。
本发明实施例还提供了一种电子设备,如图5所示,包括处理器501、通信接口502、存储器503和通信总线504,其中,处理器501,通信接口502,存储器503通过通信总线504完成相互间的通信,
存储器503,用于存放计算机程序;
处理器501,用于执行存储器503上所存放的程序时,实现上述方法实施例中由服务器执行的步骤。
上述电子设备提到的通信总线可以是外设部件互连标准(Peripheral ComponentInterconnect,PCI)总线或扩展工业标准结构(Extended Industry StandardArchitecture,EISA)总线等。该通信总线可以分为地址总线、数据总线、控制总线等。为便于表示,图中仅用一条粗线表示,但并不表示仅有一根总线或一种类型的总线。
通信接口用于上述电子设备与其他设备之间的通信。
存储器可以包括随机存取存储器(Random Access Memory,RAM),也可以包括非易失性存储器(Non-Volatile Memory,NVM),例如至少一个磁盘存储器。可选的,存储器还可以是至少一个位于远离前述处理器的存储装置。
上述的处理器可以是通用处理器,包括中央处理器(Central Processing Unit,CPU)、网络处理器(Network Processor,NP)等;还可以是数字信号处理器(Digital SignalProcessing,DSP)、专用集成电路(Application Specific Integrated Circuit,ASIC)、现场可编程门阵列(Field-Programmable Gate Array,FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件。
在本发明提供的又一实施例中,还提供了一种计算机可读存储介质,该计算机可读存储介质内存储有计算机程序,所述计算机程序被处理器执行时实现上述任一页面渲染的方法的步骤。
在本发明提供的又一实施例中,还提供了一种包含指令的计算机程序产品,当其在计算机上运行时,使得计算机执行上述实施例中任一页面渲染的方法。
在上述实施例中,可以全部或部分地通过软件、硬件、固件或者其任意组合来实现。当使用软件实现时,可以全部或部分地以计算机程序产品的形式实现。所述计算机程序产品包括一个或多个计算机指令。在计算机上加载和执行所述计算机程序指令时,全部或部分地产生按照本发明实施例所述的流程或功能。所述计算机可以是通用计算机、专用计算机、计算机网络、或者其他可编程装置。所述计算机指令可以存储在计算机可读存储介质中,或者从一个计算机可读存储介质向另一个计算机可读存储介质传输,例如,所述计算机指令可以从一个网站站点、计算机、服务器或数据中心通过有线(例如同轴电缆、光纤、数字用户线(DSL))或无线(例如红外、无线、微波等)方式向另一个网站站点、计算机、服务器或数据中心进行传输。所述计算机可读存储介质可以是计算机能够存取的任何可用介质或者是包含一个或多个可用介质集成的服务器、数据中心等数据存储设备。所述可用介质可以是磁性介质,(例如,软盘、硬盘、磁带)、光介质(例如,DVD)、或者半导体介质(例如固态硬盘Solid State Disk(SSD))等。
需要说明的是,在本文中,诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。
本说明书中的各个实施例均采用相关的方式描述,各个实施例之间相同相似的部分互相参见即可,每个实施例重点说明的都是与其他实施例的不同之处。尤其,对于装置实施例而言,由于其基本相似于方法实施例,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。
以上所述仅为本发明的较佳实施例而已,并非用于限定本发明的保护范围。凡在本发明的精神和原则之内所作的任何修改、等同替换、改进等,均包含在本发明的保护范围内。
Claims (11)
1.一种页面渲染的方法,其特征在于,所述方法包括:
接收终端发送的页面访问请求消息,所述页面访问请求消息中包括待访问页面的页面地址;
从预配置路由表中获取所述待访问页面的页面地址对应的配置文件格式,所述预配置路由表中存储了网站中的各页面的页面地址与配置文件路径的一一对应关系,所述配置文件路径中包括配置文件格式,所述配置文件格式用于区分页面特征;
根据所述待访问页面的页面地址对应的配置文件格式确定所述待访问页面的渲染方式,所述渲染方式包括浏览器端渲染和服务端渲染;
根据确定的渲染方式渲染所述待访问页面。
2.根据权利要求1所述的方法,其特征在于,所述根据所述待访问页面的页面地址对应的配置文件格式确定所述待访问页面的渲染方式,包括:
若所述待访问页面的页面地址对应的配置文件格式为超级文本标记语言HTML,则确定所述待访问页面的渲染方式为浏览器端渲染;
若所述待访问页面的页面地址对应的配置文件格式为脚本语言JS,则确定所述待访问页面的渲染方式为服务端渲染。
3.根据权利要求1或2所述的方法,其特征在于,在接收终端发送的页面访问请求消息之前,所述方法还包括:
将所述预配置路由表中的格式为HTML的每个配置文件对应的根组件分别打包为一个JS文件,分别将每个JS文件的路径插入各自对应的配置文件中;
将所述预配置路由表中的格式为JS的每个配置文件对应的根组件打包为一个JS文件,分别将每个JS文件的路径存放在各自对应的临时文件中。
4.根据权利要求3所述的方法,其特征在于,所述根据确定的渲染方式渲染所述待访问页面,包括:
若确定的渲染方式为浏览器端渲染,则向浏览器发送所述待访问页面的页面地址对应的配置文件,以使得所述浏览器根据所述待访问页面的页面地址对应的配置文件和所述待访问页面的页面地址对应的配置文件中JS文件的路径对所述待访问页面进行页面渲染。
5.根据权利要求3所述的方法,其特征在于,所述根据确定的渲染方式渲染所述待访问页面,包括:
若确定的渲染方式为服务端渲染,则根据所述待访问页面对应的临时文件中的JS文件的路径,更新所述待访问页面的页面地址对应的配置文件;或者,
若确定的渲染方式为服务端渲染,且首屏数据中不包括归纳函数reducer数据,则根据所述待访问页面对应的临时文件中的JS文件的路径和所述首屏数据,更新所述待访问页面的页面地址对应的配置文件;或者,
若确定的渲染方式为服务端渲染,且首屏数据中包括reducer数据,则根据所述待访问页面对应的临时文件中的JS文件的路径、所述首屏数据和包含所述reducer数据的应用数据流框架redux组件,更新所述待访问页面的页面地址对应的配置文件;
将更新后得到的所述待访问页面的配置文件发送至浏览器,以使得所述浏览器根据所述更新后得到的所述待访问页面的配置文件对所述待访问页面进行页面渲染。
6.一种页面渲染的装置,其特征在于,所述装置包括:
接收模块,用于接收终端发送的页面访问请求消息,所述页面访问请求消息中包括待访问页面的页面地址;
获取模块,用于从预配置路由表中获取所述待访问页面的页面地址对应的配置文件格式,所述预配置路由表中存储了网站中的各页面的页面地址与配置文件路径的一一对应关系,所述配置文件路径中包括配置文件格式,所述配置文件格式用于区分页面特征;
确定模块,用于根据所述获取模块获取的所述待访问页面的页面地址对应的配置文件格式确定所述待访问页面的渲染方式,所述渲染方式包括浏览器端渲染和服务端渲染;
渲染模块,用于根据所述确定模块确定的渲染方式渲染所述待访问页面。
7.根据权利要求6所述的装置,其特征在于,
所述确定模块,具体用于若所述待访问页面的页面地址对应的配置文件格式为超级文本标记语言HTML,则确定所述待访问页面的渲染方式为浏览器端渲染;若所述待访问页面的页面地址对应的配置文件格式为脚本语言JS,则确定所述待访问页面的渲染方式为服务端渲染。
8.根据权利要求6或7所述的装置,其特征在于,所述装置还包括:第一打包模块和第二打包模块;
所述第一打包模块,用于将所述预配置路由表中的格式为HTML的每个配置文件对应的根组件分别打包为一个JS文件,分别将每个JS文件的路径插入各自对应的配置文件中;
所述第二打包模块,用于将所述预配置路由表中的格式为JS的每个配置文件对应的根组件打包为一个JS文件,分别将每个JS文件的路径存放在各自对应的临时文件中。
9.根据权利要求8所述的装置,其特征在于,
所述渲染模块,具体用于若确定的渲染方式为浏览器端渲染,则向浏览器发送所述待访问页面的页面地址对应的配置文件,以使得所述浏览器根据所述待访问页面的页面地址对应的配置文件和所述待访问页面的页面地址对应的配置文件中JS文件的路径对所述待访问页面进行页面渲染。
10.根据权利要求8所述的装置,其特征在于,所述渲染模块,具体用于:
若确定的渲染方式为服务端渲染,则根据所述待访问页面对应的临时文件中的JS文件的路径,更新所述待访问页面的页面地址对应的配置文件;或者,
若确定的渲染方式为服务端渲染,且首屏数据中不包括归纳函数reducer数据,则根据所述待访问页面对应的临时文件中的JS文件的路径和所述首屏数据,更新所述待访问页面的页面地址对应的配置文件;或者,
若确定的渲染方式为服务端渲染,且首屏数据中包括reducer数据,则根据所述待访问页面对应的临时文件中的JS文件的路径、所述首屏数据和包含所述reducer数据的应用数据流框架redux组件,更新所述待访问页面的页面地址对应的配置文件;
将更新后得到的所述待访问页面的配置文件发送至浏览器,以使得所述浏览器根据所述更新后得到的所述待访问页面的配置文件对所述待访问页面进行页面渲染。
11.一种电子设备,其特征在于,包括处理器、通信接口、存储器和通信总线,其中,处理器,通信接口,存储器通过通信总线完成相互间的通信;
存储器,用于存放计算机程序;
处理器,用于执行存储器上所存放的程序时,实现权利要求1-5任一所述的方法步骤。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910113633.6A CN109902247B (zh) | 2019-02-14 | 2019-02-14 | 一种页面渲染的方法、装置及电子设备 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910113633.6A CN109902247B (zh) | 2019-02-14 | 2019-02-14 | 一种页面渲染的方法、装置及电子设备 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN109902247A true CN109902247A (zh) | 2019-06-18 |
CN109902247B CN109902247B (zh) | 2021-04-16 |
Family
ID=66944892
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201910113633.6A Active CN109902247B (zh) | 2019-02-14 | 2019-02-14 | 一种页面渲染的方法、装置及电子设备 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN109902247B (zh) |
Cited By (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110990731A (zh) * | 2019-10-12 | 2020-04-10 | 平安国际智慧城市科技股份有限公司 | 一种静态网页的渲染方法、装置、设备及计算机存储介质 |
CN111193878A (zh) * | 2020-01-03 | 2020-05-22 | 北京字节跳动网络技术有限公司 | 一种多媒体文本信息处理方法、装置、介质和电子设备 |
CN111651703A (zh) * | 2020-04-14 | 2020-09-11 | 北京奇艺世纪科技有限公司 | 一种页面跳转方法、装置、电子设备及可读存储介质 |
CN112115103A (zh) * | 2020-09-02 | 2020-12-22 | 北京奇艺世纪科技有限公司 | 文件地址显示方法、装置、电子设备及可读存储介质 |
CN113872809A (zh) * | 2021-09-28 | 2021-12-31 | 绿盟科技集团股份有限公司 | 访问方法、装置、电子设备和存储介质 |
CN114268828A (zh) * | 2021-12-24 | 2022-04-01 | 中国建设银行股份有限公司 | 大屏页面的处理方法、装置、设备及存储介质 |
Citations (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US8245125B1 (en) * | 2011-11-30 | 2012-08-14 | Google Inc. | Hybrid rendering for webpages |
CN103970882A (zh) * | 2014-05-19 | 2014-08-06 | 小米科技有限责任公司 | 渲染页面的方法及装置 |
US20150120919A1 (en) * | 2010-03-12 | 2015-04-30 | International Business Machines Corporation | Preferred resource selector |
CN104765844A (zh) * | 2015-04-16 | 2015-07-08 | 北京京东尚科信息技术有限公司 | 一种网站页面的生成方法和装置 |
CN106339414A (zh) * | 2016-08-12 | 2017-01-18 | 合网络技术(北京)有限公司 | 网页渲染方法及装置 |
CN106484383A (zh) * | 2015-08-31 | 2017-03-08 | 阿里巴巴集团控股有限公司 | 页面渲染方法、装置及设备 |
CN109241471A (zh) * | 2018-10-26 | 2019-01-18 | 珠海格力电器股份有限公司 | 页面渲染方法、服务器、浏览器和能源信息管理系统 |
-
2019
- 2019-02-14 CN CN201910113633.6A patent/CN109902247B/zh active Active
Patent Citations (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20150120919A1 (en) * | 2010-03-12 | 2015-04-30 | International Business Machines Corporation | Preferred resource selector |
US8245125B1 (en) * | 2011-11-30 | 2012-08-14 | Google Inc. | Hybrid rendering for webpages |
CN103970882A (zh) * | 2014-05-19 | 2014-08-06 | 小米科技有限责任公司 | 渲染页面的方法及装置 |
CN104765844A (zh) * | 2015-04-16 | 2015-07-08 | 北京京东尚科信息技术有限公司 | 一种网站页面的生成方法和装置 |
CN106484383A (zh) * | 2015-08-31 | 2017-03-08 | 阿里巴巴集团控股有限公司 | 页面渲染方法、装置及设备 |
CN106339414A (zh) * | 2016-08-12 | 2017-01-18 | 合网络技术(北京)有限公司 | 网页渲染方法及装置 |
CN109241471A (zh) * | 2018-10-26 | 2019-01-18 | 珠海格力电器股份有限公司 | 页面渲染方法、服务器、浏览器和能源信息管理系统 |
Cited By (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110990731A (zh) * | 2019-10-12 | 2020-04-10 | 平安国际智慧城市科技股份有限公司 | 一种静态网页的渲染方法、装置、设备及计算机存储介质 |
CN111193878A (zh) * | 2020-01-03 | 2020-05-22 | 北京字节跳动网络技术有限公司 | 一种多媒体文本信息处理方法、装置、介质和电子设备 |
CN111193878B (zh) * | 2020-01-03 | 2022-04-22 | 北京字节跳动网络技术有限公司 | 一种多媒体文本信息处理方法、装置、介质和电子设备 |
CN111651703A (zh) * | 2020-04-14 | 2020-09-11 | 北京奇艺世纪科技有限公司 | 一种页面跳转方法、装置、电子设备及可读存储介质 |
CN111651703B (zh) * | 2020-04-14 | 2023-06-30 | 北京奇艺世纪科技有限公司 | 一种页面跳转方法、装置、电子设备及可读存储介质 |
CN112115103A (zh) * | 2020-09-02 | 2020-12-22 | 北京奇艺世纪科技有限公司 | 文件地址显示方法、装置、电子设备及可读存储介质 |
CN112115103B (zh) * | 2020-09-02 | 2023-08-01 | 北京奇艺世纪科技有限公司 | 文件地址显示方法、装置、电子设备及可读存储介质 |
CN113872809A (zh) * | 2021-09-28 | 2021-12-31 | 绿盟科技集团股份有限公司 | 访问方法、装置、电子设备和存储介质 |
CN114268828A (zh) * | 2021-12-24 | 2022-04-01 | 中国建设银行股份有限公司 | 大屏页面的处理方法、装置、设备及存储介质 |
Also Published As
Publication number | Publication date |
---|---|
CN109902247B (zh) | 2021-04-16 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN109902247B (zh) | 一种页面渲染的方法、装置及电子设备 | |
CN104426925B (zh) | 网页资源获取方法及装置 | |
CN102124481A (zh) | 在具有广告的网页中嵌入宏 | |
CN111443920B (zh) | 一种框架迁移方法及装置 | |
CN112685211B (zh) | 一种错误信息展示方法、装置、电子设备及介质 | |
CN113778897B (zh) | 接口的自动测试方法、装置、设备及存储介质 | |
CN111858376A (zh) | 请求报文生成方法和接口测试方法 | |
CN104954363A (zh) | 用于生成接口文档的方法和装置 | |
CN107463536A (zh) | 一种实现安卓设备上在线预览服务器上文档的方法及系统 | |
CN112379965B (zh) | 沙盒文件映射系统、客户端装置、映射端装置、沙盒文件映射方法以及电子设备 | |
CN109800378A (zh) | 基于自定义浏览器的内容处理方法、装置及电子设备 | |
CN105094787B (zh) | 企业互联网应用的处理方法及装置 | |
CN112749351B (zh) | 链接地址确定方法、装置、计算机可读存储介质及设备 | |
CN111680247B (zh) | 网页字符串的本地调用方法、装置、设备及存储介质 | |
CN111414642B (zh) | 一种基于网关的链接生成方法、装置、服务器和存储介质 | |
CN113448835A (zh) | 一种静态资源测试方法、装置、电子设备及存储介质 | |
CN112115103A (zh) | 文件地址显示方法、装置、电子设备及可读存储介质 | |
CN111324832A (zh) | 一种通过短网址访问网站的方法、系统、装置及介质 | |
CN111767542A (zh) | 一种越权检测方法和装置 | |
CN111124924A (zh) | Api部署方法、装置、电子设备及存储介质 | |
CN113590985B (zh) | 页面跳转配置方法、装置、电子设备和计算机可读介质 | |
CN111338928A (zh) | 基于chrome浏览器测试的方法及装置 | |
CN111783006B (zh) | 页面的生成方法、装置、电子设备及计算机可读介质 | |
CN103885988A (zh) | 输出内容的方法及装置、内容输出系统 | |
KR101249449B1 (ko) | 웹 플랫폼 검증 도구 생성 장치 및 그 제어방법 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |