CN114238811A - 页面加载方法、页面请求响应方法、装置、设备及介质 - Google Patents
页面加载方法、页面请求响应方法、装置、设备及介质 Download PDFInfo
- Publication number
- CN114238811A CN114238811A CN202111520622.3A CN202111520622A CN114238811A CN 114238811 A CN114238811 A CN 114238811A CN 202111520622 A CN202111520622 A CN 202111520622A CN 114238811 A CN114238811 A CN 114238811A
- Authority
- CN
- China
- Prior art keywords
- page
- target
- resource
- version number
- html
- 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
- 238000011068 loading method Methods 0.000 title claims abstract description 111
- 238000000034 method Methods 0.000 title claims abstract description 85
- 230000004044 response Effects 0.000 title claims abstract description 23
- 230000003068 static effect Effects 0.000 claims description 51
- 238000004590 computer program Methods 0.000 claims description 17
- 238000009877 rendering Methods 0.000 claims description 17
- 230000008569 process Effects 0.000 claims description 15
- 230000004048 modification Effects 0.000 claims description 13
- 238000012986 modification Methods 0.000 claims description 13
- 238000004806 packaging method and process Methods 0.000 claims description 5
- 238000004891 communication Methods 0.000 description 7
- 238000010586 diagram Methods 0.000 description 3
- 238000011161 development Methods 0.000 description 2
- 230000002452 interceptive effect Effects 0.000 description 2
- 230000001360 synchronised effect Effects 0.000 description 2
- 238000005538 encapsulation Methods 0.000 description 1
- 238000005516 engineering process Methods 0.000 description 1
- 230000006870 function Effects 0.000 description 1
- 230000003993 interaction Effects 0.000 description 1
- 238000012545 processing Methods 0.000 description 1
- 238000012546 transfer Methods 0.000 description 1
- 230000001960 triggered effect Effects 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9574—Browsing optimisation, e.g. caching or content distillation of access to content, e.g. by caching
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/955—Retrieval from the web using information identifiers, e.g. uniform resource locators [URL]
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/40—Transformation of program code
- G06F8/41—Compilation
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Databases & Information Systems (AREA)
- General Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Data Mining & Analysis (AREA)
- Software Systems (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本申请涉及客户端技术领域,揭示了一种页面加载方法、页面请求响应方法、装置、设备及介质,其中方法包括:从服务端获取目标空内容HTML并加载得到目标空页面;从服务端获取目标HTML内容字符串、第一版本号和目标对象信息;根据目标对象信息生成第二版本号,并判断第一版本号和第二版本号是否相同;若相同,则在目标空页面中加载目标HTML内容字符串得到纯展示页面,在纯展示页面中加载第一动态页面资源,得到目标对象页面;若不相同,则在目标空页面中加载第二动态页面资源,得到目标对象页面。适用于前后端分离的架构模式,没有增加服务端的CPU资源及没有增加项目复杂度,适用于更加复杂、多样动态的页面的加载。
Description
技术领域
本申请涉及到客户端技术领域,特别是涉及到一种页面加载方法、页面请求响应方法、装置、设备及介质。
背景技术
动态网页要实现快速加载内容,通常需要加快页面的初始化、减少请求动态数据的时间,一般通过优化页面的资源加载、数据接口的响应时间等常规手段可以改善。而要做到极致,大型动态网站一般会考虑将动态页面静态化处理。现有的动态页面静态方案中,主要分为以下三类:
(1)采用服务端渲染的方法,也就是在前端采用服务端渲染(以下简称SSR)直出页面,在用户访问页面时,服务端在接收到HTML(超文本标记语言)请求时,先请求动态页面资源进行页面组装,组装完成后一并将携带内容的HTML返回至客户端;在服务端渲染完整的应用程序,会比仅仅提供静态文件的服务端占用更多的CPU资源,同时也会增加项目复杂度。
(2)采用页面预渲染的方法,在采用前端框架的项目中可用,通常是在编译阶段调用无头浏览器的方式提前获取好页面内容,保存后发布到线上,做到完全静态,这种方法适合偏静态的页面,不适合需要获取页面链接动态参数去请求内容的场景,比如,根据访问链接中的产品标识去获取不同的产品页面内容。
发明内容
本申请的主要目的为提供一种页面加载方法、页面请求响应方法、装置、设备及介质,旨在解决现有技术在将动态页面静态化处理时,服务端渲染的方法增加了占用的CPU资源及增加项目复杂度,在页面预渲染的方法,适合偏静态的页面的技术问题。
为了实现上述发明目的,本申请提出一种页面加载方法,所述方法包括:
获取页面访问请求,所述页面访问请求携带有目标URL地址;
根据所述目标URL地址,从服务端获取目标空内容HTML,对所述目标空内容HTML进行加载,得到目标空页面;
根据所述目标URL地址,从所述服务端获取目标HTML内容字符串、第一版本号和目标对象信息;
根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同;
若相同,则在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,根据所述目标URL地址,从所述服务端获取第一动态页面资源,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面;
若不相同,则根据所述目标URL地址,从所述服务端获取第二动态页面资源,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
进一步的,所述根据所述目标URL地址,从所述服务端获取目标HTML内容字符串、第一版本号和目标对象信息的步骤,包括:
根据所述目标URL地址中的对象标识,向所述服务端发送静态资源下载请求;
获取所述服务端根据所述静态资源下载请求发送的所述目标HTML内容字符串、所述第一版本号和所述目标对象信息,其中,所述服务端用于对所述静态资源下载请求进行对象标识解析,得到待查询对象标识,从预设的后端资源库中获取与所述待查询对象标识对应的目标页面关联数据,根据所述目标页面关联数据和所述静态资源下载请求发送所述目标HTML内容字符串、所述第一版本号和所述目标对象信息。
进一步的,所述根据所述目标对象信息生成第二版本号的步骤,包括:
采用MD5方法,对所述目标对象信息进行加密,将加密生成的哈希值作为所述第二版本号。
进一步的,所述在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面的步骤,包括:
根据所述第一动态页面资源,在所述纯展示页面中分别进行前端框架初始化和页面挂载,得到所述目标对象页面。
本申请还提出了一种页面请求响应方法,所述方法包括:
获取客户端根据目标URL地址发送的空内容HTML下载请求;
根据所述空内容HTML下载请求,从预设的空内容HTML库中查询空内容HTML作为目标空内容HTML,将所述目标空内容HTML发送给所述客户端;
获取所述客户端根据所述目标URL地址发送的静态资源下载请求;
根据所述静态资源下载请求,从预设的后端资源库中查询页面关联数据作为目标页面关联数据,根据所述目标页面关联数据向所述客户端发送目标HTML内容字符串、第一版本号和目标对象信息;
获取所述客户端根据所述目标URL地址发送的第一下载请求;
根据所述第一下载请求,从预设的动态页面资源库中查询动态页面资源作为第一动态页面资源,将所述第一动态页面资源发送给所述客户端;
获取所述客户端根据所述目标URL地址发送的第二下载请求;
根据所述第二下载请求,从所述动态页面资源库中查询动态页面资源作为第二动态页面资源,将所述第二动态页面资源发送给所述客户端;
其中,所述客户端用于:对所述目标空内容HTML进行加载,得到目标空页面,根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同,若相同,在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面,若不相同,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
进一步的,所述获取所述客户端根据所述目标URL地址发送的静态资源下载请求的步骤之前,还包括:
调用预设的前端框架项目获取webpack编译请求,所述webpack编译请求携带有待存储的对象标识;
响应所述webpack编译请求以调用webpack编译工具,从所述前端框架项目中获取与所述待存储的对象标识对应的目标编译对象,对所述目标编译对象进行webpack编译;
在对所述目标编译对象进行webpack编译的过程中调用SSR应用,其中,所述SSR应用用于获取所述目标编译对象中的动态页面资源作为待渲染动态页面资源,对所述待渲染动态页面资源进行页面渲染,得到待打包的页面;
获取所述SSR应用发送的所述待打包的页面;
根据所述待打包的页面生成HTML内容字符串,得到待存储的HTML内容字符串;
采用MD5方法,对所述待渲染动态页面资源中的对象信息进行加密,将加密生成的哈希值作为待存储的版本号;
将所述待渲染动态页面资源中的对象信息、所述待存储的对象标识、所述待存储的HTML内容字符串和所述待存储的版本号作为待存储的页面关联数据;
将所述待存储的页面关联数据存储到所述后端资源库中。
进一步的,所述获取所述客户端根据所述目标URL地址发送的静态资源下载请求的步骤之前,还包括:
通过Node服务,获取产品配置修改请求,其中,所述产品配置修改请求携带有待更新的对象标识;
通过所述Node服务,根据所述待更新的对象标识获取前端框架项目源代码包;
通过所述Node服务,执行前端框架项目打包命令以用于调用所述webpack编译工具对所述前端框架项目源代码包进行webpack编译;
通过所述Node服务,在对所述前端框架项目源代码包进行webpack编译的过程中调用所述SSR应用,其中,所述SSR应用用于获取所述前端框架项目源代码包中的动态页面资源作为待加载动态页面资源,对所述待加载动态页面资源进行页面渲染,得到待处理的页面;
通过所述Node服务,获取所述SSR应用发送的所述待处理的页面;
通过所述Node服务,根据所述待处理的页面生成HTML内容字符串,得到待更新的HTML内容字符串;
通过所述Node服务,采用MD5方法,对所述前端框架项目源代码包中的对象信息进行加密,将加密生成的哈希值作为待更新的版本号;
通过所述Node服务,将所述前端框架项目源代码包中的对象信息、所述待更新的对象标识、所述待更新的HTML内容字符串和所述待更新的版本号作为待更新的页面关联数据;
通过所述Node服务,将所述待更新的页面关联数据,对所述后端资源库中的与所述待更新的对象标识对应的所述页面关联数据进行替换。
本申请还提出了一种页面加载装置,所述装置包括:
请求获取模块,用于获取页面访问请求,所述页面访问请求携带有目标URL地址;
目标空页面确定模块,用于根据所述目标URL地址,从服务端获取目标空内容HTML,对所述目标空内容HTML进行加载,得到目标空页面;
数据获取模块,用于根据所述目标URL地址,从所述服务端获取目标HTML内容字符串、第一版本号和目标对象信息;
判断模块,用于根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同;
第一对象页面确定模块,用于若相同,则在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,根据所述目标URL地址,从所述服务端获取第一动态页面资源,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面;
第二对象页面确定模块,用于若不相同,则根据所述目标URL地址,从所述服务端获取第二动态页面资源,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
本申请还提出了一种计算机设备,包括存储器和处理器,所述存储器存储有计算机程序,所述处理器执行所述计算机程序时实现上述任一项所述方法的步骤。
本申请还提出了一种计算机可读存储介质,其上存储有计算机程序,所述计算机程序被处理器执行时实现上述任一项所述的方法的步骤。
本申请的页面加载方法、页面请求响应方法、装置、设备及介质,其中页面加载方法通过在第一版本号和第二版本号相同时展示纯展示页面,实现了更快速的呈现页面,减少了页面初始化的白屏时间,提升了用户侧的产品体验,适用于前后端分离的架构模式,没有增加服务端的CPU资源及没有增加项目复杂度;通过在第一版本号和第二版本号相同时在纯展示页面中加载第一动态页面资源得到目标对象页面,在第一版本号和第二版本号不相同时在目标空页面中加载第二动态页面资源得到目标对象页面,从而使本申请同样适用于更加复杂、多样动态的页面的加载。
附图说明
图1为本申请一实施例的页面加载方法的流程示意图;
图2为本申请一实施例的页面请求响应方法的流程示意图;
图3为本申请一实施例的页面加载装置的结构示意框图;
图4为本申请一实施例的页面请求响应装置的结构示意框图;
图5为本申请一实施例的计算机设备的结构示意框图。
本申请目的的实现、功能特点及优点将结合实施例,参照附图做进一步说明。
具体实施方式
为了使本申请的目的、技术方案及优点更加清楚明白,以下结合附图及实施例,对本申请进行进一步详细说明。应当理解,此处描述的具体实施例仅仅用以解释本申请,并不用于限定本申请。
参照图1,本申请实施例中提供一种页面加载方法,所述方法包括:
S1:获取页面访问请求,所述页面访问请求携带有目标URL地址;
S2:根据所述目标URL地址,从服务端获取目标空内容HTML,对所述目标空内容HTML进行加载,得到目标空页面;
S3:根据所述目标URL地址,从所述服务端获取目标HTML内容字符串、第一版本号和目标对象信息;
S4:根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同;
S5:若相同,则在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,根据所述目标URL地址,从所述服务端获取第一动态页面资源,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面;
S6:若不相同,则根据所述目标URL地址,从所述服务端获取第二动态页面资源,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
本实施例通过在第一版本号和第二版本号相同时展示纯展示页面,实现了更快速的呈现页面,减少了页面初始化的白屏时间,提升了用户侧的产品体验,适用于前后端分离的架构模式,没有增加服务端的CPU资源及没有增加项目复杂度;通过在第一版本号和第二版本号相同时在纯展示页面中加载第一动态页面资源得到目标对象页面,在第一版本号和第二版本号不相同时在目标空页面中加载第二动态页面资源得到目标对象页面,从而使本申请同样适用于更加复杂、多样动态的页面的加载。
对于S1,在客户端中,获取用户输入的页面访问请求。
客户端包括:移动设备的终端、移动设备的浏览器、个人电脑的终端、个人电脑端的浏览器。
页面访问请求,是访问产品页面的请求。
目标URL(统一资源定位器)地址,是页面访问请求想要访问的页面的URL地址。
可以理解的是,目标URL地址中携带有对象标识。
对象标识是对象ID,用于唯一标识一个对象。对象可以是实物类产品,也可以是服务类产品。对象还可以是其他的事物。
对于S2,根据目标URL地址生成空内容HTML下载请求,将空内容HTML下载请求发送给服务端,获取服务端根据空内容HTML下载请求发送的目标空内容HTML,并且对获取到的所述目标空内容HTML进行页面加载,将加载得到的页面作为目标空页面。
目标空内容HTML,也就是目标URL地址对应的空内容HTML。空内容HTML是不包含对象信息的页面的数据包。
目标空页面,是通用的展示对象的框架页面,不包含具体的对象信息,也不可以交互。
对于S3,根据所述目标URL地址发送的静态资源下载请求;将所述静态资源下载请求发送给服务端;获取所述服务端根据所述静态资源下载请求发送的所述目标HTML内容字符串、所述第一版本号和所述目标对象信息。
所述第一版本号,是根据所述目标HTML内容字符串中的对象信息生成的版本号。
目标HTML内容字符串,也就是与所述目标URL地址中的对象标识对应的HTML内容字符串。HTML内容字符串包括页面结构和UI展示的代码,不包括需要交互才能触发的页面事件的内容。
目标对象信息,是与所述目标URL地址中的对象标识对应的对象的对象信息。对象信息,是采用对象描述规范对对象进行描述得到的信息。目标对象信息与所述目标HTML内容字符串对应的对象信息可以相同,也可以不相同。
其中,当对象信息更新时,在更新的对象信息对应的HTML内容字符串更新之前,先将更新的对象信息和与更新的对象信息对应的对象标识上传到服务端,此时所述服务端根据所述静态资源下载请求发送的所述目标HTML内容字符串对应的对象信息和所述目标对象信息不相同;在更新的对象信息对应的HTML内容字符串完成更新之后,所述静态资源下载请求发送的所述目标HTML内容字符串对应的对象信息和所述目标对象信息相同。
对于S4,采用预设的版本号生成规则,根据所述目标对象信息生成版本号,将生成的版本号作为第二版本号。
可以理解的是,第二版本号和第一版本号的版本号生成规则相同。
并判断所述第一版本号和所述第二版本号是否相同,若相同,则意味着目标HTML内容字符串是最新版本,若不相同,则意味着目标HTML内容字符串不是最新版本。
对于S5,若相同,也就是所述第一版本号和所述第二版本号相同,此时意味着目标HTML内容字符串是最新的版本,因此需要对目标HTML内容字符串进行加载,在所述目标空页面中加载所述目标HTML内容字符串,将加载完成的页面作为纯展示页面。
纯展示页面外观看起来跟目标对象页面相同,但是仅用于展示,不能进行交互操作。
目标对象页面,是加载了页面所有内容的页面,外观与纯展示页面相同,并且可以进行交互操作。
其中,根据所述目标URL地址,向所述服务端发送第一下载请求;获取所述服务端根据所述第一下载请求发送的所述第一动态页面资源;在所述纯展示页面中加载所述第一动态页面资源,将加载完成的页面作为所述目标对象页面。
可以理解的是,所述在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面的步骤,和,所述根据所述目标URL地址,从所述服务端获取第一动态页面资源的步骤,可以同步执行(也就是确定纯展示页面和获取第一动态页面资源同步执行),也可以已先后顺序执行(也就是先确定纯展示页面,然后再获取第一动态页面资源)。
对于S6,若不相同,也就是所述第一版本号和所述第二版本号不相同,此时意味着目标HTML内容字符串不是最新的版本,因此不需要对目标HTML内容字符串进行加载,根据所述目标URL地址,向所述服务端发送第二下载请求;获取所述服务端根据所述第二下载请求发送的所述第二动态页面资源;在所述目标空页面中加载所述第二动态页面资源,将加载完成的页面作为所述目标对象页面。
根据所述第二动态页面资源,在所述目标空页面中分别进行前端框架初始化和页面挂载,得到所述目标对象页面。
前端框架初始化包括:创建前端框架实例、初始化实名周期、初始化数据状态、数据绑定和页面渲染。
可选的,所述第一动态页面资源和所述第二动态页面资源的数据相同。
可选的,所述第一动态页面资源和所述第二动态页面资源的数据不相同。也就是说,所述第一动态页面资源是所述第二动态页面资源相对所述目标HTML内容字符串的增量数据。
在一个实施例中,上述根据所述目标URL地址,从所述服务端获取目标HTML内容字符串、第一版本号和目标对象信息的步骤,包括:
S31:根据所述目标URL地址中的对象标识,向所述服务端发送静态资源下载请求;
S32:获取所述服务端根据所述静态资源下载请求发送的所述目标HTML内容字符串、所述第一版本号和所述目标对象信息,其中,所述服务端用于对所述静态资源下载请求进行对象标识解析,得到待查询对象标识,从预设的后端资源库中获取与所述待查询对象标识对应的目标页面关联数据,根据所述目标页面关联数据和所述静态资源下载请求发送所述目标HTML内容字符串、所述第一版本号和所述目标对象信息。
本实施例通过目标URL地址中的对象标识从服务端获取目标HTML内容字符串、第一版本号和目标对象信息,为版本号比较和纯展示页面的生成提供了基础。
对于S31,根据所述目标URL地址中的对象标识生成静态资源下载请求,其中,将所述目标URL地址中的对象标识作为静态资源下载请求携带的参数。通过与服务端的通信连接,将静态资源下载请求发送给所述服务端。
对于S32,所述服务端,对所述静态资源下载请求进行对象标识解析,将解析得到的对象标识作为待查询对象标识,将待查询对象标识在后端资源库中进行对象标识查找,将在后端资源库中查找到的对象标识对应的页面关联数据作为目标页面关联数据,根据所述目标页面关联数据和所述静态资源下载请求生成返回值,将返回值发送给所述静态资源下载请求对应的客户端,从而实现将所述目标页面关联数据中的HTML内容字符串、版本号和对象信息传递给了客户端。
后端资源库包括:页面关联数据。页面关联数据包括:对象标识、HTML内容字符串、版本号和对象信息。
在一个实施例中,上述根据所述目标对象信息生成第二版本号的步骤,包括:
S41:采用MD5方法,对所述目标对象信息进行加密,将加密生成的哈希值作为所述第二版本号。
本实施例采用MD5方法生成第二版本号,从而为版本号的对比提供了基础,为提前展示纯展示页面提供了支持。
对于S41,MD5方法,也就是信息摘要算法。
其中,采用MD5方法,对所述目标对象信息对应的字符串进行加密,加密生成哈希值,将生成的哈希值作为所述第二版本号。
在一个实施例中,上述在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面的步骤,包括:
S51:根据所述第一动态页面资源,在所述纯展示页面中分别进行前端框架初始化和页面挂载,得到所述目标对象页面。
本实施例实现基于所述纯展示页面中分别进行前端框架初始化和页面挂载,得到了可以交互的目标对象页面,从而使本申请同样适用于更加复杂、多样动态的页面的加载。
对于S51,根据所述第一动态页面资源,在所述纯展示页面中分别进行创建前端框架实例、初始化实名周期、初始化数据状态、数据绑定、页面渲染及页面挂载虚拟DOM(文档对象模型),将完成页面虚拟挂载DOM的页面作为所述目标对象页面。
创建前端框架实例、初始化实名周期、初始化数据状态、数据绑定、页面渲染及页面挂载虚拟DOM的具体实现步骤在此不做赘述。
参照图2,本申请实施例中提供一种页面请求响应方法,所述方法包括:
S61:获取客户端根据目标URL地址发送的空内容HTML下载请求;
S62:根据所述空内容HTML下载请求,从预设的空内容HTML库中查询空内容HTML作为目标空内容HTML,将所述目标空内容HTML发送给所述客户端;
S63:获取所述客户端根据所述目标URL地址发送的静态资源下载请求;
S64:根据所述静态资源下载请求,从预设的后端资源库中查询页面关联数据作为目标页面关联数据,根据所述目标页面关联数据向所述客户端发送目标HTML内容字符串、第一版本号和目标对象信息;
S65:获取所述客户端根据所述目标URL地址发送的第一下载请求;
S66:根据所述第一下载请求,从预设的动态页面资源库中查询动态页面资源作为第一动态页面资源,将所述第一动态页面资源发送给所述客户端;
S67:获取所述客户端根据所述目标URL地址发送的第二下载请求;
S68:根据所述第二下载请求,从所述动态页面资源库中查询动态页面资源作为第二动态页面资源,将所述第二动态页面资源发送给所述客户端;
其中,所述客户端用于:对所述目标空内容HTML进行加载,得到目标空页面,根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同,若相同,在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面,若不相同,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
本实施例响应下载请求向客户端提供目标HTML内容字符串、第一版本号和目标对象信息,以使使客户端在第一版本号和第二版本号相同时展示纯展示页面,实现了更快速的呈现页面,减少了页面初始化的白屏时间,提升了用户侧的产品体验,适用于前后端分离的架构模式,没有增加服务端的CPU资源及没有增加项目复杂度;通过在第一版本号和第二版本号相同时在纯展示页面中加载第一动态页面资源得到目标对象页面,在第一版本号和第二版本号不相同时在目标空页面中加载第二动态页面资源得到目标对象页面,从而使本申请同样适用于更加复杂、多样动态的页面的加载。
对于S61,通过与客户端的通信连接,获取客户端根据目标URL地址发送的空内容HTML下载请求,其中,目标URL地址的部分信息或全部信息作为空内容HTML下载请求的参数。
对于S62,空内容HTML库包括:地址信息和空内容HTML。
根据所述空内容HTML下载请求中的参数,从预设的空内容HTML库的各个地址信息中查询,当查询到地址信息被包含在所述空内容HTML下载请求中的参数中时,确定该地址信息对应的空内容HTML作为目标空内容HTML,将所述目标空内容HTML发送给所述客户端。
对于S63,通过与客户端的通信连接,获取所述客户端根据所述目标URL地址发送的静态资源下载请求,其中,目标URL地址的对象标识作为静态资源下载请求的参数。
对于S64,根据所述静态资源下载请求携带的对象标识,从后端资源库中查询对象标识,将在后端资源库查询到的对象标识对应的页面关联数据作为目标页面关联数据,根据所述目标页面关联数据和所述静态资源下载请求生成返回值,将该返回值发送给与所述静态资源下载请求对应的客户端;客户端将所述目标页面关联数据中的HTML内容字符串作为目标HTML内容字符串,将所述目标页面关联数据中的版本号作为第一版本号,将所述目标页面关联数据中的对象信息作为目标对象信息。
对于S65,通过与客户端的通信连接,获取所述客户端根据所述目标URL地址发送的第一下载请求,其中,目标URL地址的对象标识作为第一下载请求的参数。
对于S66,动态页面资源库包括:对象标识和动态页面资源。
根据所述第一下载请求携带的对象标识,在动态页面资源库中进行对象标识查找,将查找到的对象标识对应的动态页面资源作为第一动态页面资源;通过与客户端的通信连接,将所述第一动态页面资源发送给所述客户端。
对于S67,通过与客户端的通信连接,获取所述客户端根据所述目标URL地址发送的第二下载请求,其中,目标URL地址的对象标识作为第二下载请求的参数。
对于S68,根据所述第二下载请求携带的对象标识,在动态页面资源库中进行对象标识查找,将查找到的对象标识对应的动态页面资源作为第二动态页面资源;通过与客户端的通信连接,将所述第二动态页面资源发送给所述客户端。
在一个实施例中,上述获取所述客户端根据所述目标URL地址发送的静态资源下载请求的步骤之前,还包括:
S6311:调用预设的前端框架项目获取webpack编译请求,所述webpack编译请求携带有待存储的对象标识;
S6312:响应所述webpack编译请求以调用webpack编译工具,从所述前端框架项目中获取与所述待存储的对象标识对应的目标编译对象,对所述目标编译对象进行webpack编译;
S6313:在对所述目标编译对象进行webpack编译的过程中调用SSR应用,其中,所述SSR应用用于获取所述目标编译对象中的动态页面资源作为待渲染动态页面资源,对所述待渲染动态页面资源进行页面渲染,得到待打包的页面;
S6314:获取所述SSR应用发送的所述待打包的页面;
S6315:根据所述待打包的页面生成HTML内容字符串,得到待存储的HTML内容字符串;
S6316:采用MD5方法,对所述待渲染动态页面资源中的对象信息进行加密,将加密生成的哈希值作为待存储的版本号;
S6317:将所述待渲染动态页面资源中的对象信息、所述待存储的对象标识、所述待存储的HTML内容字符串和所述待存储的版本号作为待存储的页面关联数据;
S6318:将所述待存储的页面关联数据存储到所述后端资源库中。
本实施例实现基于前端框架项目开发页面,调用webpack编译工具进行webpack编译,在webpack编译编译的过程中调用SSR应用渲染出待打包的页面,根据待打包的页面生成HTML内容字符串,并且根据待渲染动态页面资源中的对象信息生成版本号,最后将所述待渲染动态页面资源中的对象信息、所述待存储的对象标识、所述待存储的HTML内容字符串和所述待存储的版本号作为待存储的页面关联数据存储到所述后端资源库中,为客户端在第一版本号和第二版本号相同时展示纯展示页面提供了基础。
对于S6311,前端框架项目包括但不限于:Vue。
调用预设的前端框架项目获取用户输入的webpack(前端资源模块化管理和打包工具)编译请求。
webpack编译请求,是调用webpack编译工具进行webpack编译的请求。
待存储的对象标识,也就是想要编译的页面中的对象信息对应的对象标识。
对于S6312,在收到所述webpack编译请求时,调用webpack编译工具。通过webpack编译工具,从所述前端框架项目中获取与所述待存储的对象标识对应的编译对象,将获取的编译对象作为目标编译对象,对所述目标编译对象进行webpack编译。
对于S6313,在对所述目标编译对象进行webpack编译的过程中调用SSR应用。
SSR应用,是服务端渲染页面的模块或插件。
所述SSR应用,模拟用户发送页面访问请求,获取所述目标编译对象中的动态页面资源作为待渲染动态页面资源,对所述待渲染动态页面资源进行页面渲染,将渲染得到的页面作为待打包的页面。从而实现将SSR应用组装HTML的步骤提前到了页面上线前的编译阶段。
对于S6315,采用预设的HTML内容字符串生成规则,根据所述待打包的页面生成HTML内容字符串,将生成的HTML内容字符串作为待存储的HTML内容字符串。
对于S6316,采用MD5方法,对所述待渲染动态页面资源中的对象信息进行加密,将加密生成的哈希值作为待存储的版本号,从而得到了与待存储的HTML内容字符串对应的版本号。
对于S6317,将所述待渲染动态页面资源中的对象信息、所述待存储的对象标识、所述待存储的HTML内容字符串和所述待存储的版本号进行关联,将关联得到的页面关联数据作为待存储的页面关联数据。
对于S6318,将所述待存储的页面关联数据存储到所述后端资源库中,从而为客户端在第一版本号和第二版本号相同时展示纯展示页面提供了基础。
在一个实施例中,上述获取所述客户端根据所述目标URL地址发送的静态资源下载请求的步骤之前,还包括:
S6321:通过Node服务,获取产品配置修改请求,其中,所述产品配置修改请求携带有待更新的对象标识;
S6322:通过所述Node服务,根据所述待更新的对象标识获取前端框架项目源代码包;
S6323:通过所述Node服务,执行前端框架项目打包命令以用于调用所述webpack编译工具对所述前端框架项目源代码包进行webpack编译;
S6324:通过所述Node服务,在对所述前端框架项目源代码包进行webpack编译的过程中调用所述SSR应用,其中,所述SSR应用用于获取所述前端框架项目源代码包中的动态页面资源作为待加载动态页面资源,对所述待加载动态页面资源进行页面渲染,得到待处理的页面;
S6325:通过所述Node服务,获取所述SSR应用发送的所述待处理的页面;
S6326:通过所述Node服务,根据所述待处理的页面生成HTML内容字符串,得到待更新的HTML内容字符串;
S6327:通过所述Node服务,采用MD5方法,对所述前端框架项目源代码包中的对象信息进行加密,将加密生成的哈希值作为待更新的版本号;
S6328:通过所述Node服务,将所述前端框架项目源代码包中的对象信息、所述待更新的对象标识、所述待更新的HTML内容字符串和所述待更新的版本号作为待更新的页面关联数据;
S6329:通过所述Node服务,将所述待更新的页面关联数据,对所述后端资源库中的与所述待更新的对象标识对应的所述页面关联数据进行替换。
本实施例通过Node服务封装方法步骤,获取产品配置修改请求,响应产品配置修改请求以实现自动化更新后端资源库中。
Node服务,封装了步骤S6321至步骤S6329的方法步骤。
Node是一个让JavaScript运行在服务端的开发平台。可以使用Node命令启动Node服务,可以使用webStorm工具启动Node服务,还可以使用pm2启动Node服务。其中,pm2是一个带有负载均衡功能的Node应用的进程管理器,pm2可以通过配置,启动多个Node服务,pm2list可以查看当前启动的所有Node服务。
对于S6321,通过Node服务,可以获取用户发送的产品配置修改请求,也可以获取第三方应用系统发送的产品配置修改请求,还可以是实现本申请的程序根据预设条件发送的产品配置修改请求。比如,预设条件是收到后端资源库中的页面关联数据的对象信息的更新完成信号时触发生成产品配置修改请求。
待更新的对象标识,是已被更新的对象信息对应的对象标识。
对于S6322,通过所述Node服务,可以从预设的资源库中获取与所述待更新的对象标识对应的项目源代码包作为前端框架项目源代码包。
对于S6323,通过所述Node服务,执行前端框架项目打包命令,通过该命令调用所述webpack编译工具对所述前端框架项目源代码包进行webpack编译。
对于S6324,通过所述Node服务,在对所述前端框架项目源代码包进行webpack编译的过程中调用所述SSR应用,以渲染出页面。
所述SSR应用,模拟用户发送页面访问请求,获取所述前端框架项目源代码包中的动态页面资源作为待加载动态页面资源,对所述待加载动态页面资源进行页面渲染,将渲染得到的页面作为待处理的页面。从而实现将SSR应用组装HTML的步骤提前到了页面上线前的编译阶段。
对于S6325,通过所述Node服务,获取所述SSR应用发送的所述待处理的页面,从而获得了完整渲染的页面。
对于S6326,通过所述Node服务,采用预设的HTML内容字符串生成规则,根据所述待处理的页面生成HTML内容字符串,将生成的HTML内容字符串作为待更新的HTML内容字符串。
对于S6327,通过所述Node服务,采用MD5方法,对所述前端框架项目源代码包中的对象信息进行加密,将加密生成的哈希值作为待更新的版本号,从而得到了与待更新的HTML内容字符串对应的版本号。
对于S6328,通过所述Node服务,将所述前端框架项目源代码包中的对象信息、所述待更新的对象标识、所述待更新的HTML内容字符串和所述待更新的版本号进行关联,将关联得到的页面关联数据作为待更新的页面关联数据。
对于S6329,通过所述Node服务,将所述待更新的页面关联数据,对所述后端资源库中的与所述待更新的对象标识对应的所述页面关联数据进行替换,从而实现了对后端资源库的更新。
参照图3,本申请还提出了一种页面加载装置,所述装置包括:
请求获取模块110,用于获取页面访问请求,所述页面访问请求携带有目标URL地址;
目标空页面确定模块120,用于根据所述目标URL地址,从服务端获取目标空内容HTML,对所述目标空内容HTML进行加载,得到目标空页面;
数据获取模块130,用于根据所述目标URL地址,从所述服务端获取目标HTML内容字符串、第一版本号和目标对象信息;
判断模块140,用于根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同;
第一对象页面确定模块150,用于若相同,则在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,根据所述目标URL地址,从所述服务端获取第一动态页面资源,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面;
第二对象页面确定模块160,用于若不相同,则根据所述目标URL地址,从所述服务端获取第二动态页面资源,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
本实施例通过在第一版本号和第二版本号相同时展示纯展示页面,实现了更快速的呈现页面,减少了页面初始化的白屏时间,提升了用户侧的产品体验,适用于前后端分离的架构模式,没有增加服务端的CPU资源及没有增加项目复杂度;通过在第一版本号和第二版本号相同时在纯展示页面中加载第一动态页面资源得到目标对象页面,在第一版本号和第二版本号不相同时在目标空页面中加载第二动态页面资源得到目标对象页面,从而使本申请同样适用于更加复杂、多样动态的页面的加载。
参照图4,本申请还提出了一种页面请求响应装置,所述装置包括:
第一下载请求响应模块210,用于获取客户端根据目标URL地址发送的空内容HTML下载请求,根据所述空内容HTML下载请求,从预设的空内容HTML库中查询空内容HTML作为目标空内容HTML,将所述目标空内容HTML发送给所述客户端;
第二下载请求响应模块220,用于获取所述客户端根据所述目标URL地址发送的静态资源下载请求,根据所述静态资源下载请求,从预设的后端资源库中查询页面关联数据作为目标页面关联数据,根据所述目标页面关联数据向所述客户端发送目标HTML内容字符串、第一版本号和目标对象信息;
第三下载请求响应模块230,用于获取所述客户端根据所述目标URL地址发送的第一下载请求,根据所述第一下载请求,从预设的动态页面资源库中查询动态页面资源作为第一动态页面资源,将所述第一动态页面资源发送给所述客户端;
第四下载请求响应模块240,用于获取所述客户端根据所述目标URL地址发送的第二下载请求,根据所述第二下载请求,从所述动态页面资源库中查询动态页面资源作为第二动态页面资源,将所述第二动态页面资源发送给所述客户端;
其中,所述客户端用于:对所述目标空内容HTML进行加载,得到目标空页面,根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同,若相同,在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面,若不相同,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
参照图5,本申请实施例中还提供一种计算机设备,该计算机设备可以是服务器,其内部结构可以如图5所示。该计算机设备包括通过系统总线连接的处理器、存储器、网络接口和数据库。其中,该计算机设计的处理器用于提供计算和控制能力。该计算机设备的存储器包括非易失性存储介质、内存储器。该非易失性存储介质存储有操作系统、计算机程序和数据库。该内存器为非易失性存储介质中的操作系统和计算机程序的运行提供环境。该计算机设备的数据库用于储存页面加载方法等数据。该计算机设备的网络接口用于与外部的终端通过网络连接通信。该计算机程序被处理器执行时以实现一种页面加载方法。所述页面加载方法,包括:获取页面访问请求,所述页面访问请求携带有目标URL地址;根据所述目标URL地址,从服务端获取目标空内容HTML,对所述目标空内容HTML进行加载,得到目标空页面;根据所述目标URL地址,从所述服务端获取目标HTML内容字符串、第一版本号和目标对象信息;根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同;若相同,则在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,根据所述目标URL地址,从所述服务端获取第一动态页面资源,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面;若不相同,则根据所述目标URL地址,从所述服务端获取第二动态页面资源,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
本实施例通过在第一版本号和第二版本号相同时展示纯展示页面,实现了更快速的呈现页面,减少了页面初始化的白屏时间,提升了用户侧的产品体验,适用于前后端分离的架构模式,没有增加服务端的CPU资源及没有增加项目复杂度;通过在第一版本号和第二版本号相同时在纯展示页面中加载第一动态页面资源得到目标对象页面,在第一版本号和第二版本号不相同时在目标空页面中加载第二动态页面资源得到目标对象页面,从而使本申请同样适用于更加复杂、多样动态的页面的加载。
本申请实施例中还提供一种计算机设备,该计算机设备可以是服务器,该计算机设备包括通过系统总线连接的处理器、存储器、网络接口和数据库。其中,该计算机设计的处理器用于提供计算和控制能力,该计算机设备的存储器包括非易失性存储介质、内存储器,该非易失性存储介质存储有操作系统、计算机程序和数据库,该内存器为非易失性存储介质中的操作系统和计算机程序的运行提供环境,该计算机设备的数据库用于储存页面加载方法等数据,该计算机设备的网络接口用于与外部的终端通过网络连接通信,该计算机程序被处理器执行时以实现一种页面请求响应方法。所述页面请求响应方法,包括:获取客户端根据目标URL地址发送的空内容HTML下载请求;根据所述空内容HTML下载请求,从预设的空内容HTML库中查询空内容HTML作为目标空内容HTML,将所述目标空内容HTML发送给所述客户端;获取所述客户端根据所述目标URL地址发送的静态资源下载请求;根据所述静态资源下载请求,从预设的后端资源库中查询页面关联数据作为目标页面关联数据,根据所述目标页面关联数据向所述客户端发送目标HTML内容字符串、第一版本号和目标对象信息;获取所述客户端根据所述目标URL地址发送的第一下载请求;根据所述第一下载请求,从预设的动态页面资源库中查询动态页面资源作为第一动态页面资源,将所述第一动态页面资源发送给所述客户端;获取所述客户端根据所述目标URL地址发送的第二下载请求;根据所述第二下载请求,从所述动态页面资源库中查询动态页面资源作为第二动态页面资源,将所述第二动态页面资源发送给所述客户端;其中,所述客户端用于:对所述目标空内容HTML进行加载,得到目标空页面,根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同,若相同,在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面,若不相同,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
本申请一实施例还提供一种计算机可读存储介质,其上存储有计算机程序,计算机程序被处理器执行时实现一种页面加载方法,包括步骤:获取页面访问请求,所述页面访问请求携带有目标URL地址;根据所述目标URL地址,从服务端获取目标空内容HTML,对所述目标空内容HTML进行加载,得到目标空页面;根据所述目标URL地址,从所述服务端获取目标HTML内容字符串、第一版本号和目标对象信息;根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同;若相同,则在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,根据所述目标URL地址,从所述服务端获取第一动态页面资源,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面;若不相同,则根据所述目标URL地址,从所述服务端获取第二动态页面资源,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
上述执行的页面加载方法,通过在第一版本号和第二版本号相同时展示纯展示页面,实现了更快速的呈现页面,减少了页面初始化的白屏时间,提升了用户侧的产品体验,适用于前后端分离的架构模式,没有增加服务端的CPU资源及没有增加项目复杂度;通过在第一版本号和第二版本号相同时在纯展示页面中加载第一动态页面资源得到目标对象页面,在第一版本号和第二版本号不相同时在目标空页面中加载第二动态页面资源得到目标对象页面,从而使本申请同样适用于更加复杂、多样动态的页面的加载。
本申请一实施例还提供一种计算机可读存储介质,其上存储有计算机程序,计算机程序被处理器执行时实现一种页面请求响应方法,包括步骤:获取客户端根据目标URL地址发送的空内容HTML下载请求;根据所述空内容HTML下载请求,从预设的空内容HTML库中查询空内容HTML作为目标空内容HTML,将所述目标空内容HTML发送给所述客户端;获取所述客户端根据所述目标URL地址发送的静态资源下载请求;根据所述静态资源下载请求,从预设的后端资源库中查询页面关联数据作为目标页面关联数据,根据所述目标页面关联数据向所述客户端发送目标HTML内容字符串、第一版本号和目标对象信息;获取所述客户端根据所述目标URL地址发送的第一下载请求;根据所述第一下载请求,从预设的动态页面资源库中查询动态页面资源作为第一动态页面资源,将所述第一动态页面资源发送给所述客户端;获取所述客户端根据所述目标URL地址发送的第二下载请求;根据所述第二下载请求,从所述动态页面资源库中查询动态页面资源作为第二动态页面资源,将所述第二动态页面资源发送给所述客户端;其中,所述客户端用于:对所述目标空内容HTML进行加载,得到目标空页面,根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同,若相同,在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面,若不相同,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程,是可以通过计算机程序来指令相关的硬件来完成,所述的计算机程序可存储于一非易失性计算机可读取存储介质中,该计算机程序在执行时,可包括如上述各方法的实施例的流程。其中,本申请所提供的和实施例中所使用的对存储器、存储、数据库或其它介质的任何引用,均可包括非易失性和/或易失性存储器。非易失性存储器可以包括只读存储器(ROM)、可编程ROM(PROM)、电可编程ROM(EPROM)、电可擦除可编程ROM(EEPROM)或闪存。易失性存储器可包括随机存取存储器(RAM)或者外部高速缓冲存储器。作为说明而非局限,RAM以多种形式可得,诸如静态RAM(SRAM)、动态RAM(DRAM)、同步DRAM(SDRAM)、双速据率SDRAM(SSRSDRAM)、增强型SDRAM(ESDRAM)、同步链路(Synchlink)DRAM(SLDRAM)、存储器总线(Rambus)直接RAM(RDRAM)、直接存储器总线动态RAM(DRDRAM)、以及存储器总线动态RAM(RDRAM)等。
需要说明的是,在本文中,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、装置、物品或者方法不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、装置、物品或者方法所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括该要素的过程、装置、物品或者方法中还存在另外的相同要素。
以上所述仅为本申请的优选实施例,并非因此限制本申请的专利范围,凡是利用本申请说明书及附图内容所作的等效结构或等效流程变换,或直接或间接运用在其他相关的技术领域,均同理包括在本申请的专利保护范围内。
Claims (10)
1.一种页面加载方法,其特征在于,所述方法包括:
获取页面访问请求,所述页面访问请求携带有目标URL地址;
根据所述目标URL地址,从服务端获取目标空内容HTML,对所述目标空内容HTML进行加载,得到目标空页面;
根据所述目标URL地址,从所述服务端获取目标HTML内容字符串、第一版本号和目标对象信息;
根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同;
若相同,则在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,根据所述目标URL地址,从所述服务端获取第一动态页面资源,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面;
若不相同,则根据所述目标URL地址,从所述服务端获取第二动态页面资源,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
2.根据权利要求1所述的页面加载方法,其特征在于,所述根据所述目标URL地址,从所述服务端获取目标HTML内容字符串、第一版本号和目标对象信息的步骤,包括:
根据所述目标URL地址中的对象标识,向所述服务端发送静态资源下载请求;
获取所述服务端根据所述静态资源下载请求发送的所述目标HTML内容字符串、所述第一版本号和所述目标对象信息,其中,所述服务端用于对所述静态资源下载请求进行对象标识解析,得到待查询对象标识,从预设的后端资源库中获取与所述待查询对象标识对应的目标页面关联数据,根据所述目标页面关联数据和所述静态资源下载请求发送所述目标HTML内容字符串、所述第一版本号和所述目标对象信息。
3.根据权利要求1所述的页面加载方法,其特征在于,所述根据所述目标对象信息生成第二版本号的步骤,包括:
采用MD5方法,对所述目标对象信息进行加密,将加密生成的哈希值作为所述第二版本号。
4.根据权利要求1所述的页面加载方法,其特征在于,所述在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面的步骤,包括:
根据所述第一动态页面资源,在所述纯展示页面中分别进行前端框架初始化和页面挂载,得到所述目标对象页面。
5.一种页面请求响应方法,其特征在于,所述方法包括:
获取客户端根据目标URL地址发送的空内容HTML下载请求;
根据所述空内容HTML下载请求,从预设的空内容HTML库中查询空内容HTML作为目标空内容HTML,将所述目标空内容HTML发送给所述客户端;
获取所述客户端根据所述目标URL地址发送的静态资源下载请求;
根据所述静态资源下载请求,从预设的后端资源库中查询页面关联数据作为目标页面关联数据,根据所述目标页面关联数据向所述客户端发送目标HTML内容字符串、第一版本号和目标对象信息;
获取所述客户端根据所述目标URL地址发送的第一下载请求;
根据所述第一下载请求,从预设的动态页面资源库中查询动态页面资源作为第一动态页面资源,将所述第一动态页面资源发送给所述客户端;
获取所述客户端根据所述目标URL地址发送的第二下载请求;
根据所述第二下载请求,从所述动态页面资源库中查询动态页面资源作为第二动态页面资源,将所述第二动态页面资源发送给所述客户端;
其中,所述客户端用于:对所述目标空内容HTML进行加载,得到目标空页面,根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同,若相同,在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面,若不相同,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
6.根据权利要求5所述的页面请求响应方法,其特征在于,所述获取所述客户端根据所述目标URL地址发送的静态资源下载请求的步骤之前,还包括:
调用预设的前端框架项目获取webpack编译请求,所述webpack编译请求携带有待存储的对象标识;
响应所述webpack编译请求以调用webpack编译工具,从所述前端框架项目中获取与所述待存储的对象标识对应的目标编译对象,对所述目标编译对象进行webpack编译;
在对所述目标编译对象进行webpack编译的过程中调用SSR应用,其中,所述SSR应用用于获取所述目标编译对象中的动态页面资源作为待渲染动态页面资源,对所述待渲染动态页面资源进行页面渲染,得到待打包的页面;
获取所述SSR应用发送的所述待打包的页面;
根据所述待打包的页面生成HTML内容字符串,得到待存储的HTML内容字符串;
采用MD5方法,对所述待渲染动态页面资源中的对象信息进行加密,将加密生成的哈希值作为待存储的版本号;
将所述待渲染动态页面资源中的对象信息、所述待存储的对象标识、所述待存储的HTML内容字符串和所述待存储的版本号作为待存储的页面关联数据;
将所述待存储的页面关联数据存储到所述后端资源库中。
7.根据权利要求6所述的页面请求响应方法,其特征在于,所述获取所述客户端根据所述目标URL地址发送的静态资源下载请求的步骤之前,还包括:
通过Node服务,获取产品配置修改请求,其中,所述产品配置修改请求携带有待更新的对象标识;
通过所述Node服务,根据所述待更新的对象标识获取前端框架项目源代码包;
通过所述Node服务,执行前端框架项目打包命令以用于调用所述webpack编译工具对所述前端框架项目源代码包进行webpack编译;
通过所述Node服务,在对所述前端框架项目源代码包进行webpack编译的过程中调用所述SSR应用,其中,所述SSR应用用于获取所述前端框架项目源代码包中的动态页面资源作为待加载动态页面资源,对所述待加载动态页面资源进行页面渲染,得到待处理的页面;
通过所述Node服务,获取所述SSR应用发送的所述待处理的页面;
通过所述Node服务,根据所述待处理的页面生成HTML内容字符串,得到待更新的HTML内容字符串;
通过所述Node服务,采用MD5方法,对所述前端框架项目源代码包中的对象信息进行加密,将加密生成的哈希值作为待更新的版本号;
通过所述Node服务,将所述前端框架项目源代码包中的对象信息、所述待更新的对象标识、所述待更新的HTML内容字符串和所述待更新的版本号作为待更新的页面关联数据;
通过所述Node服务,将所述待更新的页面关联数据,对所述后端资源库中的与所述待更新的对象标识对应的所述页面关联数据进行替换。
8.一种页面加载装置,其特征在于,所述装置包括:
请求获取模块,用于获取页面访问请求,所述页面访问请求携带有目标URL地址;
目标空页面确定模块,用于根据所述目标URL地址,从服务端获取目标空内容HTML,对所述目标空内容HTML进行加载,得到目标空页面;
数据获取模块,用于根据所述目标URL地址,从所述服务端获取目标HTML内容字符串、第一版本号和目标对象信息;
判断模块,用于根据所述目标对象信息生成第二版本号,并判断所述第一版本号和所述第二版本号是否相同;
第一对象页面确定模块,用于若相同,则在所述目标空页面中加载所述目标HTML内容字符串,得到纯展示页面,根据所述目标URL地址,从所述服务端获取第一动态页面资源,在所述纯展示页面中加载所述第一动态页面资源,得到目标对象页面;
第二对象页面确定模块,用于若不相同,则根据所述目标URL地址,从所述服务端获取第二动态页面资源,在所述目标空页面中加载所述第二动态页面资源,得到所述目标对象页面。
9.一种计算机设备,包括存储器和处理器,所述存储器存储有计算机程序,其特征在于,所述处理器执行所述计算机程序时实现权利要求1至7中任一项所述方法的步骤。
10.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现权利要求1至7中任一项所述的方法的步骤。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202111520622.3A CN114238811B (zh) | 2021-12-13 | 2021-12-13 | 页面加载方法、页面请求响应方法、装置、设备及介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202111520622.3A CN114238811B (zh) | 2021-12-13 | 2021-12-13 | 页面加载方法、页面请求响应方法、装置、设备及介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN114238811A true CN114238811A (zh) | 2022-03-25 |
CN114238811B CN114238811B (zh) | 2024-07-16 |
Family
ID=80755307
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202111520622.3A Active CN114238811B (zh) | 2021-12-13 | 2021-12-13 | 页面加载方法、页面请求响应方法、装置、设备及介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN114238811B (zh) |
Cited By (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114745190A (zh) * | 2022-04-21 | 2022-07-12 | 医渡云(北京)技术有限公司 | 页面处理方法及装置、存储介质、电子设备 |
CN114895825A (zh) * | 2022-07-13 | 2022-08-12 | 北京达佳互联信息技术有限公司 | 列表显示方法、电子设备及存储介质 |
CN114969592A (zh) * | 2022-05-31 | 2022-08-30 | 浪潮工业互联网股份有限公司 | 一种web前端首页的白屏优化系统、方法及设备 |
Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN107784086A (zh) * | 2017-10-09 | 2018-03-09 | 中国平安人寿保险股份有限公司 | 一种网页的加载方法、终端设备及计算机可读存储介质 |
CN112417360A (zh) * | 2020-12-03 | 2021-02-26 | 武汉悦学帮网络技术有限公司 | 网页渲染方法和装置 |
CN113703893A (zh) * | 2021-08-24 | 2021-11-26 | 上海浦东发展银行股份有限公司 | 一种页面渲染方法、装置、终端及存储介质 |
-
2021
- 2021-12-13 CN CN202111520622.3A patent/CN114238811B/zh active Active
Patent Citations (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN107784086A (zh) * | 2017-10-09 | 2018-03-09 | 中国平安人寿保险股份有限公司 | 一种网页的加载方法、终端设备及计算机可读存储介质 |
CN112417360A (zh) * | 2020-12-03 | 2021-02-26 | 武汉悦学帮网络技术有限公司 | 网页渲染方法和装置 |
CN113703893A (zh) * | 2021-08-24 | 2021-11-26 | 上海浦东发展银行股份有限公司 | 一种页面渲染方法、装置、终端及存储介质 |
Cited By (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114745190A (zh) * | 2022-04-21 | 2022-07-12 | 医渡云(北京)技术有限公司 | 页面处理方法及装置、存储介质、电子设备 |
CN114745190B (zh) * | 2022-04-21 | 2024-01-16 | 医渡云(北京)技术有限公司 | 页面处理方法及装置、存储介质、电子设备 |
CN114969592A (zh) * | 2022-05-31 | 2022-08-30 | 浪潮工业互联网股份有限公司 | 一种web前端首页的白屏优化系统、方法及设备 |
CN114969592B (zh) * | 2022-05-31 | 2024-04-12 | 浪潮工业互联网股份有限公司 | 一种web前端首页的白屏优化系统、方法及设备 |
CN114895825A (zh) * | 2022-07-13 | 2022-08-12 | 北京达佳互联信息技术有限公司 | 列表显示方法、电子设备及存储介质 |
CN114895825B (zh) * | 2022-07-13 | 2022-11-22 | 北京达佳互联信息技术有限公司 | 列表显示方法、电子设备及存储介质 |
Also Published As
Publication number | Publication date |
---|---|
CN114238811B (zh) | 2024-07-16 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN114238811B (zh) | 页面加载方法、页面请求响应方法、装置、设备及介质 | |
CN108287839B (zh) | 一种页面加载方法和设备 | |
US8752016B2 (en) | Converting JavaScript into a device-independent representation | |
CN109284454B (zh) | 页面渲染方法、装置、计算机设备及存储介质 | |
CN110647700A (zh) | 页面资源的加载方法、装置、计算机设备和存储介质 | |
CN110221871B (zh) | 网页获取方法、装置、计算机设备及存储介质 | |
CN111984356A (zh) | 页面跳转方法、装置、计算机设备和存储介质 | |
CN106406844B (zh) | 实现通讯交互平台公众号菜单的方法和装置 | |
CN112114808B (zh) | 页面渲染方法、装置、电子设备 | |
US6944827B2 (en) | System and method of data transmission for computer networks utilizing HTTP | |
CN111880790A (zh) | 页面渲染方法、页面渲染系统和计算机可读存储介质 | |
CN111522849A (zh) | 数据库动态访问方法、服务器及存储介质 | |
CN111124544A (zh) | 界面显示方法、装置、电子设备及存储介质 | |
CN111880789A (zh) | 页面渲染方法、装置、服务端和计算机可读存储介质 | |
CN112637361A (zh) | 一种页面代理方法、装置、电子设备及存储介质 | |
CN108021564A (zh) | 一种页面重定向的方法和设备 | |
CN114003307A (zh) | 基于umd模式的动态组件加载注册方法、装置、设备及介质 | |
CN112231379A (zh) | 基于微服务架构的api审计方法、装置、设备及存储介质 | |
CN114064733B (zh) | 适用于本地客户端的数据库查询方法、装置、设备及介质 | |
CN111310005A (zh) | 网络请求的处理方法及装置、服务器和存储介质 | |
CN113315829B (zh) | 客户端离线化h5页面加载方法、装置、计算机设备及介质 | |
CN103544209A (zh) | 访问网页的方法和系统 | |
CN113419784A (zh) | 页面资源的缓存方法、装置、设备及介质 | |
CN112926002A (zh) | 一种服务请求的处理方法及装置 | |
CN111881043A (zh) | 页面测试方法、装置、存储介质和处理器 |
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 |