CN115577200B - 加载页面的方法、装置、设备以及存储介质 - Google Patents
加载页面的方法、装置、设备以及存储介质 Download PDFInfo
- Publication number
- CN115577200B CN115577200B CN202211195351.3A CN202211195351A CN115577200B CN 115577200 B CN115577200 B CN 115577200B CN 202211195351 A CN202211195351 A CN 202211195351A CN 115577200 B CN115577200 B CN 115577200B
- Authority
- CN
- China
- Prior art keywords
- target page
- sub
- server
- target
- data
- 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.)
- Active
Links
- 238000011068 loading method Methods 0.000 title claims abstract description 69
- 238000000034 method Methods 0.000 claims abstract description 49
- 230000004044 response Effects 0.000 claims abstract description 33
- 230000006870 function Effects 0.000 claims description 17
- 238000004590 computer program Methods 0.000 claims description 13
- 238000005516 engineering process Methods 0.000 claims description 10
- 230000000712 assembly Effects 0.000 claims description 7
- 238000000429 assembly Methods 0.000 claims description 7
- 238000004891 communication Methods 0.000 description 11
- 238000010586 diagram Methods 0.000 description 11
- 238000012545 processing Methods 0.000 description 8
- 230000000694 effects Effects 0.000 description 4
- 238000012423 maintenance Methods 0.000 description 4
- 230000008569 process Effects 0.000 description 4
- 238000012986 modification Methods 0.000 description 3
- 230000004048 modification Effects 0.000 description 3
- 230000003287 optical effect Effects 0.000 description 3
- 238000012546 transfer Methods 0.000 description 3
- 238000011161 development Methods 0.000 description 2
- 230000003993 interaction Effects 0.000 description 2
- 230000003068 static effect Effects 0.000 description 2
- 238000004458 analytical method Methods 0.000 description 1
- 238000003491 array Methods 0.000 description 1
- 238000013473 artificial intelligence Methods 0.000 description 1
- 238000013475 authorization Methods 0.000 description 1
- 238000004422 calculation algorithm Methods 0.000 description 1
- 230000001413 cellular effect Effects 0.000 description 1
- 238000010276 construction Methods 0.000 description 1
- 230000007547 defect Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 239000000835 fiber Substances 0.000 description 1
- 239000004973 liquid crystal related substance Substances 0.000 description 1
- 238000010801 machine learning Methods 0.000 description 1
- 239000013307 optical fiber Substances 0.000 description 1
- 239000004065 semiconductor Substances 0.000 description 1
- 230000001953 sensory effect Effects 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
- 230000000007 visual effect Effects 0.000 description 1
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
-
- 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/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/36—Software reuse
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/70—Software maintenance or management
- G06F8/71—Version control; Configuration management
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/70—Software maintenance or management
- G06F8/76—Adapting program code to run in a different environment; Porting
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Data Mining & Analysis (AREA)
- Human Computer Interaction (AREA)
- Computer Security & Cryptography (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本公开提供了一种加载页面的方法、装置、设备以及存储介质,涉及软件开发技术、微前端技术领域。具体实现方案为:向主服务器发送访问请求,其中,访问请求用于获取与目标页面对应的目标页面数据;响应于接收到目标页面数据,根据目标页面数据,向主服务器发送公共组件获取请求,其中,公共组件获取请求用于获取与目标页面中公共组件对应的公共组件数据;以及响应于接收到公共组件数据,根据目标页面数据和公共组件数据,加载目标页面。
Description
技术领域
本公开涉及计算机技术领域,尤其涉及软件开发技术、微前端技术领域,具体涉及一种加载页面的方法、装置、设备以及存储介质。
背景技术
不同技术栈开发的软件项目为了实现浏览器界面显示效果的一致性,需要针对每个技术栈分别开发对应的公共组件。当公共组件的版本更新时,又需要分别对由每个技术栈开发的公共组件进行更新,工作量较大。
发明内容
本公开提供了一种加载页面的方法、装置、设备、存储介质以及程序产品。
根据本公开的一方面,提供了一种加载页面的方法,包括:向主服务器发送访问请求,其中,所述访问请求用于获取与目标页面对应的目标页面数据;响应于接收到所述目标页面数据,根据所述目标页面数据,向所述主服务器发送公共组件获取请求,其中,所述公共组件获取请求用于获取与目标页面中公共组件对应的公共组件数据;以及响应于接收到所述公共组件数据,根据所述目标页面数据和所述公共组件数据,加载所述目标页面。
根据本公开的另一方面,提供了一种加载页面的方法,包括:响应于接收到来自终端设备的访问请求,从多个子服务器中确定与所述访问请求对应的目标子服务器,其中,所述访问请求用于获取与目标页面对应的目标页面数据;向所述目标子服务器发送所述访问请求,以便所述目标子服务器将所述目标页面数据发送至与所述访问请求对应的终端设备;响应于接收到来自所述终端设备的公共组件获取请求,确定与所述公共组件获取请求对应的公共组件数据;以及将所述公共组件数据发送至所述终端设备,以使得所述终端设备根据所述公共组件数据,加载所述目标页面。
根据本公开的另一方面,提供了一种加载页面的方法,包括:响应于接收到来自主服务器的访问请求,确定与所述访问请求对应的目标页面数据,其中,所述目标页面数据包括与公共组件对应的公共组件标签;以及将所述目标页面数据发送至与所述访问请求对应的终端设备,以使得所述终端设备根据所述目标页面数据,加载所述目标页面。
根据本公开的另一方面,提供了一种加载页面的装置,包括:第一发送模块,用于向主服务器发送访问请求,其中,所述访问请求用于获取与目标页面对应的目标页面数据;第二发送模块,用于响应于接收到所述目标页面数据,根据所述目标页面数据,向所述主服务器发送公共组件获取请求,其中,所述公共组件获取请求用于获取与目标页面中公共组件对应的公共组件数据;以及加载模块,用于响应于接收到所述公共组件数据,根据所述目标页面数据和所述公共组件数据,加载所述目标页面。
根据本公开的另一方面,提供了一种加载页面的装置,包括:确定模块,用于响应于接收到来自终端设备的访问请求,从多个子服务器中确定与所述访问请求对应的目标子服务器,其中,所述访问请求用于获取与目标页面对应的目标页面数据;第三发送模块,用于向所述目标子服务器发送所述访问请求,以便所述目标子服务器将所述目标页面数据发送至与所述访问请求对应的终端设备;第二确定模块,用于响应于接收到来自所述终端设备的公共组件获取请求,确定与所述公共组件获取请求对应的公共组件数据;以及第四发送模块,用于将所述公共组件数据发送至所述终端设备,以使得所述终端设备根据所述公共组件数据,加载所述目标页面。
根据本公开的另一方面,提供了一种加载页面的装置,包括:第五确定模块,用于响应于接收到来自主服务器的访问请求,确定与所述访问请求对应的目标页面数据,其中,所述目标页面数据包括与公共组件对应的公共组件标签;以及第五发送模块,用于将所述目标页面数据发送至与所述访问请求对应的终端设备,以使得所述终端设备根据所述目标页面数据,加载所述目标页面。
根据本公开的另一方面,提供了加载页面的系统,包括:终端设备、主服务器和与所述主服务器对应的多个子服务器,其中,所述终端设备用于:向主服务器发送访问请求,其中,所述访问请求用于获取与目标页面对应的目标页面数据;响应于接收到所述目标页面数据,根据所述目标页面数据,向所述主服务器发送公共组件获取请求,其中,所述公共组件获取请求用于获取与目标页面中公共组件对应的公共组件数据;以及响应于接收到所述公共组件数据,根据所述目标页面数据和所述公共组件数据,加载所述目标页面;所述主服务器用于:响应于接收到来自终端设备的访问请求,从多个子服务器中确定与所述访问请求对应的目标子服务器,其中,所述访问请求用于获取与目标页面对应的目标页面数据;向所述目标子服务器发送所述访问请求;响应于接收到来自所述终端设备的公共组件获取请求,确定与所述公共组件获取请求对应的公共组件数据;以及将所述公共组件数据发送至所述终端设备;所述子服务器用于:响应于接收到来自主服务器的访问请求,确定与所述访问请求对应的目标页面数据,其中,所述目标页面数据包括与公共组件对应的公共组件标签;以及将所述目标页面数据发送至与所述访问请求对应的终端设备。
本公开的另一个方面提供了一种电子设备,包括:至少一个处理器;以及与所述至少一个处理器通信连接的存储器;其中,所述存储器存储有可被所述至少一个处理器执行的指令,所述指令被所述至少一个处理器执行,以使所述至少一个处理器能够执行本公开实施例所示的方法。
根据本公开实施例的另一方面,提供了一种存储有计算机指令的非瞬时计算机可读存储介质,其中,所述计算机指令用于使所述计算机执行本公开实施例所示的方法。
根据本公开实施例的另一方面,提供了一种计算机程序产品,包括计算机程序/指令,其特征在于,该计算机程序/指令被处理器执行时实现本公开实施例所示方法的步骤。
应当理解,本部分所描述的内容并非旨在标识本公开的实施例的关键或重要特征,也不用于限制本公开的范围。本公开的其它特征将通过以下的说明书而变得容易理解。
附图说明
附图用于更好地理解本方案,不构成对本公开的限定。其中:
图1示意性示出了根据本公开实施例的可以应用加载页面的方法和装置的示例性系统架构;
图2示意性示出了根据本公开的实施例的加载页面的方法的流程图;
图3示意性示出了根据本公开另一实施例的加载页面的方法的流程图;
图4示意性示出了根据本公开另一实施例的加载页面的方法的流程图;
图5示意性示出了根据本公开另一实施例的加载页面的方法的流程图;
图6示意性示出了根据本公开的实施例的公共组件的示意图;
图7示意性示出了根据本公开的实施例的加载页面的方法示意图;
图8示意性示出了根据本公开实施例的加载页面的装置的框图;
图9示意性示出了根据本公开另一实施例的加载页面的装置的框图;
图10示意性示出了根据本公开另一实施例的加载页面的装置的框图;以及
图11示意性示出了可以用来实施本公开的实施例的示例电子设备的框图。
具体实施方式
以下结合附图对本公开的示范性实施例做出说明,其中包括本公开实施例的各种细节以助于理解,应当将它们认为仅仅是示范性的。因此,本领域普通技术人员应当认识到,可以对这里描述的实施例做出各种改变和修改,而不会背离本公开的范围和精神。同样,为了清楚和简明,以下的描述中省略了对公知功能和结构的描述。
以下将结合图1对本公开提供的加载页面的方法和装置的系统架构进行描述。
图1示意性示出了根据本公开实施例的可以应用加载页面的方法和装置的示例性系统架构100。需要注意的是,图1所示仅为可以应用本公开实施例的系统架构的示例,以帮助本领域技术人员理解本公开的技术内容,但并不意味着本公开实施例不可以用于其他设备、系统、环境或场景。
如图1所示,根据该实施例的系统架构100可以包括终端设备101、102、103,网络104、主服务器105、子服务器106、107和108。网络104用以在终端设备101、102、103、主服务器105、子服务器106、107和108之间提供通信链路的介质。网络104可以包括各种连接类型,例如有线、无线通信链路或者光纤电缆等等。
用户可以使用终端设备101、102、103通过网络104与服务器105交互,以接收或发送消息等。终端设备101、102、103上可以安装有各种通讯客户端应用,例如购物类应用、网页浏览器应用、搜索类应用、即时通信工具、邮箱客户端、社交平台软件等(仅为示例)。
终端设备101、102、103可以是具有显示屏并且支持网页浏览的各种电子设备,包括但不限于智能手机、平板电脑、膝上型便携计算机和台式计算机等等。
主服务器105可以提供转发服务,用于接收来自终端设备的用户请求等数据,然后将用户请求等数据转发至对应子服务器。示例性地,本实施例中,主服务器105中可以部署nginx,可以使用nginx实现转发服务。
子服务器106、107和108可以是提供各种服务的服务器,例如对用户利用终端设备101、102、103所浏览的网站提供支持的后台管理服务器(仅为示例)。后台管理服务器可以对接收到的用户请求等数据进行分析等处理,并将处理结果(例如根据用户请求获取或生成的网页、信息、或数据等)反馈给终端设备。
根据本公开的实施例,主服务器105、子服务器106、107和108可以是云服务器,又称为云计算服务器或云主机,是云计算服务体系中的一项主机产品,以解决了传统物理主机与VPS服务(″Virtual Private Server″,或简称″VPS″)中,存在的管理难度大,业务扩展性弱的缺陷。主服务器105、子服务器106、107和108也可以为分布式系统的服务器,或者是结合了区块链的服务器。
应该理解,图1中的终端设备、网络、主服务器和子服务器的数目仅仅是示意性的。根据实现需要,可以具有任意数目的终端设备、网络和主服务器和子服务器。
根据本公开的实施例,主服务器105、子服务器106、107和108例如可以归属同一主系统。子服务器106、107和108可以分别对应于该主系统中不同的子系统。各个子系统可以基于相同或不同的技术栈开发。示例性地,本实施例中,主系统可以为网站,子系统可以为子网站。技术栈例如可以包括vue和react等等。
为了各子系统页面显示效果和功能的一致性,可以开发公共组件,并在每个子系统页面中展示公共组件,公共组件在各子系统页面中具有一致的显示效果和功能。但是,对于由不同的技术栈开发的子系统,需要分别使用对应技术栈来为每个子系统开发对应的公共组件,工作量较大,另外限制了整个系统的扩展性和兼容性。
根据本公开的实施例,例如可以基于Web Compoents(网页部件)技术开发公共组件,并实现公共组件的封装。然后可以将该子系统添加至每个子系统的页面中,从而实现显示效果和功能的一致性。由此,对各个子系统侵入性低,接入成本低,每个子系统可以和主系统同时运行,另外各个子系统之间可以是独立运行的。
在本公开的技术方案中,所涉及的用户个人信息的收集、存储、使用、加工、传输、提供、公开和应用等处理,均符合相关法律法规的规定,采取了必要保密措施,且不违背公序良俗。
在本公开的技术方案中,在获取或采集用户个人信息之前,均获取了用户的授权或同意。
以下将结合图2-5对本公开提供的加载页面的方法进行描述。
图2示意性示出了根据本公开的实施例的加载页面的方法的流程图。该方法例如可以由上文所示的终端设备执行。
如图2所示,该加载页面的方法200包括在操作S210,向主服务器发送访问请求。
根据本公开的实施例,访问请求例如可以用于获取与目标页面对应的目标页面数据。目标页面数据可以为加载目标页面所需的数据。
根据本公开的实施例,公共组件获取请求可以用于获取与目标页面中公共组件对应的公共组件数据。公共组件数据可以为加载公共组件所需的数据,例如可以包括公共组件的样式信息和功能信息等信息。
根据本公开的实施例,主服务器在接收到来自终端设备的访问请求之后,例如可以确定与访问请求对应的目标页面数据,然后将目标页面数据发送至终端设备。或者,主服务器可以将访问请求发送至除主服务器之外的其他服务器,有其他服务器确定与访问请求对应的目标页面数据,然后将目标页面数据发送至终端设备。
示例性地,主服务器例如可以对应多个子服务器。主服务器在接收到来自终端设备的访问请求之后,例如可以从多个子服务器中确定与访问请求对应的目标子服务器。其中,目标子服务器例如可以为目标页面提供后台管理的子服务器。然后指示目标子服务器将与访问请求对应的目标页面数据发送至该终端设备。
然后,在操作S220,响应于接收到目标页面数据,根据目标页面数据,向主服务器发送公共组件获取请求。
根据本公开的实施例,主服务器在接收到来自终端设备的公共组件获取请求之后,可以根据公共组件获取请求,确定对应的公共组件数据。然后向终端设备发送该公共组件数据。或者,主服务器可以将公共组件获取请求发送至除主服务器之外的其他服务器,有其他服务器确定与公共组件获取请求对应的公共组件数据,然后将公共组件数据发送至终端设备。
示例性地,主服务器例如可以对应多个子服务器。主服务器在接收到来自终端设备的公共组件获取请求之后,例如可以从多个子服务器中确定与公共组件获取请求对应的目标子服务器。然后指示目标子服务器将与公共组件获取请求对应的公共组件数据发送至该终端设备。
在操作S230,响应于接收到公共组件数据,根据目标页面数据和公共组件数据,加载目标页面。
根据本公开的实施例,公共组件可以兼容多种技术栈,可以在不同技术栈的子系统中使用相同的公共组件,不需要针对每个子系统单独开发和维护公共组件,降低了开发和维护成本,提高了效率。
图3示意性示出了根据本公开另一实施例的加载页面的方法的流程图。该方法例如可以由上文所示的主服务器执行。
如图3所示,该加载页面的方法300包括在操作S310,响应于接收到来自终端设备的访问请求,从多个子服务器中确定与访问请求对应的目标子服务器。
根据本公开的实施例,访问请求例如可以用于获取与目标页面对应的目标页面数据。主服务器例如可以对应多个子服务器。目标子服务器例如可以为多个子服务器中为目标页面提供后台管理的子服务器。
根据本公开的实施例,主服务器可以拦截对各子服务器的访问请求,然后统一转发至对应的子服务器。
在操作S320,向目标子服务器发送访问请求,以便目标子服务器将目标页面数据发送至与访问请求对应的终端设备。
根据本公开的实施例,目标子服务器接收到来自主服务器的访问请求之后,可以确定与访问请求对应的目标页面数据,然后将目标页面数据发送至与访问请求对应的终端设备。或者,目标子服务器可以将目标页面数据发送至主服务器,由主服务器发送至终端设备。
在操作S330,响应于接收到来自终端设备的公共组件获取请求,确定与公共组件获取请求对应的公共组件数据。
根据本公开的实施例,公共组件获取请求用于获取与目标页面中公共组件对应的公共组件数据。主服务器在接收到来自终端设备的公共组件获取请求后,可以根据公共组件获取请求,确定与目标页面中公共组件对应的公共组件数据。
在操作S340,将公共组件数据发送至终端设备,以使得终端设备根据公共组件数据,加载目标页面。
根据本公开的实施例,通过将公共组件数据发送至终端设备,可以使终端设备在加载目标页面时,将公共组件加载至目标页面中。
根据本公开的实施例,可以将最新可用版本的公共组件数据存储在主服务器中,由主服务器拦截公共组件获取请求,并根据公共组件获取请求向终端设备发送对应的公共组件数据。当公共组件的版本发生变更时,不用对每个子系统进行升级,降低了人力成本,提高了维护效率,解决了上线之后各个子系统可能存在公共组件不一致的问题。
根据本公开的另一实施例,主服务器可以将公共组件获取请求转发给对应的目标子服务器,然后由目标子服务器根据公共组件获取请求,确定确定与目标页面中公共组件对应的公共组件数据。目标子服务器可以将公共组件数据发送至对应的终端设备,或者,可以将公共组件数据发送至主服务器,然后通过主服务器将公共组件数据发送至终端。
图4示意性示出了根据本公开另一实施例的加载页面的方法的流程图。该方法例如可以由上文所示的子服务器执行。
如图4所示,该加载页面的方法400包括在操作S410,响应于接收到来自主服务器的访问请求,确定与访问请求对应的目标页面数据。
根据本公开的实施例,目标页面数据可以包括加载目标页面所需的数据。目标页面数据中可以包括公共组件标签,每个公共组件标签可以用于表示一个公共组件。可以根据目标页面数据中包括的公共组件标签,确定目标页面包含哪些公共组件。访问请求例如可以用于获取与目标页面对应的目标页面数据。子服务器可以根据访问请求,确定目标页面,进而确定目标页面的页面数据,作为目标页面数据。
在操作S420,将目标页面数据发送至与访问请求对应的终端设备,以使得终端设备根据目标页面数据,加载目标页面。
根据本公开的实施例,子服务器可以根据访问请求,确定发送该访问请求的终端设备,然后将目标页面数据发送至该终端设备,以使得终端设备根据目标页面数据,加载目标页面。
图5示意性示出了根据本公开另一实施例的加载页面的方法的流程图。
如图5所示,该加载页面的方法500包括在操作S510,终端设备向主服务器发送访问请求。
根据本公开的实施例,访问请求例如可以用于获取与目标页面对应的目标页面数据。目标页面例如可以包括网页,目标页面数据例如可以包括HTML(Hyper Text Markuplanguage,超文本标记语言)文件、JavaScript(一种脚本语言)文件、CSS(Cascading StyleSheets,层叠样式表)文件、图片、视频等。
在操作S520,主服务器响应于接收到来自终端设备的访问请求,从多个子服务器中确定与访问请求对应的目标子服务器。
根据本公开的实施例,目标子服务器例如可以为目标页面提供后台管理的子服务器。访问请求例如可以用于请求目标子服务器来获取与目标页面对应的目标页面数据。主服务器可以拦截对各子服务器的访问请求,然后统一进行转发。
在操作S530,主服务器向目标子服务器发送访问请求。
在操作S540,目标子服务器响应于接收到来自主服务器的访问请求,确定与访问请求对应的目标页面数据。
根据本公开的实施例,目标页面可以包括公共组件。其中,公共组件例如可以包括菜单栏、页眉、页脚等等。公共组件标签可以用于表示目标页面中包括的哪些公共组件,公共组件标签在目标页面数据中的位置可以用于表示公共组件在目标页面中的位置。公共组件可以通过公共组件标签来设置于目标页面中。基于此,目标页面数据可以包括公共组件标签。
在操作S550,目标子服务器将目标页面数据发送至与访问请求对应的终端设备。
然后,在操作S560,终端设备响应于接收到目标页面数据,根据目标页面数据,向主服务器发送公共组件获取请求。
根据本公开的实施例,公共组件获取请求用于获取与目标页面中公共组件对应的公共组件数据。公共组件数据可以包括公共组件的样式信息和功能信息等信息。
在操作S570,主服务器响应于接收到来自终端设备的公共组件获取请求,确定与公共组件获取请求对应的公共组件数据。
在操作S580,主服务器将公共组件数据发送至终端设备。
在操作S590,终端设备响应于接收到公共组件数据,根据目标页面数据和公共组件数据,加载目标页面。
根据本公开的实施例,终端设备可以目标页面数据和公共组件数据加载目标页面。其中,目标页面包括公共组件。终端设备可以根据公共组件数据配置目标页面中公共组件的样式和功能。
根据本公开的实施例,不同技术栈可以对应不同的子系统,每个子系统的页面中都有一个公共组件。通过公共组件,每个子系统可以在页面中指定位置显示相同的样式,具备相同的功能。
根据本公开的实施例,公共组件可以基于Web Compoents技术开发。基于webcomponents开发的公共组件可以兼容多种技术栈,兼容性较高。通过在不同技术栈的子系统中使用基于Web Compoents技术开发的公共组件,不需要针对每个子系统单独开发和维护公共组件,降低了开发和维护成本,提高了效率。
根据本公开的实施例,可以将最新可用版本的公共组件数据存储在主服务器中。当公共组件的版本发生变更时,不用对每个子系统进行升级,降低了人力成本,提高了维护效率,解决了上线之后各个子系统可能存在公共组件不一致的问题。
根据本公开的实施例,用户可以利用子服务器预先开发子系统的原始页面数据。然后可以在原始页面数据中加入公共组件标签,得到目标页面数据。
示例性地,本实施例中,公共组件标签例如可以包括<common-header></common-header>。基于此,可以通过在原始页面数据中添加<common-header></common-header>,来将公共组件添加至子系统的页面中。由此,在子系统的页面中可以像普通组件一样使用公共组件,使用更为便捷。
根据本公开的实施例,公共组件可以由可以公共组件数据来规定样式和功能。基于此,可以在原始页面数据中引入公共组件的公共组件数据。例如,可以通过在原始页面数据中添加以下信息来引入公共组件的公共组件数据:<script type=″module″src=″./static/commonHeader.js″></script>。其中,″./static/commonHeader.js″可以表示公共组件数据的位置,commonHeader.js可以为公共组件数据。由此,便可以在子系统中使用公共组件。
根据本公开的实施例,终端设备可以识别目标页面数据中的公共组件标签。然后根据目标页面数据加载目标页面,并根据公共组件数据,在目标页面中与公共组件标签对应的位置处加载公共组件。
根据本公开的实施例,例如可以预先为各个子系统配置唯一标识。然后可以为各个子系统的页面配置包含子系统标识的网址。
基于此,终端设备可以获取原始网址,其中,原始网址包括域名和路径,域名与主服务器对应。然后将与目标页面对应的子服务器标识添加至原始网址的路径中,得到目标网址。根据目标网址,生成访问请求。其中,访问请求例如可以包括HTTP(Hyper TextTransfer Protocol,超文本传输协议)请求、HTTPS(Hyper Text Transfer ProtocolSecure,超文本传输安全协议)请求等。需要说明的是,本公开对访问请求的类型不作具体限定。
对应地,主服务器可以解析目标网址,得到子服务器标识。然后根据子服务器标识,确定目标子服务器。
下面参考图6,结合具体实施例对上文所示的公共组件做进一步说明。本领域技术人员可以理解,以下示例实施例仅用于理解本公开,本公开并不局限于此。
图6示意性示出了根据本公开的实施例的公共组件的示意图。
在图6中示出了,每个子系统例如可以为一个网站。公共组件可以展示在网站的页面中。示例性地,本实施例中,公共组件例如可以包括“主菜单”、“子系统名称”、“子系统菜单”、“文档和帮助菜单”、“用户头像”等元素。另外,公共组件中的元素可以配置对应的样式和功能。例如,“主菜单”可以被配置为按钮样式,并被配置为在被点击后展示主菜单列表。又例如,“用户头像”被配置为圆形样式,并被配置为在被点击后展示用户功能列表,包括用户名、用户中心、退出登录等项目。示例性地,“主菜单”和“用户头像”可以统一规定样式和功能,每个子系统配置相同。“子系统名称”、“子系统菜单”和“文档和帮助菜单”可以由子系统自定义配置。另外,公共组件可以实现统一的登录拦截,每个子系统引入公共组件后默认实现了登录拦截的统一。
下面参考图7,结合具体实施例对上文所示的加载页面的方法做进一步说明。本领域技术人员可以理解,以下示例实施例仅用于理解本公开,本公开并不局限于此。
图7示意性示出了根据本公开的实施例的加载页面的方法示意图。
在图7中示出了,各子系统的网址可以为url。其中,url中可以包含每个子系统的唯一标识,例如/a,/b等。示例性地,本实施例中,用户可以通过终端设备在浏览器中输入子系统a的网址xxx.com/a,生成对应访问请求,发送至对应的子服务器。
主服务器可以识别并拦截终端设备发送的访问请求。根据访问请求对应url中的标识,确定用户需要的子系统,并将访问请求转发至与该子系统对应的子服务器。子服务器已预先接入公共组件。其中,公共组件可以包括页面顶部的菜单栏。
子系统响应请求,返回页面数据到终端设备的浏览器。其中,页面数据可以对应于子系统的首页。页面数据可以包括公共组件和对应子系统的资源请求。其中,资源为浏览器显示页面所需的资源文件,例如JavaScript文件、CSS文件、图片、视频等。浏览器根据资源请求加载对应的资源文件并渲染形成页面。其中,浏览器在请求公共组件相关资源时,主服务器对该请求进行拦截,将其存储的最新可用版本的公共组件的资源文件返回至浏览器。
根据本公开的实施例,当用户输入新的网址,访问另一子系统时,可以重复前述过程。例如,用过可以输入子系统b的网址xxx.com/b,然后由子系统a切换为子系统b。此时实现了不同子系统在页面的顶部显示同样的样式,具备相同的功能。
以下将结合图8对本公开提供的加载页面的装置进行描述。
图8示意性示出了根据本公开实施例的加载页面的装置的框图。
如图8所示,加载页面的装置800包括第一发送模块810、第二发送模块820和加载模块830。
第一发送模块810,可以用于向主服务器发送访问请求,其中,访问请求用于获取与目标页面对应的目标页面数据。
第二发送模块820,可以用于响应于接收到目标页面数据,根据目标页面数据,向主服务器发送公共组件获取请求,其中,公共组件获取请求用于获取与目标页面中公共组件对应的公共组件数据。
加载模块830,可以用于响应于接收到公共组件数据,根据目标页面数据和公共组件数据,加载目标页面。
根据本公开的实施例,加载模块可以包括识别子模块和加载子模块。其中,识别子模块,用于识别目标页面数据中的公共组件标签。加载子模块,用于根据目标页面数据加载所述目标页面,并根据公共组件数据,在目标页面中与公共组件标签对应的位置处加载公共组件。
根据本公开的实施例,其中,公共组件可以是基于网页部件技术开发的。
根据本公开的实施例,加载页面的装置还可以包括获取模块、添加模块和生成模块。其中,获取模块,用于获取原始网址,其中,原始网址包括域名和路径,域名与主服务器对应。添加模块,用于将与目标页面对应的子服务器标识添加至原始网址的路径中,得到目标网址。生成模块,用于根据目标网址,生成访问请求。
图9示意性示出了根据本公开另一实施例的加载页面的装置的框图。
如图9所示,加载页面的装置900包括第一确定模块910、第三发送模块920、第二确定模块930和第四发送模块940。
第一确定模块910,用于响应于接收到来自终端设备的访问请求,从多个子服务器中确定与访问请求对应的目标子服务器,其中,访问请求用于获取与目标页面对应的目标页面数据。
第三发送模块920,用于向目标子服务器发送访问请求,以便目标子服务器将目标页面数据发送至与访问请求对应的终端设备。
第二确定模块930,用于响应于接收到来自终端设备的公共组件获取请求,确定与公共组件获取请求对应的公共组件数据。
第四发送模块940,用于将公共组件数据发送至终端设备,以使得终端设备根据公共组件数据,加载目标页面。
根据本公开的实施例,访问请求可以包括目标网址。第一确定模块可以包括解析子模块和服务器确定子模块。其中,解析子模块,用于解析目标网址,得到子服务器标识。服务器确定子模块,用于根据子服务器标识,确定目标子服务器。
以下将结合图10对本公开提供的加载页面的装置进行描述。
图10示意性示出了根据本公开另一实施例的加载页面的装置的框图。
如图10所示,加载页面的装置1000包括第五确定模块1010和第五发送模块1020。
第五确定模块1010,用于响应于接收到来自主服务器的访问请求,确定与访问请求对应的目标页面数据,其中,目标页面数据包括与公共组件对应的公共组件标签。
第五发送模块1020,用于将目标页面数据发送至与访问请求对应的终端设备,以使得终端设备根据目标页面数据,加载目标页面。
根据本公开的实施例,加载页面的装置1000还可以包括原始页面数据获取模块和标签加入模块。其中,原始页面数据获取模块,用于获取原始页面数据。标签加入模块,用于在原始页面数据中加入公共组件标签,得到目标页面数据。
根据本公开的实施例,本公开还提供了一种电子设备、一种可读存储介质和一种计算机程序产品。
图11示意性示出了可以用来实施本公开的实施例的示例电子设备1100的框图。电子设备旨在表示各种形式的数字计算机,诸如,膝上型计算机、台式计算机、工作台、个人数字助理、服务器、刀片式服务器、大型计算机、和其它适合的计算机。电子设备还可以表示各种形式的移动装置,诸如,个人数字处理、蜂窝电话、智能电话、可穿戴设备和其它类似的计算装置。本文所示的部件、它们的连接和关系、以及它们的功能仅仅作为示例,并且不意在限制本文中描述的和/或者要求的本公开的实现。
如图11所示,设备1100包括计算单元1101,其可以根据存储在只读存储器(ROM)1102中的计算机程序或者从存储单元1108加载到随机访问存储器(RAM)1103中的计算机程序,来执行各种适当的动作和处理。在RAM 1103中,还可存储设备1100操作所需的各种程序和数据。计算单元1101、ROM 1102以及RAM 1103通过总线1104彼此相连。输入/输出(I/O)接口1105也连接至总线1104。
设备1100中的多个部件连接至I/O接口1105,包括:输入单元1106,例如键盘、鼠标等;输出单元1107,例如各种类型的显示器、扬声器等;存储单元1108,例如磁盘、光盘等;以及通信单元1109,例如网卡、调制解调器、无线通信收发机等。通信单元1109允许设备1100通过诸如因特网的计算机网络和/或各种电信网络与其他设备交换信息/数据。
计算单元1101可以是各种具有处理和计算能力的通用和/或专用处理组件。计算单元1101的一些示例包括但不限于中央处理单元(CPU)、图形处理单元(GPU)、各种专用的人工智能(AI)计算芯片、各种运行机器学习模型算法的计算单元、数字信号处理器(DSP)、以及任何适当的处理器、控制器、微控制器等。计算单元1101执行上文所描述的各个方法和处理,例如加载页面的方法。例如,在一些实施例中,加载页面的方法可被实现为计算机软件程序,其被有形地包含于机器可读介质,例如存储单元1108。在一些实施例中,计算机程序的部分或者全部可以经由ROM 1102和/或通信单元1109而被载入和/或安装到设备1100上。当计算机程序加载到RAM 1103并由计算单元1101执行时,可以执行上文描述的加载页面的方法的一个或多个步骤。备选地,在其他实施例中,计算单元1101可以通过其他任何适当的方式(例如,借助于固件)而被配置为执行加载页面的方法。
本文中以上描述的系统和技术的各种实施方式可以在数字电子电路系统、集成电路系统、现场可编程门阵列(FPGA)、专用集成电路(ASIC)、专用标准产品(ASSP)、芯片上系统的系统(SOC)、复杂可编程逻辑设备(CPLD)、计算机硬件、固件、软件、和/或它们的组合中实现。这些各种实施方式可以包括:实施在一个或者多个计算机程序中,该一个或者多个计算机程序可在包括至少一个可编程处理器的可编程系统上执行和/或解释,该可编程处理器可以是专用或者通用可编程处理器,可以从存储系统、至少一个输入装置、和至少一个输出装置接收数据和指令,并且将数据和指令传输至该存储系统、该至少一个输入装置、和该至少一个输出装置。
用于实施本公开的方法的程序代码可以采用一个或多个编程语言的任何组合来编写。这些程序代码可以提供给通用计算机、专用计算机或其他可编程数据处理装置的处理器或控制器,使得程序代码当由处理器或控制器执行时使流程图和/或框图中所规定的功能/操作被实施。程序代码可以完全在机器上执行、部分地在机器上执行,作为独立软件包部分地在机器上执行且部分地在远程机器上执行或完全在远程机器或服务器上执行。
在本公开的上下文中,机器可读介质可以是有形的介质,其可以包含或存储以供指令执行系统、装置或设备使用或与指令执行系统、装置或设备结合地使用的程序。机器可读介质可以是机器可读信号介质或机器可读储存介质。机器可读介质可以包括但不限于电子的、磁性的、光学的、电磁的、红外的、或半导体系统、装置或设备,或者上述内容的任何合适组合。机器可读存储介质的更具体示例会包括基于一个或多个线的电气连接、便携式计算机盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦除可编程只读存储器(EPROM或快闪存储器)、光纤、便捷式紧凑盘只读存储器(CD-ROM)、光学储存设备、磁储存设备、或上述内容的任何合适组合。
为了提供与用户的交互,可以在计算机上实施此处描述的系统和技术,该计算机具有:用于向用户显示信息的显示装置(例如,CRT(阴极射线管)或者LCD(液晶显示器)监视器);以及键盘和指向装置(例如,鼠标或者轨迹球),用户可以通过该键盘和该指向装置来将输入提供给计算机。其它种类的装置还可以用于提供与用户的交互;例如,提供给用户的反馈可以是任何形式的传感反馈(例如,视觉反馈、听觉反馈、或者触觉反馈);并且可以用任何形式(包括声输入、语音输入或者、触觉输入)来接收来自用户的输入。
可以将此处描述的系统和技术实施在包括后台部件的计算系统(例如,作为数据服务器)、或者包括中间件部件的计算系统(例如,应用服务器)、或者包括前端部件的计算系统(例如,具有图形用户界面或者网络浏览器的用户计算机,用户可以通过该图形用户界面或者该网络浏览器来与此处描述的系统和技术的实施方式交互)、或者包括这种后台部件、中间件部件、或者前端部件的任何组合的计算系统中。可以通过任何形式或者介质的数字数据通信(例如,通信网络)来将系统的部件相互连接。通信网络的示例包括:局域网(LAN)、广域网(WAN)和互联网。
计算机系统可以包括客户端和服务器。客户端和服务器一般远离彼此并且通常通过通信网络进行交互。通过在相应的计算机上运行并且彼此具有客户端-服务器关系的计算机程序来产生客户端和服务器的关系。
应该理解,可以使用上面所示的各种形式的流程,重新排序、增加或删除步骤。例如,本发公开中记载的各步骤可以并行地执行也可以顺序地执行也可以不同的次序执行,只要能够实现本公开公开的技术方案所期望的结果,本文在此不进行限制。
上述具体实施方式,并不构成对本公开保护范围的限制。本领域技术人员应该明白的是,根据设计要求和其他因素,可以进行各种修改、组合、子组合和替代。任何在本公开的精神和原则之内所作的修改、等同替换和改进等,均应包含在本公开保护范围之内。
Claims (8)
1.一种加载页面的系统,包括:终端设备、主服务器和与所述主服务器对应的多个子服务器,
其中,所述终端设备用于:向主服务器发送访问请求,其中,所述访问请求用于请求目标子服务器来获取与目标页面对应的目标页面数据;响应于接收到子服务器发送的所述目标页面数据,根据所述目标页面数据,向所述主服务器发送公共组件获取请求,其中,所述公共组件获取请求用于获取与目标页面中公共组件对应的公共组件数据;以及响应于接收到所述公共组件数据,根据所述目标页面数据和所述公共组件数据,加载所述目标页面;
所述主服务器用于:响应于接收到来自终端设备的访问请求,从多个子服务器中确定与所述访问请求对应的目标子服务器,其中,所述访问请求用于获取与目标页面对应的目标页面数据;向所述目标子服务器发送所述访问请求;响应于接收到来自所述终端设备的公共组件获取请求,确定与所述公共组件获取请求对应的公共组件数据;以及将所述公共组件数据发送至所述终端设备;
所述子服务器用于:响应于接收到来自主服务器的访问请求,确定与所述访问请求对应的目标页面数据,其中,所述目标页面数据包括与公共组件对应的公共组件标签;以及将所述目标页面数据发送至与所述访问请求对应的终端设备;
其中,所述主服务器对应多个子服务器,所述多个子服务器对应基于不同技术栈开发的多个子系统,所述公共组件数据包括公共组件的样式信息和功能信息,所述公共组件是基于网页部件技术开发的,所述公共组件兼容多种技术栈,所述子系统中包括所述公共组件,最新版本的所述公共组件数据存储于主服务器中,所述主服务器用于拦截所述公共组件获取请求,并根据所述公共组件获取请求向终端设备发送所述公共组件数据,在基于所述访问请求访问所述多个子系统的情况下,所述多个子系统的公共组件在各个所述子系统的目标页面中指定位置显示相同的样式,具备相同的功能。
2. 根据权利要求1所述的系统,其中,所述根据所述目标页面数据和所述公共组件数据,加载所述目标页面包括:
识别所述目标页面数据中的公共组件标签;以及
根据所述目标页面数据加载所述目标页面,并根据所述公共组件数据,在所述目标页面中与所述公共组件标签对应的位置处加载公共组件。
3.根据权利要求1或2所述的系统,还包括:
获取原始网址,其中,所述原始网址包括域名和路径,所述域名与所述主服务器对应;
将与目标页面对应的子服务器标识添加至所述原始网址的路径中,得到目标网址;以及
根据所述目标网址,生成所述访问请求。
4. 根据权利要求1所述的系统,其中,所述访问请求包括目标网址;所述确定与所述访问请求对应的目标子服务器,包括:
解析所述目标网址,得到子服务器标识;以及
根据所述子服务器标识,确定所述目标子服务器。
5. 根据权利要求1所述的系统,还包括:
获取原始页面数据;以及
在所述原始页面数据中加入公共组件标签,得到所述目标页面数据。
6. 一种电子设备,包括:
至少一个处理器;以及
与所述至少一个处理器通信连接的存储器;其中,
所述存储器存储有可被所述至少一个处理器执行的指令,所述指令被所述至少一个处理器执行,以使所述至少一个处理器能够执行权利要求1-5中任一项所述的系统所对应执行的方法。
7.一种存储有计算机指令的非瞬时计算机可读存储介质,其中,所述计算机指令用于使所述计算机执行根据权利要求1-5中任一项所述的系统所对应执行的方法。
8.一种计算机程序产品,包括计算机程序/指令,其特征在于,该计算机程序/指令被处理器执行时实现权利要求1-5中任一项所述系统所对应执行的方法的步骤。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202211195351.3A CN115577200B (zh) | 2022-09-28 | 2022-09-28 | 加载页面的方法、装置、设备以及存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202211195351.3A CN115577200B (zh) | 2022-09-28 | 2022-09-28 | 加载页面的方法、装置、设备以及存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN115577200A CN115577200A (zh) | 2023-01-06 |
CN115577200B true CN115577200B (zh) | 2024-04-23 |
Family
ID=84583876
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202211195351.3A Active CN115577200B (zh) | 2022-09-28 | 2022-09-28 | 加载页面的方法、装置、设备以及存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN115577200B (zh) |
Citations (8)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US7693840B1 (en) * | 2004-07-30 | 2010-04-06 | Sprint Communications Company L.P. | Method and system for distribution of common elements |
CN105069132A (zh) * | 2015-08-17 | 2015-11-18 | 中国海洋大学 | 一种基于静态外壳的网页实现方法 |
CN105653526A (zh) * | 2014-11-10 | 2016-06-08 | 腾讯科技(深圳)有限公司 | 页面访问方法和装置 |
WO2017045563A1 (zh) * | 2015-09-17 | 2017-03-23 | 阿里巴巴集团控股有限公司 | 一种web app访问方法、装置和系统 |
CN111143727A (zh) * | 2019-12-06 | 2020-05-12 | 维沃移动通信有限公司 | 页面加载方法及电子设备 |
CN112364277A (zh) * | 2020-11-23 | 2021-02-12 | 北京三快在线科技有限公司 | 一种网页加载方法及装置 |
WO2022143155A1 (zh) * | 2020-12-30 | 2022-07-07 | 花瓣云科技有限公司 | 资源访问方法和终端设备 |
CN114741158A (zh) * | 2022-04-02 | 2022-07-12 | 北京百度网讯科技有限公司 | 页面切换方法、装置、设备以及存储介质 |
-
2022
- 2022-09-28 CN CN202211195351.3A patent/CN115577200B/zh active Active
Patent Citations (8)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US7693840B1 (en) * | 2004-07-30 | 2010-04-06 | Sprint Communications Company L.P. | Method and system for distribution of common elements |
CN105653526A (zh) * | 2014-11-10 | 2016-06-08 | 腾讯科技(深圳)有限公司 | 页面访问方法和装置 |
CN105069132A (zh) * | 2015-08-17 | 2015-11-18 | 中国海洋大学 | 一种基于静态外壳的网页实现方法 |
WO2017045563A1 (zh) * | 2015-09-17 | 2017-03-23 | 阿里巴巴集团控股有限公司 | 一种web app访问方法、装置和系统 |
CN111143727A (zh) * | 2019-12-06 | 2020-05-12 | 维沃移动通信有限公司 | 页面加载方法及电子设备 |
CN112364277A (zh) * | 2020-11-23 | 2021-02-12 | 北京三快在线科技有限公司 | 一种网页加载方法及装置 |
WO2022143155A1 (zh) * | 2020-12-30 | 2022-07-07 | 花瓣云科技有限公司 | 资源访问方法和终端设备 |
CN114741158A (zh) * | 2022-04-02 | 2022-07-12 | 北京百度网讯科技有限公司 | 页面切换方法、装置、设备以及存储介质 |
Non-Patent Citations (2)
Title |
---|
JSP静态网页生成技术的研究;徐白;宋玲;吴昊;;计算机技术与发展;20100610(第06期);第181-184页 * |
基于HTML5的响应式Web页面重组适配技术研究;蒋凌燕;查英华;;计算机与现代化;20150215(第02期);第7-10页 * |
Also Published As
Publication number | Publication date |
---|---|
CN115577200A (zh) | 2023-01-06 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN107622135B (zh) | 用于显示信息的方法和装置 | |
CN108574604B (zh) | 测试方法和装置 | |
WO2021023149A1 (zh) | 一种动态返回报文的方法和装置 | |
CN110708346A (zh) | 信息处理系统和方法 | |
US20160179832A1 (en) | Web Browser Orchestration | |
CN113382083B (zh) | 一种网页截图方法和装置 | |
CN110704200A (zh) | 转换调用接口的方法和装置 | |
CN112328564A (zh) | 特享资源分享方法、装置及电子设备 | |
CN110519155B (zh) | 信息处理方法及系统 | |
CN113553123B (zh) | 数据处理方法、装置、电子设备及存储介质 | |
CN112015383A (zh) | 一种登录方法和装置 | |
CN110647327B (zh) | 基于卡片的用户界面动态控制的方法和装置 | |
AU2018390863B2 (en) | Computer system and method for extracting dynamic content from websites | |
CN108834202B (zh) | 信息展示方法和设备 | |
CN115577200B (zh) | 加载页面的方法、装置、设备以及存储介质 | |
CN113342450B (zh) | 页面处理的方法、装置、电子设备及计算机可读介质 | |
CN112947918A (zh) | 数据展示方法和装置 | |
US10659560B2 (en) | Mobile device display preference | |
CN111950663A (zh) | 展示图片生成方法、装置及电子设备 | |
CN112131095A (zh) | 压力测试方法和装置 | |
CN111597485A (zh) | 信息呈现方法和装置 | |
CN109218270B (zh) | 一种处理被劫持请求的方法和装置 | |
CN110858240A (zh) | 一种前端模块加载方法和装置 | |
CN110019030B (zh) | 分割文件的方法和装置 | |
CN111291284A (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 |