CN113722015A - 组合组件的获取方法、装置及存储介质 - Google Patents

组合组件的获取方法、装置及存储介质 Download PDF

Info

Publication number
CN113722015A
CN113722015A CN202111063885.6A CN202111063885A CN113722015A CN 113722015 A CN113722015 A CN 113722015A CN 202111063885 A CN202111063885 A CN 202111063885A CN 113722015 A CN113722015 A CN 113722015A
Authority
CN
China
Prior art keywords
component
file
public
service
components
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
Application number
CN202111063885.6A
Other languages
English (en)
Other versions
CN113722015B (zh
Inventor
李正雄
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Jingdong Technology Holding Co Ltd
Original Assignee
Jingdong Technology Holding Co Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by Jingdong Technology Holding Co Ltd filed Critical Jingdong Technology Holding Co Ltd
Priority to CN202111063885.6A priority Critical patent/CN113722015B/zh
Publication of CN113722015A publication Critical patent/CN113722015A/zh
Application granted granted Critical
Publication of CN113722015B publication Critical patent/CN113722015B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/445Program loading or initiating
    • G06F9/44521Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Management, Administration, Business Operations System, And Electronic Commerce (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

本公开涉及一种组合组件的获取方法、装置及存储介质,上述方法包括:接收目标对象发送的组件请求;根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;根据所述组件请求将所述组合组件发送到目标客户端。采用上述技术手段,可以解决现有技术中,组件加载中,会加载许多重复的文件内容,会导致加载的文件庞大的问题。

Description

组合组件的获取方法、装置及存储介质
技术领域
本公开涉及互联网技术领域,尤其涉及一种组合组件的获取方法、装置及存储介质。
背景技术
组件(Component)是对数据和方法的简单封装,每个组件可以有自己的属性和方法。使用组件可以实现拖放式编程、快速的属性处理以及真正的面向对象的设计,因此组件被广泛应用于设计编程的领域中。在使用组件的传统技术中,多是以全量加载的方式加载组件,在这种加载组件的方法中,如果组件项目过于庞大,打包后的文件就会很大,因此全量加载会拉低页面性能;除此之外,即使传统技术中的以部分加载的方式加载组件时,如果加载多个业务组件,那么加载每个业务组件时都会加载一次公共组件,实际上,公共组件加载一次就可以了,没有必要多次加载公共组件,多次加载公共组件同样会导致加载打包文件庞大,拉低页面性能。
在实现本公开构思的过程中,发明人发现相关技术中至少存在如下技术问题:组件加载中,会加载许多重复的文件内容,会导致加载的文件庞大的问题。
发明内容
为了解决上述技术问题或者至少部分地解决上述技术问题,本公开的实施例提供了一种组合组件的获取方法、装置及存储介质,以至少解决现有技术中,组件加载中,会加载许多重复的文件内容,会导致加载的文件庞大的问题。
本公开的目的是通过以下技术方案实现的:
第一方面,本公开的实施例提供了一种组合组件的获取方法,包括:接收目标对象发送的组件请求;根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;根据所述组件请求将所述组合组件发送到目标客户端。
在一个示例性实施例中,所述接收目标对象发送的组件请求之前,所述方法还包括:通过模块打包工具执行如下操作:配置所述公共组件的入口文件,并根据所述入口文件获取所述公共组件的依赖文件;对所述入口文件和所述依赖文件进行构建打包操作,以得到所述公共组件;将所述公共组件发布到所述组件服务端。
在一个示例性实施例中,所述接收目标对象发送的组件请求之前,所述方法还包括:通过模块打包工具执行如下操作:配置所述业务组件的入口文件,其中,所述配置包括:在所述入口文件中,将所述公共组件设置为构建忽略,所述构建忽略用于指示在进行所述业务组件的构建打包操作时,忽略所述业务组件会引用到的所述公共组件;根据所述入口文件获取所述业务组件的依赖文件;对所述入口文件和所述依赖文件进行所述构建打包操作,以得到所述业务组件;将所述业务组件发布到所述组件服务端。
在一个示例性实施例中,将组件发布到所述组件服务端之前,所述方法还包括:对组件执行以下至少之一的操作:对所述组件执行文件压缩操作,其中,所述组件包括:所述公共组件和所述业务组件;或通过散列函数对所述组件执行文件散列操作;或对所述组件执行代码混淆操作。
在一个示例性实施例中,所述对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,包括:创建字符串拼接对象,根据所述字符串拼接对象对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,以得到所述组合组件;或创建字符串缓存数组,根据所述字符串缓存数组对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,以得到所述组合组件。
在一个示例性实施例中,所述根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件,包括:对所述组件请求进行解析处理,以得到所述公共组件和所述一个或多个业务组件分别对应的文件地址;根据所述公共组件和所述一个或多个业务组件分别对应的文件地址分别获取所述公共组件和所述一个或多个业务组件。
在一个示例性实施例中,所述根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件,包括:根据所述组件请求从所述组件服务端对应的本地组件库中获取所述公共组件和所述一个或多个业务组件;或者根据所述组件请求和所述组件服务端的配置参数从所述组件服务端对应的云端组件库获取所述公共组件和所述一个或多个业务组件。
在一个示例性实施例中,所述根据所述组件请求将所述组合组件发送到目标客户端,包括:对所述组合组件执行文件压缩操作;根据所述组件请求,通过反向代理服务或者内容分发网络将经过所述文件压缩操作后的所述组合组件发送到目标客户端。
第二方面,本公开的实施例提供了一种组合组件的获取装置,包括:接收模块,用于接收目标对象发送的组件请求;获取模块,用于根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;拼接模块,用于对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;发送模块,用于根据所述组件请求将所述组合组件发送到目标客户端。
第三方面,本公开的实施例提供了一种电子设备。上述电子设备包括处理器、通信接口、存储器和通信总线,其中,处理器、通信接口和存储器通过通信总线完成相互间的通信;存储器,用于存放计算机程序;处理器,用于执行存储器上所存放的程序时,实现如上所述的组合组件的获取方法或图像处理的方法。
第四方面,本公开的实施例提供了一种计算机可读存储介质。上述计算机可读存储介质上存储有计算机程序,上述计算机程序被处理器执行时实现如上所述的组合组件的获取方法或图像处理的方法。
本公开实施例提供的上述技术方案与现有技术相比至少具有如下优点的部分或全部:接收目标对象发送的组件请求;根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;根据所述组件请求将所述组合组件发送到目标客户端。因为,本公开实施例可以对获取到的公共组件和一个或多个业务组件进行字符串拼接操作,得到组合组件,因此,采用上述技术手段,可以解决现有技术中,组件加载中,会加载许多重复的文件内容,会导致加载的文件庞大的问题,从而简化每次组件加载内容,减小加载的文件的大小。
附图说明
此处的附图被并入说明书中并构成本说明书的一部分,示出了符合本公开的实施例,并与说明书一起用于解释本公开的原理。
为了更清楚地说明本公开实施例或现有技术中的技术方案,下面将对实施例或相关技术描述中所需要使用的附图作简单地介绍,显而易见地,对于本领域普通技术人员而言,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。
图1示意性示出了本公开实施例一种组合组件的获取方法的计算机终端的硬件结构框图;
图2示意性示出了本公开实施例的一种组合组件的获取方法的流程图;
图3示意性示出了本公开实施例的一种组件配置方法的流程图;
图4示意性示出了本公开实施例的一种组合组件的获取方法的流程示意图;
图5示意性示出了本公开实施例的一种组合组件的获取装置的结构框图;
图6示意性示出了本公开实施例提供的一种电子设备的结构框图。
具体实施方式
下文中将参考附图并结合实施例来详细说明本公开。需要说明的是,在不冲突的情况下,本公开中的实施例及实施例中的特征可以相互组合。
需要说明的是,本公开的说明书和权利要求书及上述附图中的术语“第一”、“第二”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。
本公开实施例所提供的方法实施例可以在计算机终端或者类似的运算装置中执行。以运行在计算机终端上为例,图1示意性示出了本公开实施例的一种组合组件的获取方法的计算机终端的硬件结构框图。如图1所示,计算机终端可以包括一个或多个(图1中仅示出一个)处理器102(处理器102可以包括但不限于微处理器(Microprocessor Unit,简称是MPU)或可编程逻辑器件(Programmable logic device,简称是PLD)等处理装置和用于存储数据的存储器104,可选地,上述计算机终端还可以包括用于通信功能的传输设备106以及输入输出设备108。本领域普通技术人员可以理解,图1所示的结构仅为示意,其并不对上述计算机终端的结构造成限定。例如,计算机终端还可包括比图1中所示更多或者更少的组件,或者具有与图1所示等同功能或比图1所示功能更多的不同的配置。
存储器104可用于存储计算机程序,例如,应用软件的软件程序以及模块,如本公开实施例中的组合组件的获取方法对应的计算机程序,处理器102通过运行存储在存储器104内的计算机程序,从而执行各种功能应用以及数据处理,即实现上述的方法。存储器104可包括高速随机存储器,还可包括非易失性存储器,如一个或者多个磁性存储装置、闪存、或者其他非易失性固态存储器。在一些实例中,存储器104可进一步包括相对于处理器102远程设置的存储器,这些远程存储器可以通过网络连接至计算机终端。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。
传输设备106用于经由网络接收或者发送数据。上述的网络具体实例可包括计算机终端的通信供应商提供的无线网络。在一个实例中,传输设备106包括一个网络适配器(Network Interface Controller,简称为NIC),其可通过基站与其他网络设备相连从而可与互联网进行通讯。在一个实例中,传输设备106可以为射频(Radio Frequency,简称为RF)模块,其用于通过无线方式与互联网进行通讯。
在本公开实施例中提供了一种组合组件的获取方法,图2示意性示出了本公开实施例的一种组合组件的获取方法的流程图,如图2所示,该流程包括如下步骤:
步骤S202,接收目标对象发送的组件请求;
步骤S204,根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;
步骤S206,对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;
步骤S208,根据所述组件请求将所述组合组件发送到目标客户端。
通过本公开,接收目标对象发送的组件请求;根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;根据所述组件请求将所述组合组件发送到目标客户端。因为,本公开实施例可以对获取到的公共组件和一个或多个业务组件进行字符串拼接操作,得到组合组件,因此,采用上述技术手段,可以解决现有技术中,组件加载中,会加载许多重复的文件内容,会导致加载的文件庞大的问题,从而简化每次组件加载内容,减小加载的文件的大小。
在一个可选实施例中,接收目标对象发送的组件请求之前,所述方法还包括:通过模块打包工具执行如下操作:配置所述公共组件的入口文件,并根据所述入口文件获取所述公共组件的依赖文件;对所述入口文件和所述依赖文件进行构建打包操作,以得到所述公共组件;将所述公共组件发布到所述组件服务端。
需要说明的是,模块打包工具可以是webpack工具。通过模块打包工具执行上述操作,实际上就是通过webpack工具进行组件库代码构建,分别包括coresdk构建、components(组件)构建、components引用三块内容。其中,coresdk是所述公共组件,coresdk构建也就是将组件库公共模块及公共函数进行webpack打包,得到所述公共组件的过程,components是业务组件,components构建是指在对coresdk之外的业务组件及函数进行webpack打包,得到所述业务组件的过程,Components引用指使用方通过链接进行访问。
本公开实施例的过程实际上是Coresdk构建,Coresdk构建可以是将http请求函数、统计函数、字符串格式化等,对于使用率比较高的js、css代码都可以放入coresdk中,但需避免将其他公共库放入coresdk中,如vue、react等框架等,通过上述技术手段,可以保证coresdk最小化。配置所述公共组件的入口文件是指在webpack配置文件中配置组件coresdk的入口文件。webpack会根据该入口文件分析组件库的文件依赖关系,进而获取所述公共组件的依赖文件。构建coresdk是指webpack对coresdk入口文件及其依赖文件进行构建打包,以将es6、es7、typescript等代码编译为es5代码。
在一个可选实施例中,接收目标对象发送的组件请求之前,所述方法还包括:通过模块打包工具执行如下操作:配置所述业务组件的入口文件,其中,所述配置包括:在所述入口文件中,将所述公共组件设置为构建忽略,所述构建忽略用于指示在进行所述业务组件的构建打包操作时,忽略所述业务组件会引用到的所述公共组件;根据所述入口文件获取所述业务组件的依赖文件;对所述入口文件和所述依赖文件进行所述构建打包操作,以得到所述业务组件;将所述业务组件发布到所述组件服务端。
本公开实施例的过程实际上是Components构建,Components构建也就是业务组建的构建,是指在对coresdk之外的业务组件及函数进行webpack打包。在进行componets编写时,若使用到coresdk中的模块及函数时,需从构建后的coresdk中进行引入,同时构建时需要将coresdk进行忽略设置,否则将会使使用到的模块及函数再次构建到component中,这样无法保证component的最小化。在构建components时,需要将每个component都作为一个入口文件在webpack中进行配置,并对构建后的文件名进行编码(例如:商品楼层组件名为100.js、优惠券楼层组件名为101.js……),并且将在所述入口文件中,将所述公共组件设置为构建忽略。通过上述技术手段,可以保证每一个component最小化。
构建业务组件与构建公开组件的不同处在于:构建业务组件是将每个业务组件进行编码,保证可根据相应的编码找到对应的文件,也便于组件库的后期维护
Coresdk与compoents构建完成后,其发布到服务上通过http或https链接进行访问使用。若增加新的component,只需要对新component进行单独构建后发布到组件服务端,这样组件之间不受影响,减少线上更新出错的风险。
在一个可选实施例中,将组件发布到所述组件服务端之前,所述方法还包括:对组件执行以下至少之一的操作:对所述组件执行文件压缩操作,其中,所述组件包括:所述公共组件和所述业务组件;或通过散列函数对所述组件执行文件散列操作;或对所述组件执行代码混淆操作。
将组件发布到所述组件服务端是指将构建后的coresdk及组件代码发布到组件服务端上,浏览器可通过统一资源定位符链接进行访问。将组件发布到所述组件服务端之前,还可以对组件执行以下至少之一的操作:对所述组件执行文件压缩操作,其中,文件压缩操作用于减小组件的大小;或通过散列函数对所述组件执行文件散列操作,其中,文件散列操作用于将组件转换为字符串,因为配置组件时,就执行了文件散列操作,所以对所述公共组件和所述一个或多个业务组件进行字符串拼接操作时,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;或对所述组件执行代码混淆操作,其中,混淆的目的是使某些东西更难理解,通常是为了使攻击或复制更加困难,一个常见的用途是混淆源代码,使得这个项目难以被逆向工程,需要说明的是,混淆并不是一个安全的保护措施(例如加密),而是一个干扰。混淆与编码一样,通常可以通过使用对数据混淆的算法来逆转。
在步骤206中,对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,包括:创建字符串拼接对象,根据所述字符串拼接对象对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,以得到所述组合组件;或创建字符串缓存数组,根据所述字符串缓存数组对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,以得到所述组合组件。
创建字符串拼接对象,根据所述字符串拼接对象对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,是通过构建的新的创建字符串拼接对象来对应或者存放所述公共组件和所述一个或多个业务组件的方式,得到所述组合组件;创建字符串缓存数组,根据所述字符串缓存数组对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,是将所述公共组件和所述一个或多个业务组件存放在创建的字符串缓存数组中,然后将存放有组件的字符串缓存数组转换为字符串对象就可以得到所述组合组件。
需要说明的是,本公开实施例中的两种操作方式仅仅作为可选实施例存在,本公开实施例中的字符串拼接操作可以是现有技术中任何一种操作方式。
在步骤204中,根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件,包括:对所述组件请求进行解析处理,以得到所述公共组件和所述一个或多个业务组件分别对应的文件地址;根据所述公共组件和所述一个或多个业务组件分别对应的文件地址分别获取所述公共组件和所述一个或多个业务组件。
本公开实施例可以理解为通过链接地址也就是链接地址获取组件,其中,所述组件请求包含所述公共组件和所述一个或多个业务组件分别对应的文件地址。通过对所述组件请求进行解析处理,就可以得到所述文件地址。业务组件对应的文件地址可以是业务组件对应的一种标识。所述公共组件和所述业务组件分别对应的文件地址可以是有关系的。举例说明,通过链接地址获取一个公共组件和一个业务组件,比如链接地址为https://***.**.com/sdk.js?componet=100,https://***.**.com/sdk.js?表示的是所述公共组件对应的文件地址,componet=100是一个业务组件对应的文件地址或者标识。若同时使用多个组件,也可以同时绑定,如:https://***.**.com/sdk.js?componet=100,101。业务组件,比如链接地址为https://***.**.com/sdk.js?componet=100,https://***.**.com/sdk.js?表示的是所述公共组件对应的文件地址,componet=100,101是两个业务组件对应的文件地址或者标识。通过上述技术手段,可以根据链接的访问地址优先获取coresdk文件,根据链接上的componet参数值再获取对应的组件文件,若使用多个组件,则根据component参数后的链接符,分别获取对应的组件文件。
在步骤204中,根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件,包括:根据所述组件请求从所述组件服务端对应的本地组件库中获取所述公共组件和所述一个或多个业务组件;或者根据所述组件请求和所述组件服务端的配置参数从所述组件服务端对应的云端组件库获取所述公共组件和所述一个或多个业务组件。
所述公共组件和所述一个或多个业务组件可以是所述组件服务端对应的本地组件库,也可以是所述组件服务端对应的云端组件库。在接收到所述组件请求,首先判断所述组件服务端对应的本地组件库是否存在所述公共组件和所述一个或多个业务组件,如果存在,则从所述组件服务端对应的本地组件库中获取所述公共组件和所述一个或多个业务组件;如果不存在,则从所述组件服务端对应的云端组件库获取所述公共组件和所述一个或多个业务组件。
在步骤208中,根据所述组件请求将所述组合组件发送到目标客户端,包括:对所述组合组件执行文件压缩操作;根据所述组件请求,通过反向代理服务或者内容分发网络将经过所述文件压缩操作后的所述组合组件发送到目标客户端。
Nginx是一个很强大的高性能Web和反向代理服务,它具有很多非常优越的特性:在连接高并发的情况下,Nginx是Apache服务不错的替代品:Nginx在美国是做虚拟主机生意的老板们经常选择的软件平台之一。能够支持高达50,000个并发连接数的响应。
CDN的全称是Content Delivery Network,即内容分发网络。其基本思路是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节,使内容传输得更快、更稳定。通过在网络各处放置节点服务器所构成的在现有的互联网基础之上的一层智能虚拟网络,CDN系统能够实时地根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上。其目的是使用户可就近取得所需内容,解决Internet网络拥挤的状况,提高用户访问网站的响应速度。
本公开实施例通过反向代理服务或者内容分发网络,可以加速对组件请求的响应,快速将经过所述文件压缩操作后的所述组合组件发送到目标客户端。
为了更好的理解上述技术方案,本公开实施例还提供了一种可选实施例,用于解释说明上述技术方案。
图3示意性示出了本公开实施例的一种组件配置方法的流程图,如图3所示:
S302:配置所述公共组件的入口文件,并根据所述入口文件,获取所述公共组件的依赖文件;
S304:对所述入口文件和所述依赖文件进行构建打包操作,以得到所述公共组件;
S306:配置所述业务组件的入口文件,其中,所述配置包括:在所述入口文件中,将所述公共组件设置为构建忽略,所述构建忽略用于指示在进行所述业务组件的构建打包操作时,忽略所述业务组件会引用到的所述公共组件;
S308:根据所述入口文件获取所述业务组件的依赖文件;
S310:对所述入口文件和所述依赖文件进行所述构建打包操作,以得到所述业务组件;
S312:将所述业务组件和所述公开组件发布到所述组件服务端。
图4示意性示出了本公开实施例的一种组合组件的获取方法的流程示意图,如图4所示:
S402:接收目标对象发送的组件请求;
S404:对所述组件请求进行解析处理,以得到所述公共组件和所述一个或多个业务组件分别对应的文件地址;
S406:根据所述公共组件和所述一个或多个业务组件分别对应的文件地址分别获取所述公共组件和所述一个或多个业务组件;
S408:对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件;
S410:通过反向代理服务或者内容分发网络将经过所述文件压缩操作后的所述组合组件发送到目标客户端。
通过本公开,接收目标对象发送的组件请求;根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;根据所述组件请求将所述组合组件发送到目标客户端。因为,本公开实施例可以对获取到的公共组件和一个或多个业务组件进行字符串拼接操作,得到组合组件,因此,采用上述技术手段,可以解决现有技术中,组件加载中,会加载许多重复的文件内容,会导致加载的文件庞大的问题,从而简化每次组件加载内容,减小加载的文件的大小。
通过以上的实施方式的描述,本领域的技术人员可以清楚地了解到根据上述实施例的方法可借助软件加必需的通用硬件平台的方式来实现,当然也可以通过硬件,但很多情况下前者是更佳的实施方式。基于这样的理解,本公开的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储介质(如只读存储器(Read-Only Memory,简称为ROM)、随机存取存储器(RandomAccessMemory,简称为RAM)、磁碟、光盘)中,包括若干指令用以使得一台终端设备(可以是手机,计算机,组件服务端,或者网络设备等)执行本公开各个实施例的方法。
在本实施例中还提供了一种组合组件的获取装置,该组合组件的获取装置用于实现上述实施例及优选实施方式,已经进行过说明的不再赘述。如以下所使用的,术语“模块”可以实现预定功能的软件和/或硬件的组合。尽管以下实施例所描述的装置较佳地以软件来实现,但是硬件,或者软件和硬件的组合的实现也是可能并被构想的。
图5示意性示出了本公开可选实施例的一种组合组件的获取装置的结构框图,如图5所示,该装置包括:
接收模块502,用于接收目标对象发送的组件请求;
获取模块504,用于根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;
拼接模块506,用于对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;
发送模块508,用于根据所述组件请求将所述组合组件发送到目标客户端。
通过本公开,接收目标对象发送的组件请求;根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;根据所述组件请求将所述组合组件发送到目标客户端。因为,本公开实施例可以对获取到的公共组件和一个或多个业务组件进行字符串拼接操作,得到组合组件,因此,采用上述技术手段,可以解决现有技术中,组件加载中,会加载许多重复的文件内容,会导致加载的文件庞大的问题,从而简化每次组件加载内容,减小加载的文件的大小。
可选地,接收模块502还用于通过模块打包工具执行如下操作:配置所述公共组件的入口文件,并根据所述入口文件获取所述公共组件的依赖文件;对所述入口文件和所述依赖文件进行构建打包操作,以得到所述公共组件;将所述公共组件发布到所述组件服务端。
需要说明的是,模块打包工具可以是webpack工具。通过模块打包工具执行上述操作,实际上就是通过webpack工具进行组件库代码构建,分别包括coresdk构建、components(组件)构建、components引用三块内容。其中,coresdk是所述公共组件,coresdk构建也就是将组件库公共模块及公共函数进行webpack打包,得到所述公共组件的过程,components是业务组件,components构建是指在对coresdk之外的业务组件及函数进行webpack打包,得到所述业务组件的过程,Components引用指使用方通过链接进行访问。
本公开实施例的过程实际上是Coresdk构建,Coresdk构建可以是将http请求函数、统计函数、字符串格式化等,对于使用率比较高的js、css代码都可以放入coresdk中,但需避免将其他公共库放入coresdk中,如vue、react等框架等,通过上述技术手段,可以保证coresdk最小化。配置所述公共组件的入口文件是指在webpack配置文件中配置组件coresdk的入口文件。webpack会根据该入口文件分析组件库的文件依赖关系,进而获取所述公共组件的依赖文件。构建coresdk是指webpack对coresdk入口文件及其依赖文件进行构建打包,以将es6、es7、typescript等代码编译为es5代码。
可选地,接收模块502还用于通过模块打包工具执行如下操作:配置所述业务组件的入口文件,其中,所述配置包括:在所述入口文件中,将所述公共组件设置为构建忽略,所述构建忽略用于指示在进行所述业务组件的构建打包操作时,忽略所述业务组件会引用到的所述公共组件;根据所述入口文件获取所述业务组件的依赖文件;对所述入口文件和所述依赖文件进行所述构建打包操作,以得到所述业务组件;将所述业务组件发布到所述组件服务端。
本公开实施例的过程实际上是Components构建,Components构建也就是业务组建的构建,是指在对coresdk之外的业务组件及函数进行webpack打包。在进行componets编写时,若使用到coresdk中的模块及函数时,需从构建后的coresdk中进行引入,同时构建时需要将coresdk进行忽略设置,否则将会使使用到的模块及函数再次构建到component中,这样无法保证component的最小化。在构建components时,需要将每个component都作为一个入口文件在webpack中进行配置,并对构建后的文件名进行编码(例如:商品楼层组件名为100.js、优惠券楼层组件名为101.js……),并且将在所述入口文件中,将所述公共组件设置为构建忽略。通过上述技术手段,可以保证每一个component最小化。
构建业务组件与构建公开组件的不同处在于:构建业务组件是将每个业务组件进行编码,保证可根据相应的编码找到对应的文件,也便于组件库的后期维护
Coresdk与compoents构建完成后,其发布到服务上通过http或https链接进行访问使用。若增加新的component,只需要对新component进行单独构建后发布到组件服务端,这样组件之间不受影响,减少线上更新出错的风险。
可选地,接收模块502还用于对组件执行以下至少之一的操作:对所述组件执行文件压缩操作,其中,所述组件包括:所述公共组件和所述业务组件;或通过散列函数对所述组件执行文件散列操作;或对所述组件执行代码混淆操作。
将组件发布到所述组件服务端是指将构建后的coresdk及组件代码发布到组件服务端上,浏览器可通过统一资源定位符链接进行访问。将组件发布到所述组件服务端之前,还可以对组件执行以下至少之一的操作:对所述组件执行文件压缩操作,其中,文件压缩操作用于减小组件的大小;或通过散列函数对所述组件执行文件散列操作,其中,文件散列操作用于将组件转换为字符串,因为配置组件时,就执行了文件散列操作,所以对所述公共组件和所述一个或多个业务组件进行字符串拼接操作时,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;或对所述组件执行代码混淆操作,其中,混淆的目的是使某些东西更难理解,通常是为了使攻击或复制更加困难,一个常见的用途是混淆源代码,使得这个项目难以被逆向工程,需要说明的是,混淆并不是一个安全的保护措施(例如加密),而是一个干扰。混淆与编码一样,通常可以通过使用对数据混淆的算法来逆转。
可选地,拼接模块506还用于创建字符串拼接对象,根据所述字符串拼接对象对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,以得到所述组合组件;或创建字符串缓存数组,根据所述字符串缓存数组对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,以得到所述组合组件。
创建字符串拼接对象,根据所述字符串拼接对象对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,是通过构建的新的创建字符串拼接对象来对应或者存放所述公共组件和所述一个或多个业务组件的方式,得到所述组合组件;创建字符串缓存数组,根据所述字符串缓存数组对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,是将所述公共组件和所述一个或多个业务组件存放在创建的字符串缓存数组中,然后将存放有组件的字符串缓存数组转换为字符串对象就可以得到所述组合组件。
需要说明的是,本公开实施例中的两种操作方式仅仅作为可选实施例存在,本公开实施例中的字符串拼接操作可以是现有技术中任何一种操作方式。
可选地,获取模块504还用于对所述组件请求进行解析处理,以得到所述公共组件和所述一个或多个业务组件分别对应的文件地址;根据所述公共组件和所述一个或多个业务组件分别对应的文件地址分别获取所述公共组件和所述一个或多个业务组件。
本公开实施例可以理解为通过链接地址也就是链接地址获取组件,其中,所述组件请求包含所述公共组件和所述一个或多个业务组件分别对应的文件地址。通过对所述组件请求进行解析处理,就可以得到所述文件地址。业务组件对应的文件地址可以是业务组件对应的一种标识。所述公共组件和所述业务组件分别对应的文件地址可以是有关系的。举例说明,通过链接地址获取一个公共组件和一个业务组件,比如链接地址为https://***.**.com/sdk.js?componet=100,https://***.**.com/sdk.js?表示的是所述公共组件对应的文件地址,componet=100是一个业务组件对应的文件地址或者标识。若同时使用多个组件,也可以同时绑定,如:https://***.**.com/sdk.js?componet=100,101。业务组件,比如链接地址为https://***.**.com/sdk.js?componet=100,https://***.**.com/sdk.js?表示的是所述公共组件对应的文件地址,componet=100,101是两个业务组件对应的文件地址或者标识。通过上述技术手段,可以根据链接的访问地址优先获取coresdk文件,根据链接上的componet参数值再获取对应的组件文件,若使用多个组件,则根据component参数后的链接符,分别获取对应的组件文件。
可选地,获取模块504还用于根据所述组件请求从所述组件服务端对应的本地组件库中获取所述公共组件和所述一个或多个业务组件;或者根据所述组件请求和所述组件服务端的配置参数从所述组件服务端对应的云端组件库获取所述公共组件和所述一个或多个业务组件。
所述公共组件和所述一个或多个业务组件可以是所述组件服务端对应的本地组件库,也可以是所述组件服务端对应的云端组件库。在接收到所述组件请求,首先判断所述组件服务端对应的本地组件库是否存在所述公共组件和所述一个或多个业务组件,如果存在,则从所述组件服务端对应的本地组件库中获取所述公共组件和所述一个或多个业务组件;如果不存在,则从所述组件服务端对应的云端组件库获取所述公共组件和所述一个或多个业务组件。
可选地,发送模块508还用于对所述组合组件执行文件压缩操作;根据所述组件请求,通过反向代理服务或者内容分发网络将经过所述文件压缩操作后的所述组合组件发送到目标客户端。
Nginx是一个很强大的高性能Web和反向代理服务,它具有很多非常优越的特性:在连接高并发的情况下,Nginx是Apache服务不错的替代品:Nginx在美国是做虚拟主机生意的老板们经常选择的软件平台之一。能够支持高达50,000个并发连接数的响应。
CDN的全称是Content Delivery Network,即内容分发网络。其基本思路是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节,使内容传输得更快、更稳定。通过在网络各处放置节点服务器所构成的在现有的互联网基础之上的一层智能虚拟网络,CDN系统能够实时地根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上。其目的是使用户可就近取得所需内容,解决Internet网络拥挤的状况,提高用户访问网站的响应速度。
本公开实施例通过反向代理服务或者内容分发网络,可以加速对组件请求的响应,快速将经过所述文件压缩操作后的所述组合组件发送到目标客户端。
需要说明的是,上述各个模块是可以通过软件或硬件来实现的,对于后者,可以通过以下方式实现,但不限于此:上述模块均位于同一处理器中;或者,上述各个模块以任意组合的形式分别位于不同的处理器中。
本公开的实施例提供了一种电子设备。
图6示意性示出了本公开实施例提供的一种电子设备的结构框图。
参照图6所示,本公开实施例提供的电子设备600包括处理器601、通信接口602、存储器603和通信总线604,其中,处理器601、通信接口602和存储器603通过通信总线604完成相互间的通信;存储器603,用于存放计算机程序;处理器601,用于执行存储器上所存放的程序时,实现上述任一项方法实施例中的步骤。
可选地,上述电子装置还可以包括传输设备以及输入输出设备,其中,该输入输出设备与上述处理器连接。
可选地,在本实施例中,上述处理器可以被设置为通过计算机程序执行以下步骤:
S1,接收目标对象发送的组件请求;
S2,根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;
S3,对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;
S4,根据所述组件请求将所述组合组件发送到目标客户端。
本公开的实施例还提供了一种计算机可读存储介质。上述计算机可读存储介质上存储有计算机程序,上述计算机程序被处理器执行时实现上述任一项方法实施例中的步骤。
可选地,在本实施例中,上述存储介质可以被设置为存储用于执行以下步骤的计算机程序:
S1,接收目标对象发送的组件请求;
S2,根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;
S3,对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;
S4,根据所述组件请求将所述组合组件发送到目标客户端。
该计算机可读存储介质可以是上述实施例中描述的设备/装置中所包含的;也可以是单独存在,而未装配入该设备/装置中。上述计算机可读存储介质承载有一个或者多个程序,当上述一个或者多个程序被执行时,实现根据本公开实施例的方法。
根据本公开的实施例,计算机可读存储介质可以是非易失性的计算机可读存储介质,例如可以包括但不限于:便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本公开中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。
可选地,本实施例中的具体示例可以参考上述实施例及可选实施方式中所描述的示例,本实施例在此不再赘述。
显然,本领域的技术人员应该明白,上述的本公开的各模块或各步骤可以用通用的计算装置来实现,它们可以集中在单个的计算装置上,或者分布在多个计算装置所组成的网络上,可选地,它们可以用计算装置可执行的程序代码来实现,从而,可以将它们存储在存储装置中由计算装置来执行,并且在某些情况下,可以以不同于此处的顺序执行所示出或描述的步骤,或者将它们分别制作成各个集成电路模块,或者将它们中的多个模块或步骤制作成单个集成电路模块来实现。这样,本公开不限制于任何特定的硬件和软件结合。
以上所述仅为本公开的优选实施例而已,并不用于限制于本公开,对于本领域的技术人员来说,本公开可以有各种更改和变化。凡在本公开的原则之内,所作的任何修改、等同替换、改进等,均应包含在本公开的保护范围之内。

Claims (10)

1.一种组合组件的获取方法,其特征在于,包括:
接收目标对象发送的组件请求;
根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;
对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;
根据所述组件请求将所述组合组件发送到目标客户端。
2.根据权利要求1所述的方法,其特征在于,所述接收目标对象发送的组件请求之前,所述方法还包括:
通过模块打包工具执行如下操作:
配置所述公共组件的入口文件,并根据所述入口文件获取所述公共组件的依赖文件;
对所述入口文件和所述依赖文件进行构建打包操作,以得到所述公共组件;
将所述公共组件发布到所述组件服务端。
3.根据权利要求1所述的方法,其特征在于,所述接收目标对象发送的组件请求之前,所述方法还包括:
通过模块打包工具执行如下操作:
配置所述业务组件的入口文件,其中,所述配置包括:在所述入口文件中,将所述公共组件设置为构建忽略,所述构建忽略用于指示在进行所述业务组件的构建打包操作时,忽略所述业务组件会引用到的所述公共组件;
根据所述入口文件获取所述业务组件的依赖文件;
对所述入口文件和所述依赖文件进行所述构建打包操作,以得到所述业务组件;
将所述业务组件发布到所述组件服务端。
4.根据权利要求2或3所述的方法,其特征在于,将组件发布到所述组件服务端之前,所述方法还包括:
对组件执行以下至少之一的操作:
对所述组件执行文件压缩操作,其中,所述组件包括:所述公共组件和所述业务组件;或
通过散列函数对所述组件执行文件散列操作;或
对所述组件执行代码混淆操作。
5.根据权利要求1所述的方法,其特征在于,所述对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,包括:
创建字符串拼接对象,根据所述字符串拼接对象对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,以得到所述组合组件;或
创建字符串缓存数组,根据所述字符串缓存数组对所述公共组件和所述一个或多个业务组件进行所述字符串拼接操作,以得到所述组合组件。
6.根据权利要求1所述的方法,其特征在于,所述根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件,包括:
对所述组件请求进行解析处理,以得到所述公共组件和所述一个或多个业务组件分别对应的文件地址;
根据所述公共组件和所述一个或多个业务组件分别对应的文件地址分别获取所述公共组件和所述一个或多个业务组件。
7.根据权利要求1所述的方法,其特征在于,所述根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件,包括:
根据所述组件请求从所述组件服务端对应的本地组件库中获取所述公共组件和所述一个或多个业务组件;或者
根据所述组件请求和所述组件服务端的配置参数从所述组件服务端对应的云端组件库获取所述公共组件和所述一个或多个业务组件。
8.根据权利要求1所述的方法,其特征在于,所述根据所述组件请求将所述组合组件发送到目标客户端,包括:
对所述组合组件执行文件压缩操作;
根据所述组件请求,通过反向代理服务或者内容分发网络将经过所述文件压缩操作后的所述组合组件发送到目标客户端。
9.一种组合组件的获取装置,其特征在于,包括:
接收模块,用于接收目标对象发送的组件请求;
获取模块,用于根据所述组件请求从组件服务端获取公共组件和一个或多个业务组件;
拼接模块,用于对所述公共组件和所述一个或多个业务组件进行字符串拼接操作,以得到组合组件,其中,所述公共组件和所述一个或多个业务组件是以字符串的形式保存的;
发送模块,用于根据所述组件请求将所述组合组件发送到目标客户端。
10.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现权利要求1至8中任一项所述的方法。
CN202111063885.6A 2021-09-10 2021-09-10 组合组件的获取方法、装置及存储介质 Active CN113722015B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202111063885.6A CN113722015B (zh) 2021-09-10 2021-09-10 组合组件的获取方法、装置及存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202111063885.6A CN113722015B (zh) 2021-09-10 2021-09-10 组合组件的获取方法、装置及存储介质

Publications (2)

Publication Number Publication Date
CN113722015A true CN113722015A (zh) 2021-11-30
CN113722015B CN113722015B (zh) 2024-06-18

Family

ID=78683317

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202111063885.6A Active CN113722015B (zh) 2021-09-10 2021-09-10 组合组件的获取方法、装置及存储介质

Country Status (1)

Country Link
CN (1) CN113722015B (zh)

Citations (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP2004227240A (ja) * 2003-01-22 2004-08-12 Seiko Epson Corp バンドル再構成システム及びバンドル再構成プログラム、並びにバンドル再構成方法
CN107273126A (zh) * 2017-06-15 2017-10-20 中国银行股份有限公司 应用开发方法和装置
CN111381899A (zh) * 2020-02-21 2020-07-07 泰康保险集团股份有限公司 用于开发目标系统的方法和装置
CN111859224A (zh) * 2020-07-31 2020-10-30 平安健康保险股份有限公司 基于节点服务器的服务端渲染方法、装置和计算机设备
CN112131025A (zh) * 2020-09-28 2020-12-25 平安养老保险股份有限公司 组件传输方法、装置、计算机设备及存储介质
CN112287267A (zh) * 2019-07-23 2021-01-29 北京京东尚科信息技术有限公司 一种频道静态资源加载的方法和装置
CN112286513A (zh) * 2019-07-23 2021-01-29 北京京东尚科信息技术有限公司 基于组件元数据的可视化设计方法和装置
CN112416425A (zh) * 2020-11-20 2021-02-26 微医云(杭州)控股有限公司 App构建方法、装置、计算机设备及存储介质

Patent Citations (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
JP2004227240A (ja) * 2003-01-22 2004-08-12 Seiko Epson Corp バンドル再構成システム及びバンドル再構成プログラム、並びにバンドル再構成方法
CN107273126A (zh) * 2017-06-15 2017-10-20 中国银行股份有限公司 应用开发方法和装置
CN112287267A (zh) * 2019-07-23 2021-01-29 北京京东尚科信息技术有限公司 一种频道静态资源加载的方法和装置
CN112286513A (zh) * 2019-07-23 2021-01-29 北京京东尚科信息技术有限公司 基于组件元数据的可视化设计方法和装置
CN111381899A (zh) * 2020-02-21 2020-07-07 泰康保险集团股份有限公司 用于开发目标系统的方法和装置
CN111859224A (zh) * 2020-07-31 2020-10-30 平安健康保险股份有限公司 基于节点服务器的服务端渲染方法、装置和计算机设备
CN112131025A (zh) * 2020-09-28 2020-12-25 平安养老保险股份有限公司 组件传输方法、装置、计算机设备及存储介质
CN112416425A (zh) * 2020-11-20 2021-02-26 微医云(杭州)控股有限公司 App构建方法、装置、计算机设备及存储介质

Also Published As

Publication number Publication date
CN113722015B (zh) 2024-06-18

Similar Documents

Publication Publication Date Title
CN108156210B (zh) 目标资源的获取方法和装置
CN111026982A (zh) 智能合约处理方法、计算机设备及存储介质
CN103268319A (zh) 一种基于网页的云浏览器
CN104283723A (zh) 网络访问日志处理方法及装置
CN113010378B (zh) 微服务模块的日志处理方法及装置、存储介质、电子装置
CN105022832A (zh) App应用程序安全下载的方法、移动终端及下载服务器
CN109254854A (zh) 异步调用方法、计算机装置及存储介质
CN115516840A (zh) 一种信息处理方法、设备、系统、介质、芯片及程序
CN112615759B (zh) 全链路压测组件、全链路压测方法及装置
CN110661853A (zh) 一种数据代理方法、装置、计算机设备及可读存储介质
CN110572422A (zh) 数据下载方法和装置
CN111294235A (zh) 数据处理方法、装置、网关及可读存储介质
CN112416512A (zh) 一种镜像构建方法、服务器、客户机、存储介质及系统
CN112445700A (zh) 测试方法和装置
CN113163028B (zh) 一种业务数据传输方法、装置及系统
CN115543479A (zh) 一种适用于动态参数的接口调用解析方法及装置
CN102932474B (zh) 报文解析方法、设备及系统
CN113722015B (zh) 组合组件的获取方法、装置及存储介质
CN113051202A (zh) 接口适配方法、装置、电子设备和计算机可读存储介质
CN105897767A (zh) 调度方法、调度响应方法及设备和系统
CN113746851B (zh) 一种支持实时解析grpc请求的代理系统和方法
US20220245059A1 (en) Discovery and Aggregation of Multivariate Test Experiments
CN106470237B (zh) 一种异步下载方法及系统
CN112001156A (zh) 一种表单处理方法、装置及计算机可读存储介质
CN111064675A (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