CN113645062A - 页面数据处理方法、装置及电子设备 - Google Patents
页面数据处理方法、装置及电子设备 Download PDFInfo
- Publication number
- CN113645062A CN113645062A CN202110791369.9A CN202110791369A CN113645062A CN 113645062 A CN113645062 A CN 113645062A CN 202110791369 A CN202110791369 A CN 202110791369A CN 113645062 A CN113645062 A CN 113645062A
- Authority
- CN
- China
- Prior art keywords
- page
- server
- ssr
- application
- rendering
- 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.)
- Pending
Links
- 238000003672 processing method Methods 0.000 title claims abstract description 24
- 238000009877 rendering Methods 0.000 claims abstract description 136
- 238000012545 processing Methods 0.000 claims abstract description 112
- 238000000034 method Methods 0.000 claims abstract description 32
- 230000008569 process Effects 0.000 claims description 10
- 230000007246 mechanism Effects 0.000 abstract description 8
- 230000004044 response Effects 0.000 abstract description 7
- 238000011161 development Methods 0.000 description 10
- 230000006870 function Effects 0.000 description 10
- 238000004891 communication Methods 0.000 description 9
- 238000010586 diagram Methods 0.000 description 9
- 230000003068 static effect Effects 0.000 description 8
- 238000000547 structure data Methods 0.000 description 7
- 238000005516 engineering process Methods 0.000 description 6
- 239000012141 concentrate Substances 0.000 description 4
- 238000012423 maintenance Methods 0.000 description 4
- 238000007726 management method Methods 0.000 description 4
- 230000005236 sound signal Effects 0.000 description 4
- 238000004590 computer program Methods 0.000 description 3
- 230000003993 interaction Effects 0.000 description 3
- 238000011160 research Methods 0.000 description 3
- 238000012827 research and development Methods 0.000 description 3
- 238000004458 analytical method Methods 0.000 description 2
- 230000009977 dual effect Effects 0.000 description 2
- 230000000694 effects Effects 0.000 description 2
- 230000003287 optical effect Effects 0.000 description 2
- 230000009471 action Effects 0.000 description 1
- 238000004364 calculation method Methods 0.000 description 1
- 210000001503 joint Anatomy 0.000 description 1
- 239000004973 liquid crystal related substance Substances 0.000 description 1
- 238000010295 mobile communication Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 239000003973 paint Substances 0.000 description 1
- 238000004904 shortening Methods 0.000 description 1
- 239000007787 solid Substances 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
- 230000001960 triggered effect Effects 0.000 description 1
Images
Classifications
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
- H04L41/00—Arrangements for maintenance, administration or management of data switching networks, e.g. of packet switching networks
- H04L41/06—Management of faults, events, alarms or notifications
- H04L41/0654—Management of faults, events, alarms or notifications using network fault recovery
- H04L41/0663—Performing the actions predefined by failover planning, e.g. switching to standby network elements
-
- 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
- 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
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
- H04L1/00—Arrangements for detecting or preventing errors in the information received
- H04L1/22—Arrangements for detecting or preventing errors in the information received using redundant apparatus to increase reliability
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
- H04L67/00—Network arrangements or protocols for supporting network services or applications
- H04L67/01—Protocols
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
- H04L67/00—Network arrangements or protocols for supporting network services or applications
- H04L67/50—Network services
- H04L67/60—Scheduling or organising the servicing of application requests, e.g. requests for application data transmissions using the analysis and optimisation of the required network resources
- H04L67/63—Routing a service request depending on the request content or context
Landscapes
- Engineering & Computer Science (AREA)
- Computer Networks & Wireless Communication (AREA)
- Signal Processing (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本发明实施例提供了一种页面数据处理方法、装置及电子设备,其中,方法包括:响应于客户端应用的页面访问请求,向服务器发送SSR请求,触发与客户端应用对应的SSR应用执行服务端渲染处理;根据服务器渲染结果执行如下处理:如果服务端渲染成功,则将接收到SSR应用返回的渲染后的页面数据,发送给客户端应用进行页面显示;如果服务端渲染失败,则获取页面模板并发送给客户端应用执行客户端渲染处理。本发明实施例通过主备两条页面渲染链路进行页面渲染,并使用边缘处理机制来实现主备链路的切换,当服务端渲染失败时,能够处理快速切换到客户端渲染的链路上,从而提高了页面渲染处理的稳定性和快速响应性。
Description
技术领域
本申请涉及一种页面数据处理方法、装置及电子设备,属于计算机技术领域。
背景技术
页面FMP(First Meaningful Paint,首次有效绘制)是测量客户端应用加载页面的重要指标,直接关系到用户体验。FMP是指从用户打开URL(Uniform Resource Locator,统一资源定位器)到页面首屏展示出有意义内容给用户的时间,一般FMP越短,说明页面性能越好。
为了有效提高FMP,出现了SSR(Server-Side Rendering,服务端渲染)的处理方式,在该处理方式下,将页面首屏内容在服务器一侧完成渲染,渲染后的页面数据到达客户端之后直接通过绘制展示给用户,从而有效缩短FMP。
然而,当服务端的SSR出现故障或者渲染出的页面数据文件与客户端不匹配时,将会出现页面无法显示或者显示出现错误的情形,客户端需要重新发起URL请求,使得页面首屏显示呈现不稳定状况,严重影响客户体验。
发明内容
本发明实施例提供一种页面数据处理方法、装置及电子设备,以保障页面显示的稳定性。
为了实现上述目的,本发明实施例提供了一种页面数据处理方法,包括:
响应于客户端应用的页面访问请求,向服务器发送SSR请求,触发服务器上与所述客户端应用对应的SSR应用执行服务端渲染处理;
根据服务器渲染结果执行如下处理:
如果服务端渲染成功,则将接收到所述SSR应用返回的渲染后的页面数据,发送给所述客户端应用进行页面显示;
如果服务端渲染失败,则获取页面模板并发送给客户端应用执行客户端渲染处理。
本发明实施例还提供了一种页面数据处理方法,包括:
通过SSR网关接收客户端应用的页面访问请求,根据访问请求携带的客户端应用信息,将该页面访问请求发送至服务器上的与该客户端应用对应的SSR应用;
基于所述SSR应用执行服务端渲染处理,并将服务端渲染处理结果返回给SSR网关;
通过所述SSR网关将服务端渲染处理结果发送给与所述客户端应用信息对应的所述客户端应用。
本发明实施例还提供了一种页面数据的处理装置,包括:
SSR请求处理模块,用于响应于客户端应用的页面访问请求,向服务器发送SSR请求,触发服务器上与所述客户端应用对应的的SSR应用执行服务端渲染处理,获取服务器渲染结果并执行判定处理,
服务端渲染处理模块,用于在服务端渲染成功的情况下,将接收到所述SSR应用返回的渲染后的页面数据,发送给所述客户端应用进行页面显示,
客户端渲染处理模块,用于在服务端渲染失败的情况下,获取页面模板并发送给客户端应用执行客户端渲染处理。
本发明实施例还提供了一种电子设备,包括:
存储器,用于存储程序;
处理器,用于运行所述存储器中存储的所述程序,以执行前述的页面数据处理方法。
本发明实施例的页面数据处理方法,通过主备两条页面渲染链路执行页面渲染处理,并让CDN服务器的边缘处理机制来实现主备链路的切换,当服务端渲染失败时,能够通过CDN服务器的处理快速切换到客户端渲染的链路上,从而提高了页面渲染处理的稳定性和快速响应性,并且由于仅在服务器端渲染失败时才使用客户端渲染,从而也大幅减轻了客户端进行渲染处理的负担。
另一方面,本发明实施例通过SSR网关的路由机制,使得提供不同服务的客户端都可以在服务器端对应部署单独的SSR应用,当页面地址被访问时能够将访问请求转发到该页面服务对应的SSR应用,从而进行高效的页面渲染处理。由于不同服务之间能够采用独立的SSR应用,应用的研发、发布、运行时皆互相隔离,稳定性高。开发人员可以专注于SSR应用的内容开发,而无需考虑各环节的运维工作、主备链路也无需重复开发,从而提高了应用研发效率。
上述说明仅是本发明技术方案的概述,为了能够更清楚了解本发明的技术手段,而可依照说明书的内容予以实施,并且为了让本发明的上述和其它目的、特征和优点能够更明显易懂,以下特举本发明的具体实施方式。
附图说明
图1为本发明实施例的页面数据处理方法的应用场景示意图;
图2为本发明实施例的页面数据处理方法的流程示意图之一;
图3为本发明实施例的页面数据处理方法的流程示意图之二;
图4为本发明实施例的SSR应用的框架结构示意图;
图5为本发明实施例的页面数据处理装置的结构示意图;
图6为本发明实施例的电子设备的结构示意图。
具体实施方式
下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例,然而应当理解,可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反,提供这些实施例是为了能够更透彻地理解本公开,并且能够将本公开的范围完整的传达给本领域的技术人员。
下面通过一些具体实施例来进一步说明本发明的技术方案。
如图1所示,其为本发明实施例的页面数据处理方法的应用场景示意图,图1中的客户端上安装已有各种客户端应用,如图中示例出的客户端应用1至3,相应地,在服务器一侧配置有与客户端应用对应的服务端应用,如图中示例出的SSR应用1至3。在服务器与客户端之间设置有CDN服务器,用于对页面数据进行缓存。为了降低源站(提供服务的服务器端)的提供数据服务的压力,在服务器与客户端之间还设置有CDN(Content DeliveryNetwork,内容分发网络)服务器。CDN是建立并覆盖在承载网上,由不同区域的服务器组成的分布式网络,将源站资源缓存到各个区域的CDN服务器上,供客户端可以就近获取数据,降低源站压力,在这样的架构下,CDN服务器提供了边缘服务的能力。具体到网页访问的过程中,CDN服务器可以用来对页面数据进行缓存,从而使得客户端在进行页面访问的过程中,高效地获取到页面数据。
在本发明实施例中,利用了CDN服务器的边缘服务特性,通过CDN服务器上的部署边缘处理程序,实现SSR的主备双链路切换功能,从而保障SSR服务的稳定性。如图1中所示,实线示出的链路为执行服务端渲染的主链路,而虚线示出的链路为执行客户端渲染的备用链路,在服务端渲染失败的情况下使用。具体结合图1所示,在客户端一侧可以存在提供不同服务的多个客户端应用,如图中示例性的客户端应用1至3,相应地,在服务器一侧,可以部署有多个SSR应用,每个SSR应用和客户端应用分别对应,为客户端应用提供页面渲染处理,图中仅以客户端应用2与SSR应用2之间交互作为示例来进行图示说明。
客户端应用2首先向服务器端发起页面访问请求,该请求到达CDN服务器后,会先触发服务端渲染的主链路上的处理,将该页面访问请求发送至SSR应用网关,该SSR应用网关可以根据页面请求中携带的信息(例如客户端应用的名称)来确定与该客户端应用对应的SSR应用,即图中的SSR应用2。在SSR应用2上包括内容数据提供模块和服务端渲染处理模块,在使用服务端渲染的主链路的主链路的情况下,该页面访问请求会路由至该SSR应用2的服务端渲染处理模块,在渲染处理正常的情况下,该服务端渲染处理模块会将渲染后的页面数据,例如包含首屏DOM结构的页面数据通过SSR应用网关并经由CDN服务器,沿着之前的请求路径返回值客户端应用2,客户端应用2在收到渲染后的页面数据后,便可以在客户端上进行页面显示,从而实现页面渲染的快速响应。
当服务端渲染的主链路出现问题,例如SSR应用出现宕机或者运行错误等,将导致客户端应用无法接收到有效的页面渲染数据,客户端应用会返回服务端渲染失败的消息给CDN服务器,CDN服务器会执行备用渲染链路的处理,即图中所示的虚线路径,CDN服务器一方面会从页面模板托管平台获取页面模板,另一方面,通过SSR应用网关访问SSR应用2的内容数据提供模块获取页面内容数据,然后将获取到的页面模板和页面内容数据返回给客户端应用2,客户端应用2在本地执行客户端的渲染处理。
本发明实施例的页面数据处理方法,通过主备两条页面渲染链路执行页面渲染处理,并让CDN服务器的边缘处理机制来实现主备链路的切换,当服务端渲染失败时,能够快速切换到客户端渲染的链路上,从而提高了页面渲染处理的稳定性和快速响应性,并且由于仅在服务器端渲染失败时才使用客户端渲染,从而也大幅减轻了客户端进行渲染处理的负担。另一方面,本发明实施例通过SSR网关的路由机制,使得提供不同服务的客户端都可以在服务器端对应部署单独的SSR应用,当页面地址被访问时能够将访问请求转发到该页面服务对应的SSR应用,从而进行高效的页面渲染处理。由于不同服务之间能够采用独立的SSR应用,应用的研发、发布、运行时皆互相隔离,稳定性高。开发人员可以专注于SSR应用的内容开发,而无需考虑各环节的运维工作、主备链路也无需重复开发,从而提高了应用研发效率。
如图2所示,其为本发明实施例的页面数据处理方法的流程示意图之一,该方法可以运行在CDN服务器,以实现上述的SSR的主备双链路切换功能。该方法可以包括:
S101:响应于客户端应用的页面访问请求,向服务器发送SSR请求,触发服务器上与客户端应用对应的SSR应用执行服务端渲染处理。在客户端上,当用户要访问某个页面时,例如用户点击当前页面上的某个URL链接而触发访问新的页面,客户端应用会基于该URL向服务器发送页面访问请求,该请求会首先到达CDN服务器。
CDN服务器在接收到客户端应用的页面访问请求后,可以先读取页面缓存,如果未命中缓存,则执行向服务器的SSR应用发送SSR请求的处理,然后,根据不同的服务器渲染结果,来执行如下步骤S102和S103的处理。如果命中缓存,则向客户端应用返回缓存的页面数据。在命中页面缓存的情况下,相当于客户端应用已经拿到了可以显示的页面数据,从而直接进行页面首屏显示了。
S102:如果服务端渲染成功,则将接收到SSR应用返回的渲染后的页面数据,发送给客户端应用进行页面显示。服务端渲染处理由服务器来执行,在服务器上设置有与客户端应用对应的SSR应用,当该SSR应用接收到页面访问请求后,便可以执行服务端渲染处理。服务端渲染处理主要包括从与SSR应用关联的提供内容数据的服务获取页面内容数据,结合所述SSR应用存储的页面模板,执行渲染上下文处理,生成包含首屏DOM(DocumentObject Model,文档对象模型)结构的页面数据。
渲染处理需要获取页面模板和页面内容数据,对于设置在服务器上的SSR应用而言,其自身存储有对应的页面模板,而页面内容数据可以从与应用关联的下游的HSF(High-speed Service Framework高速服务框架)服务获取,HSF是一种分布式RPC服务框架,其统一了分布式应用中服务的发布/调用方式,从而能够方便、快速的开发分布式应用。以访问的页面为商品销售页面为例,SSR应用可以从提供商品信息的服务处获取商品信息列表,从提供支付处理的服务处获取价格计算信息等。在获取到页面内容数据后,将页面内容数据和页面模板相结合,在服务器上完成渲染处理。例如,当前请求的页面为商品展示页面,SSR应用存储的页面模板可以包括基本的页面框架、背景以及展示的商品图片等静态内容,页面内容数据可以包括从下游的HSF服务获取的商品的价格、交易量等动态变化的数据。
对于页面模板和页面内容数据的定义可以根据实际需要和应用场景而定。上述的SSR应用可以采用Node FaaS(功能即服务节点)应用的架构,FaaS是一种在无状态容器中运行的事件驱动型计算执行模型,这些功能将利用服务来管理服务器端逻辑和状态,它允许开发人员以功能的形式来构建、运行和管理这些应用包,无需维护自己的基础架构。
具体地,对于服务端渲染处理可以包括:Node FaaS应用首先调用下游HSF服务获取页面首屏的内容数据,然后调用RenderContext(渲染上下文)渲染器,根据页面首屏的内容数据和页面模板,生成首屏DOM(Document Object Model,文档对象模型)结构数据,这里的DOM结构数据即为渲染后的页面数据。客户端应用获取到该DOM结构数据后,便可以执行本地显示页面的代码,将页面展示在客户端上。
结合图1所示,上述步骤S101和步骤S102完成了从接收到客户端的页面访问请求,到从SSR应用中的服务端渲染处理模块获取到渲染后页面数据并返回给客户端的处理过程,即图中的实线箭头示出的链路。
S103:如果服务端渲染失败,则获取页面模板并发送给客户端应用,以执行客户端渲染处理。页面模板具体可以从页面模板托管平台来获取。上述的页面模板托管平台可以是用于执行客户端渲染处理而配置的服务模块,主要用于存储不同服务对应的页面模板数据。页面模板托管平台可以采用静态文件托管服务器的结构,页面模板数据作为一种静态资源文件加载在该静态文件托管服务器上,并向CDN服务器以及SSR应用提供受限访问的权限。在页面发布时,服务器可以获取与所述客户端应用对应的SSR应用提供的页面模板,并推送给所述页面模板托管平台,并存储在页面模板托管平台中,以便进行服务端渲染时使用。
服务端渲染失败的情形可以是服务器上的SSR应用出现宕机或者运行错误等,没有渲染出DOM结构数据,在这种情况下,SSR应用会返回服务端渲染失败的消息给CDN服务器,CDN服务器收到服务端渲染失败的消息后,可以执行备用渲染链路,访问页面模板托管平台来获取页面模板,并返回给客户端,从而执行客户端渲染处理。在这个过程中,在CDN服务器上直接完成了备份渲染链路的切换,无需客户端重新发起页面访问请求,从而节省了大量的页面处理时间。
结合图1所示,步骤S103完成了图中虚线所示的处理过程,在服务端渲染失败后,从页面模板托管平台处获取页面模板,返回给客户端应用后,客户端应用再通过与SSR应用中的内容数据提供模块的交互,来获取页面内容数据,并在客户端本地完成页面渲染。
此外,服务端渲染失败的情形还可以是,在服务器上SSR应用渲染出的DOM结构数据的是正常的,但是,该页面数据在到达客户端后,无法适配客户端本地的环境,从而无法正常显示。这种情况下,客户端在进行页面显示处理时,发生错误,然后上报给CDN服务器,CDN服务器在执行前面介绍的处理流程,向页面模板托管平台获取页面模板,触发执行客户端渲染处理。
上述的客户端渲染处理可以包括:客户端应用获取页面模板后,运行页面模板中的页面内容数据获取脚本,从SSR应用获取页面内容数据,并在客户端应用本地执行页面渲染处理,具体地,将获取到的页面内容数据和页面模板进行融合,生成DOM结构数据,并进行在客户端上的页面显示处理。
本发明实施例的页面数据处理方法,配置了主备两条页面渲染链路,并通过CDN服务器的边缘处理机制来实现主备链路的切换,当服务端渲染失败时,能够通过CDN服务器的处理快速切换到客户端渲染的链路上,从而提高了页面渲染处理的稳定性和快速响应性,并且由于仅在服务器端渲染失败时才使用客户端渲染,从而也大幅减轻了客户端进行渲染处理的负担。
此外,在本发明实施例中,服务器上的各个SSR应用可以通过SSR应用网关进行统一接入。相应地,上述的CDN服务器向SSR应用发送SSR请求可以包括:通过SSR应用网关向SSR应用发送SSR请求。此外,上述的CDN服务器接收SSR应用返回的渲染后的页面数据也可以通过SSR网关进行接收。即CDN服务器以及客户端应用与服务器上的SSR应用之间的交互,都可以通过SSR应用网关来实现。采用这样的架构可以实现服务器上的SSR应用的统一接入,不需要针对每个SSR应用进行单独配置,而是通过对SSR应用网关进行统一的域名申请、安全认证等配置处理,外网的客户端或者CDN服务器,可以安全地通过SSR应用网关来对服务器上的SSR应用进行访问。当有新的客户端应用发布时,可以在服务器上配置相应的SSR应用,并将SSR应用的相关信息添加到SSR应用网关上,从而实现该新应用的接入。这里所说的SSR应用的相关信息可以包括SSR应用的名称、地址信息以及该SSR应用对应的客户端应用的名称或者标识信息等,通过这些信息,当SSR应用网关接收到页面访问请求时,能够识别出该页面访问请求应当路由给哪个SSR应用来执行页面渲染处理。基于这种机制,不同服务之间能够采用独立的SSR应用,应用的研发、发布、运行时皆互相隔离,稳定性高。开发人员可以专注于SSR应用的内容开发,而无需考虑各环节的运维工作、主备链路也无需重复开发,从而提高了应用研发效率
如图3所示,其为本发明实施例的页面数据处理方法的流程示意图之二,该方法可以运行在服务器一侧,用于执行通过SSR网关对服务器上的SSR应用访问处理,具体地,该方法包括:
S201:通过SSR网关接收客户端应用的页面访问请求,根据访问请求携带的客户端应用信息,将该页面访问请求发送至服务器上的与该客户端应用对应的SSR应用。其中,上述的页面访问请求可以来自于CDN服务器,即SSR网关通过CDN服务器接收客户端应用的页面访问请求。
S202:基于SSR应用执行服务端渲染处理,并将服务端渲染处理结果返回给SSR网关。该步骤中的服务端渲染处理结果可以是渲染处理后生成的页面数据,也可以是渲染失败后的反馈消息。
S203:通过SSR网关将服务端渲染处理结果发送给与客户端应用信息对应的客户端应用。这里,与前面相对应地,SSR网关可以将渲染处理结果发送给CDN服务器,再有CDN服务器发送给客户端应用。
在本实施例的页面数据处理方法中,通过在服务器上配置SSR应用网关,能够便于多个SSR应用的统一接入,避免了对各个SSR应用的单独的接入配置,从而便于开发人员更加专注于页面代码的开发,而无需过多关注底层的SSR应用的接入处理。
另外,如图4所示,其为本发明实施例的SSR应用的框架结构示意图,该SSR应用整体上可以分为三层,最顶层为用于支持前端页面各种服务。中间层为Node层(节点层),使用Node Serverless(无服务器架构)进行开发,Node Serverless是一种轻运维技术,可以让前端工程师通过Node进行服务端功能的开发,Node层主要包括了页面内容数据服务、页面渲染服务以及日志管理等功能。页面渲染服务用于执行服务端渲染处理,而页面内容数据服务用于在服务端渲染处理失败的情况下,向客户端应用提供页面内容数据,日志管理用于记录SSR应用在执行各种处理的过程中所产生的日志。接口配置层用来进行各种接口配置,其中主要包括与SSR应用网关的对接、接口容灾方面的配置以及进行Serverless相关的各种配置等。基于图4所示的架构能够实现在服务器实现服务端页面渲染的相关处理,并可以向页面模板托管平台提供页面模板以及客户端提供页面内容数据的服务,该SSR应用可以通过对外发布Node函数服务的方式,供前端应用使用。
如图5所示,其为本发明实施例的页面数据处理装置的结构示意图。该装置可以设置在CDN服务器,以实现上述的SSR的主备双链路切换功能,该装置可以包括:
SSR请求处理模块11,用于响应于客户端应用的页面访问请求,向服务器发送SSR请求,触发服务器上与客户端应用对应的SSR应用执行服务端渲染处理。在客户端上,当用户要访问某个页面时,例如用户点击当前页面上的某个URL链接而触发访问新的页面,客户端应用会基于该URL向服务器发送页面访问请求,该请求会首先到达CDN服务器。
CDN服务器在接收到客户端应用的页面访问请求后,可以先读取页面缓存,如果未命中缓存,则执行向服务器的SSR应用发送SSR请求的处理,如果命中缓存,则向客户端应用返回缓存的页面数据。在命中页面缓存的情况下,相当于客户端应用已经拿到了可以显示的页面数据,从而直接进行页面首屏显示了。
服务端渲染处理模块12,用于在服务端渲染成功的情况下,将接收到SSR应用返回的渲染后的页面数据,发送给客户端应用进行页面显示。服务端渲染处理由服务器来执行,在服务器上设置有与客户端应用对应的SSR应用,当该SSR应用接收到页面访问请求后,便可以执行服务端渲染处理。服务端渲染处理主要包括从与SSR应用关联的提供内容数据的服务获取页面内容数据,结合所述SSR应用存储的页面模板,执行渲染上下文处理,生成包含首屏DOM(Document Object Model,文档对象模型)结构的页面数据。
客户端渲染处理模块13,用于在服务端渲染失败的情况下,获取页面模板并发送给客户端应用,以执行客户端渲染处理。页面模板具体可以从页面模板托管平台来获取。上述的页面模板托管平台可以是用于执行客户端渲染处理而配置的服务模块,主要用于存储不同服务对应的页面模板数据。页面模板托管平台可以采用静态文件托管服务器的结构,页面模板数据作为一种静态资源文件加载在该静态文件托管服务器上,并向CDN服务器以及SSR应用提供受限访问的权限。在页面发布时,服务器可以获取与所述客户端应用对应的SSR应用提供的页面模板,并推送给所述页面模板托管平台,并存储在页面模板托管平台中,以便进行服务端渲染时使用。
服务端渲染失败的情形可以是服务器上的SSR应用出现宕机或者运行错误等,没有渲染出DOM结构数据,在这种情况下,SSR应用会返回服务端渲染失败的消息给CDN服务器,CDN服务器收到服务端渲染失败的消息后,可以执行备用渲染链路,访问页面模板托管平台来获取页面模板,并返回给客户端,从而执行客户端渲染处理。
对于上述处理过程具体说明、技术原理详细说明以及技术效果详细分析在前面实施例中进行了详细描述,在此不再赘述。
本发明实施例的页面数据处理装置,配置了主备两条页面渲染链路,并通过CDN服务器的边缘处理机制来实现主备链路的切换,当服务端渲染失败时,能够通过CDN服务器的处理快速切换到客户端渲染的链路上,从而提高了页面渲染处理的稳定性和快速响应性,并且由于仅在服务器端渲染失败时才使用客户端渲染,从而也大幅减轻了客户端进行渲染处理的负担。
前面实施例描述了页面数据处理方法的流程处理及装置结构,上述的方法和装置的功能可借助一种电子设备实现完成,如图6所示,其为本发明实施例的电子设备的结构示意图,具体包括:存储器110和处理器120。
存储器110,用于存储程序。
除上述程序之外,存储器110还可被配置为存储其它各种数据以支持在电子设备上的操作。这些数据的示例包括用于在电子设备上操作的任何应用程序或方法的指令,联系人数据,电话簿数据,消息,图片,视频等。
存储器110可以由任何类型的易失性或非易失性存储设备或者它们的组合实现,如静态随机存取存储器(SRAM),电可擦除可编程只读存储器(EEPROM),可擦除可编程只读存储器(EPROM),可编程只读存储器(PROM),只读存储器(ROM),磁存储器,快闪存储器,磁盘或光盘。
处理器120,耦合至存储器110,用于执行存储器110中的程序,以执行前述实施例中所描述的页面数据处理方法的操作步骤。
此外,处理器120也可以包括前述实施例所描述的各种模块以执行页面数据处理方法的处理过程,并且存储器110可以例如用于存储这些模块执行操作所需要的数据和/或所输出的数据。
对于上述处理过程具体说明、技术原理详细说明以及技术效果详细分析在前面实施例中进行了详细描述,在此不再赘述。
进一步,如图所示,电子设备还可以包括:通信组件130、电源组件140、音频组件150、显示器160等其它组件。图中仅示意性给出部分组件,并不意味着电子设备只包括图中所示组件。
通信组件130被配置为便于电子设备和其他设备之间有线或无线方式的通信。电子设备可以接入基于通信标准的无线网络,如WiFi,2G、3G、4G/LTE、5G等移动通信网络,或它们的组合。在一个示例性实施例中,通信组件130经由广播信道接收来自外部广播管理系统的广播信号或广播相关信息。在一个示例性实施例中,通信组件130还包括近场通信(NFC)模块,以促进短程通信。例如,在NFC模块可基于射频识别(RFID)技术,红外数据协会(IrDA)技术,超宽带(UWB)技术,蓝牙(BT)技术和其他技术来实现。
电源组件140,为电子设备的各种组件提供电力。电源组件140可以包括电源管理系统,一个或多个电源,及其他与为电子设备生成、管理和分配电力相关联的组件。
音频组件150被配置为输出和/或输入音频信号。例如,音频组件150包括一个麦克风(MIC),当电子设备处于操作模式,如呼叫模式、记录模式和语音识别模式时,麦克风被配置为接收外部音频信号。所接收的音频信号可以被进一步存储在存储器110或经由通信组件130发送。在一些实施例中,音频组件150还包括一个扬声器,用于输出音频信号。
显示器160包括屏幕,其屏幕可以包括液晶显示器(LCD)和触摸面板(TP)。如果屏幕包括触摸面板,屏幕可以被实现为触摸屏,以接收来自用户的输入信号。触摸面板包括一个或多个触摸传感器以感测触摸、滑动和触摸面板上的手势。触摸传感器可以不仅感测触摸或滑动动作的边界,而且还检测与触摸或滑动操作相关的持续时间和压力。
此外,本发明实施例还提供了一种计算机程序产品,包括计算机程序或指令,当计算机程序或指令被处理器执行时,致使处理器实现前述的方法。
本领域普通技术人员可以理解:实现上述各方法实施例的全部或部分步骤可以通过程序指令相关的硬件来完成。前述的程序可以存储于计算机可读取存储介质中。该程序在执行时,执行包括上述各方法实施例的步骤;而前述的存储介质包括:ROM、RAM、磁碟或者光盘等各种可以存储程序代码的介质。
最后应说明的是:以上各实施例仅用以说明本发明的技术方案,而非对其限制;尽管参照前述各实施例对本发明进行了详细的说明,本领域的普通技术人员应当理解:其依然可以对前述各实施例所记载的技术方案进行修改,或者对其中部分或者全部技术特征进行等同替换;而这些修改或者替换,并不使相应技术方案的本质脱离本发明各实施例技术方案的范围。
Claims (10)
1.一种页面数据处理方法,包括:
响应于客户端应用的页面访问请求,向服务器发送SSR请求,触发服务器上与所述客户端应用对应的SSR应用执行服务端渲染处理;
根据服务器渲染结果执行如下处理:
如果服务端渲染成功,则将接收到所述SSR应用返回的渲染后的页面数据,发送给所述客户端应用进行页面显示;
如果服务端渲染失败,则获取页面模板并发送给客户端应用执行客户端渲染处理。
2.根据权利要求1所述的方法,其中,在服务器上设置有SSR应用网关,所述向服务器发送SSR请求包括:通过所述SSR应用网关向与所述客户端对应的SSR应用发送SSR请求。
3.根据权利要求1所述的方法,其中,所述获取页面模板并发送给客户端应用包括:从页面模板托管平台获取页面模板并发送给客户端应用。
4.根据权利要求3所述的方法,其中,还包括:
在页面发布时,获取与所述客户端应用对应的SSR应用提供的页面模板,并推送给所述页面模板托管平台。
5.根据权利要求1所述的方法,其中,触发服务器上与所述客户端应用对应的SSR应用执行服务端渲染处理包括:
从与所述SSR应用关联的提供内容数据的服务获取页面内容数据,结合所述SSR应用存储的页面模板,执行渲染上下文处理,生成包含首屏DOM结构的页面数据。
6.根据权利要求1所述的方法,其中,还包括:
在接收到客户端应用的页面访问请求后,先读取页面缓存,如果未命中缓存,则执行向服务器的SSR应用发送SSR请求的处理,如果命中缓存,则向所述客户端应用返回缓存的页面数据。
7.一种页面数据处理方法,应用于服务器,所述方法包括:
通过SSR网关接收客户端应用的页面访问请求,根据访问请求携带的客户端应用信息,将该页面访问请求发送至服务器上的与该客户端应用对应的SSR应用;
基于所述SSR应用执行服务端渲染处理,并将服务端渲染处理结果返回给SSR网关;
通过所述SSR网关将服务端渲染处理结果发送给与所述客户端应用信息对应的所述客户端应用。
8.根据权利要求7所述的方法,其中,服务器上的SSR网关接收客户端应用的页面访问请求包括:所述SSR网关通过CDN服务器接收客户端应用的页面访问请求。
9.一种页面数据的处理装置,包括:
SSR请求处理模块,用于响应于客户端应用的页面访问请求,向服务器发送SSR请求,触发服务器上与所述客户端应用对应的的SSR应用执行服务端渲染处理,获取服务器渲染结果并执行判定处理,
服务端渲染处理模块,用于在服务端渲染成功的情况下,将接收到所述SSR应用返回的渲染后的页面数据,发送给所述客户端应用进行页面显示,
客户端渲染处理模块,用于在服务端渲染失败的情况下,获取页面模板并发送给客户端应用执行客户端渲染处理。
10.一种电子设备,包括:
存储器,用于存储程序;
处理器,用于运行所述存储器中存储的所述程序,以执行权利要求1至8任一所述的页面数据处理方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110791369.9A CN113645062A (zh) | 2021-07-13 | 2021-07-13 | 页面数据处理方法、装置及电子设备 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202110791369.9A CN113645062A (zh) | 2021-07-13 | 2021-07-13 | 页面数据处理方法、装置及电子设备 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN113645062A true CN113645062A (zh) | 2021-11-12 |
Family
ID=78417236
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202110791369.9A Pending CN113645062A (zh) | 2021-07-13 | 2021-07-13 | 页面数据处理方法、装置及电子设备 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN113645062A (zh) |
Cited By (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114138397A (zh) * | 2021-12-10 | 2022-03-04 | 北京百度网讯科技有限公司 | 页面显示方法、装置、电子设备及存储介质 |
CN114500484A (zh) * | 2021-12-24 | 2022-05-13 | 中国电信股份有限公司 | 页面渲染方法、装置、电子设备及可读介质 |
CN115080063A (zh) * | 2022-06-17 | 2022-09-20 | 阿里巴巴(中国)有限公司 | 基于边缘计算的业务处理方法、边缘设备及可读存储介质 |
Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US9218267B1 (en) * | 2013-08-14 | 2015-12-22 | Amazon Technologies, Inc. | Page rendering feedback |
CN108156013A (zh) * | 2016-12-02 | 2018-06-12 | 阿里巴巴集团控股有限公司 | 一种页面服务容灾方法、装置及电子设备 |
CN108763551A (zh) * | 2018-06-01 | 2018-11-06 | 阿里巴巴集团控股有限公司 | 页面渲染方法、装置、服务器及计算机可读存储介质 |
US20190065619A1 (en) * | 2017-08-24 | 2019-02-28 | Coursera, Inc. | Scalable server-side rendering |
CN110750705A (zh) * | 2018-07-06 | 2020-02-04 | 北京高德云图科技有限公司 | 搜索结果的展示方法和装置以及电子设备 |
CN111708600A (zh) * | 2020-08-20 | 2020-09-25 | 腾讯科技(深圳)有限公司 | 页面显示方法、装置、设备及计算机可读存储介质 |
CN111782464A (zh) * | 2020-06-22 | 2020-10-16 | 北京异乡旅行网络科技有限公司 | 一种网页动态异常监控方法及系统 |
CN112149017A (zh) * | 2020-09-14 | 2020-12-29 | 京东数字科技控股股份有限公司 | 一种网页访问方法、装置、系统、电子设备及存储介质 |
CN112699326A (zh) * | 2019-10-23 | 2021-04-23 | 上海哔哩哔哩科技有限公司 | 一种网页页面渲染控制方法及装置 |
-
2021
- 2021-07-13 CN CN202110791369.9A patent/CN113645062A/zh active Pending
Patent Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US9218267B1 (en) * | 2013-08-14 | 2015-12-22 | Amazon Technologies, Inc. | Page rendering feedback |
CN108156013A (zh) * | 2016-12-02 | 2018-06-12 | 阿里巴巴集团控股有限公司 | 一种页面服务容灾方法、装置及电子设备 |
US20190065619A1 (en) * | 2017-08-24 | 2019-02-28 | Coursera, Inc. | Scalable server-side rendering |
CN108763551A (zh) * | 2018-06-01 | 2018-11-06 | 阿里巴巴集团控股有限公司 | 页面渲染方法、装置、服务器及计算机可读存储介质 |
CN110750705A (zh) * | 2018-07-06 | 2020-02-04 | 北京高德云图科技有限公司 | 搜索结果的展示方法和装置以及电子设备 |
CN112699326A (zh) * | 2019-10-23 | 2021-04-23 | 上海哔哩哔哩科技有限公司 | 一种网页页面渲染控制方法及装置 |
CN111782464A (zh) * | 2020-06-22 | 2020-10-16 | 北京异乡旅行网络科技有限公司 | 一种网页动态异常监控方法及系统 |
CN111708600A (zh) * | 2020-08-20 | 2020-09-25 | 腾讯科技(深圳)有限公司 | 页面显示方法、装置、设备及计算机可读存储介质 |
CN112149017A (zh) * | 2020-09-14 | 2020-12-29 | 京东数字科技控股股份有限公司 | 一种网页访问方法、装置、系统、电子设备及存储介质 |
Non-Patent Citations (1)
Title |
---|
MOB604756F318E7: "如何搭建一个高可用的服务端渲染工程", Retrieved from the Internet <URL:https://blog.51cto.com/u_15127581/2749150> * |
Cited By (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114138397A (zh) * | 2021-12-10 | 2022-03-04 | 北京百度网讯科技有限公司 | 页面显示方法、装置、电子设备及存储介质 |
CN114138397B (zh) * | 2021-12-10 | 2024-06-07 | 北京百度网讯科技有限公司 | 页面显示方法、装置、电子设备及存储介质 |
CN114500484A (zh) * | 2021-12-24 | 2022-05-13 | 中国电信股份有限公司 | 页面渲染方法、装置、电子设备及可读介质 |
CN115080063A (zh) * | 2022-06-17 | 2022-09-20 | 阿里巴巴(中国)有限公司 | 基于边缘计算的业务处理方法、边缘设备及可读存储介质 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN113645062A (zh) | 页面数据处理方法、装置及电子设备 | |
CN110417842B (zh) | 用于网关服务器的故障处理方法和装置 | |
US11233841B2 (en) | Systems and methods for configuration-based optimization by an intermediary | |
US9183319B2 (en) | Method and apparatus for automatically optimizing the loading of images in a cloud-based proxy service | |
CN109542427B (zh) | 一种系统定制方法、装置及电子设备和存储介质 | |
US9235398B2 (en) | Development of platform independent applications | |
TWI686702B (zh) | 檔案傳輸方法及裝置 | |
TW201441829A (zh) | 頁面處理方法和裝置以及頁面生成方法和裝置 | |
US20200106860A1 (en) | Offline client replay and sync | |
KR20170102289A (ko) | 애플리케이션 서비스 아바타를 통한 애플리케이션 서비스 전달 | |
CN104754073A (zh) | 一种资源访问方法及装置 | |
US9158520B2 (en) | Development of platform independent applications | |
CN114168460B (zh) | 混合开发中前端代码的远程调试方法、设备及存储介质 | |
US12074918B2 (en) | Network-based Media Processing (NBMP) workflow management through 5G Framework for Live Uplink Streaming (FLUS) control | |
US20130151595A1 (en) | Deployment and hosting of platform independent applications | |
US20130036197A1 (en) | Method and system for a mobile local server | |
CN116055524A (zh) | 用于互联网平台与物联网设备的交互方法、处理器及装置 | |
US10536506B2 (en) | Webpage analytics and control | |
US20200112830A1 (en) | System and method for transmitting dynamic content to mobile devices | |
CN103229461A (zh) | 访问跨多个计算机的应用和内容的方法、设备和系统 | |
US20120096096A1 (en) | Mobile communication terminal to provide widget expansion function using message communication, and operation method of the mobile communication terminal | |
CN110209964A (zh) | 一种页面显示方法、装置及设备 | |
WO2023066053A1 (zh) | 业务请求处理方法、网络设备及计算机可读存储介质 | |
CN110928547A (zh) | 公共文件的提取方法、装置、终端和存储介质 | |
CN114168177B (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 | ||
TA01 | Transfer of patent application right |
Effective date of registration: 20240307 Address after: Singapore Applicant after: Alibaba Innovation Co. Country or region after: Singapore Address before: Room 01, 45th Floor, AXA Building, 8 Shanton Road, Singapore Applicant before: Alibaba Singapore Holdings Ltd. Country or region before: Singapore |
|
TA01 | Transfer of patent application right |