一种跨系统前端组件调用方法及系统与流程

1.本发明涉及多系统集成领域，特别涉及一种系统集成中跨系统前端组件调用方法及系统


背景技术：

2.在系统集成项目中，多个系统之间存在功能互用的需求。通常做法是将复用的功能做成独立的前端页面组件，通过页面调用前端组件达成业务功能复用的目的。前端组件调用时，存在资源下载、身份认证及鉴权等方面的问题需要解决；现有的前端组件调用通常只涉及到了前端组件加载技术，未能从整个调用过程去给出完整的解决方案。


技术实现要素：

3.针对现有技术中存在的问题，提供了一种跨系统前端组件调用方法及系统，解决了不同系统之间前端页面组件调用时候面临的组件下载、身份认证和数据请求鉴权等问题。
4.本发明采用的技术方案如下：一种跨系统前端组件调用方法，应用在集成系统中的系统a与系统b之间，系统a的用户登录系统，通过集成认证中心获取并保存身份票据；系统a通过身份票据向系统b发起所需前端组件加载请求，系统b将身份票据发往集成认证中心进行验证，验证通过后调用前端组件资源包，并下发给系统a；系统a加载前端组件资源包后，前端组件通过身份票据向系统b完成验证后获取业务数据。
5.进一步的，具体步骤为：
6.步骤1、系统a的用户登录系统，集成认证中心为用户生成身份票据，系统a存储到客户端中；
7.步骤2、系统a跨系统调用前端组件，通过组件名解析出其所属的系统b，使用身份票据向系统b发起前端组件加载请求；
8.步骤3、系统b将身份票据发往集成认证中心，获取用户身份信息，并验证是否具备下载权限，验证通过后对组件名进行解析，获得到组件所属模块，调用该模块的前端组件资源包，下发给系统a；
9.步骤4、系统a加载前端资源包后，前端组件再使用身份票据向系统b获取业务数据；
10.步骤5、系统b接收到业务数据获取请求后，通过身份票据向集成认证中心完成验证获的用户身份信息，并根据用户身份信息返回对应的业务数据给前端组件。
11.进一步的，所述步骤3和步骤5中，身份票据验证包括合法性和有效性验证。
12.进一步的，所述前端组件采用“固定前缀_业务系统名称_模块名称”的命名格式进行命名。
13.本发明还提出了一种跨系统前端组件调用系统，包括系统a、系统b以及集成认证中心；
14.系统a，作为调用方，向系统b发起前端组件调用请求以及业务数据获取请求，加载获得的前端组件及业务数据；
15.系统b，作为被调用方，接收系统a发起的请求并完成验证后向系统a下发前端组件资源包以及业务数据；
16.集成认证中心，为系统a下发身份凭据并为系统b提供验证服务。
17.进一步的，系统a发起请求时，需要通过身份票据进行发起。
18.进一步的，所述系统b包括前端组件下载接口和数据服务接口，前端组件下载接口用于完成前端组件下载请求的获取、验证以及前端组件资源包的下发；数据服务接口用于完成业务数据请求的获取、验证以及业务数据的下发。
19.进一步的，系统b中前端组件下载接口工作过程如下:
20.系统b通过前端组件下载接口接收到系统a发起的前端组件获取请求时，将身份票据发往集成认证中心，验证其合法性和有效性并获取用户身份信息，验证是否具备下载权限，验证成功后，解析请求中组件名，获取的前端组件所属模块，调用该模块的前端组件资源包，并下发给系统a。
21.进一步的，系统b中数据服务接口工作过程如下：系统b通过数据服务接口接收到业务数据获取请求时，使用身份票据向集成认证中心验证票据的合法性和有效性，并获得用户身份信息，系统b根据用户身份信息返回对应的业务数据给系统a中发起请求的前端组件。
22.进一步的，所述前端组件采用“固定前缀_业务系统名称_模块名称”的命名格式进行命名。
23.与现有技术相比，采用上述技术方案的有益效果为：
24.1、本发明解决了资源下载、身份认证及鉴权等方面的问题，可应用于系统集成项目，实现业务功能的复用。
25.2、本发明的跨系统调用方法及系统清晰明了，能适用于当前流行的各种前端框架(如vue、react、angularjs等)和后端架构。
26.3、接入成本低，不需要对已有源代码做大量侵入性改动，只需修改前端组件加载流程。
附图说明
27.图1为跨系统的前端组件调用示意图。
28.图2为本发明提出的跨系统调用前端组件的示意图。
具体实施方式
29.下面详细描述本技术的实施例，所述实施例的示例在附图中示出，其中自始至终相同或类似的标号表示相同或类似的模块或具有相同或类似功能的模块。下面通过参考附图描述的实施例是示例性的，仅用于解释本技术，而不能理解为对本技术的限制。相反，本技术的实施例包括落入所附加权利要求书的精神和内涵范围内的所有变化、修改和等同物。
30.实施例1
31.如图1所示为跨系统的前端组件调用示意图，现有的的前端组件调用通常只涉及到了前端组件加载技术，存在资源下载、身份认证及鉴权等方面的问题，基于此本实施例提出了一种跨系统前端组件调用方法，具体方案如下：
32.如图2所示为该跨系统调用前端组件的方法示意图，应用在集成系统中的系统a与系统b以及集成认证中心之间，其调用过程为：
33.①
系统a用户请求登录系统；
34.②
集成认证中心给用户生成一个身份票据，系统a将其存储到浏览器客户端；
35.③
系统a跨系统调用前端组件时，先通过组件名解析出其所属系统(在本实施例中为系统b)，使身份票据向系统b的组件下载接口发起组件加载请求；
36.④
系统b的组件下载接口将身份票据发往集成认证中心，获取用户身份信息，并验证是否具备下载权限，验证成功后通过组件名解析，获得组件所属模块，调用该模块的组件资源包；
37.⑤
系统b将组件资源包下发给系统a；
38.⑥
系统a页面加载前端组件资源包后，前端组件使用身份票据向系统b获取业务数据；
39.⑦
系统b数据服务接口获取到数据请求后，通过身份票据向集成认证中心完成验证获的用户身份信息，并获得其用户身份信息；
40.⑧
系统b数据服务接口根据用户身份信息返回对应的业务数据给前端组件。
41.在本实施例中，系统b在通过身份票据向集成认证中心发起验证时，需要验证身份票据的合法性和有效性，利用身份鉴权特性，可以根据用户身份控制是否给予其资源包。
42.本发明利用单点登录的身份认证票据解决了集成系统项目中跨系统前端组件调用的身份鉴别问题。
43.前端组件是指将复用度比较高的业务组件剥离出来打包成独立的资源包，本实施例中前端组件采用“固定前缀_业务系统名称_模块名称”的命名格式，通过特殊的组件命名，可以轻松实现组件所属系统的寻址，从而向其申请下载组件资源包。
44.在前端组件跨系统加载之后，还可以进一步的向所属系统获取差异化的业务数据，本实施例中，系统b通过数据服务接口接收到业务数据获取请求时，使用身份票据向集成认证中心验证票据的合法性和有效性，并获得用户身份信息，系统b根据用户身份信息返回对应的业务数据给系统a中发起请求的前端组件。
45.本发明提出的跨系统前端组件调用方法，解决了资源下载、身份认证及鉴权等方面的问题，可应用于系统集成项目，实现业务功能的复用。能适用于当前流行的各种前端框架(如vue、react、angularjs等)和后端架构，且接入成本低。
46.实施例2
47.本实施例还提出了一种跨系统前端组件调用系统，包括系统a、系统b以及集成认证中心；
48.系统a，作为调用方，向系统b发起前端组件调用请求以及业务数据获取请求，加载获得的前端组件及业务数据；
49.系统b，作为被调用方，接收系统a发起的请求并完成验证后向系统a下发前端组件资源包以及业务数据；
50.集成认证中心，为系统a下发身份凭据并为系统b提供验证服务。
51.需要说明的是，在系统a发起请求时，需要通过身份票据进行发起，即请求中需要携带身份票据。
52.在本实施例中，系统b包括前端组件下载接口和数据服务接口，前端组件下载接口用于完成前端组件下载请求的获取、验证以及前端组件资源包的下发；数据服务接口用于完成业务数据请求的获取、验证以及业务数据的下发。
53.进一步的，在本实施例的系统集成项目中，利用单点登录的身份认证票据解决跨系统前端组件调用的身份鉴别问题，基于身份鉴权特性，可以根据用户身份控制是否给予其资源包。具体的，系统b中前端组件下载接口工作过程如下:
54.系统b通过前端组件下载接口接收到系统a发起的前端组件获取请求时，将身份票据发往集成认证中心，验证其合法性和有效性并获取用户身份信息，验证是否具备下载权限，验证成功后，解析请求中组件名，获取的前端组件所属模块，调用该模块的前端组件资源包，并下发给系统a。
55.进一步的，在前端组件跨系统加载后，能通过用户身份做差异化的数据显示，系统b中数据服务接口工作过程如下：系统b通过数据服务接口接收到业务数据获取请求时，使用身份票据向集成认证中心验证票据的合法性和有效性，并获得用户身份信息，系统b根据用户身份信息返回对应的业务数据给系统a中发起请求的前端组件。
56.在本实施例中，所述前端组件采用“固定前缀_业务系统名称_模块名称”的命名格式进行命名，通过特殊的组件命名，可以轻松实现组件所属系统的寻址，从而向其申请下载组件资源包。
57.需要说明的是，在本发明实施例的描述中，除非另有明确的规定和限定，术语“设置”、“连接”应做广义理解，例如，可以是固定连接，也可以是可拆卸连接，或一体地连接；可以是直接连接，也可以通过中间媒介间接连接。对于本领域的普通技术人员而言，可以具体情况理解上述术语在本发明中的具体含义；实施例中的附图用以对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本发明一部分实施例，而不是全部的实施例。通常在此处附图中描述和示出的本发明实施例的组件可以以各种不同的配置来布置和设计。
58.尽管上面已经示出和描述了本技术的实施例，可以理解的是，上述实施例是示例性的，不能理解为对本技术的限制，本领域的普通技术人员在本技术的范围内可以对上述实施例进行变化、修改、替换和变型。

技术特征：
1.一种跨系统前端组件调用方法，其特征在于，应用在集成系统中的系统a与系统b之间，系统a的用户登录系统，通过集成认证中心获取并保存身份票据；系统a通过身份票据向系统b发起所需前端组件加载请求，系统b将身份票据发往集成认证中心进行验证，验证通过后调用前端组件资源包，并下发给系统a；系统a加载前端组件资源包后，前端组件通过身份票据向系统b完成验证后获取业务数据。2.根据权利要求1所述的跨系统前端组件调用方法，其特征在于，具体步骤为：步骤1、系统a的用户登录系统，集成认证中心为用户生成身份票据，系统a存储到客户端中；步骤2、系统a跨系统调用前端组件，通过组件名解析出其所属的系统b，使用身份票据向系统b发起前端组件加载请求；步骤3、系统b将身份票据发往集成认证中心，获取用户身份信息，并验证是否具备下载权限，验证通过后对组件名进行解析，获得到组件所属模块，调用该模块的前端组件资源包，下发给系统a；步骤4、系统a加载前端资源包后，前端组件再使用身份票据向系统b获取业务数据；步骤5、系统b接收到业务数据获取请求后，通过身份票据向集成认证中心完成验证获的用户身份信息，并根据用户身份信息返回对应的业务数据给前端组件。3.根据权利要求2所述的跨系统前端组件调用方法，其特征在于，所述步骤3和步骤5中，身份票据验证包括合法性和有效性验证。4.根据权利要求1或2所述的跨系统前端组件调用方法，其特征在于，所述前端组件采用“固定前缀_业务系统名称_模块名称”的命名格式进行命名。5.一种跨系统前端组件调用系统，其特征在于，包括系统a、系统b以及集成认证中心；系统a，作为调用方，向系统b发起前端组件调用请求以及业务数据获取请求，加载获得的前端组件及业务数据；系统b，作为被调用方，接收系统a发起的请求并完成验证后向系统a下发前端组件资源包以及业务数据；集成认证中心，为系统a下发身份凭据并为系统b提供验证服务。6.根据权利要求5所述的跨系统前端组件调用系统，其特征在于，系统a发起请求时，需要通过身份票据进行发起。7.根据权利要求5或6所述的跨系统前端组件调用系统，其特征在于，所述系统b包括前端组件下载接口和数据服务接口，前端组件下载接口用于完成前端组件下载请求的获取、验证以及前端组件资源包的下发；数据服务接口用于完成业务数据请求的获取、验证以及业务数据的下发。8.根据权利要求7所述的跨系统前端组件调用系统，其特征在于，系统b中前端组件下载接口工作过程如下:系统b通过前端组件下载接口接收到系统a发起的前端组件获取请求时，将身份票据发往集成认证中心，验证其合法性和有效性并获取用户身份信息，验证是否具备下载权限，验证成功后，解析请求中组件名，获取的前端组件所属模块，调用该模块的前端组件资源包，并下发给系统a。9.根据权利要求7所述的跨系统前端组件调用系统，其特征在于，系统b中数据服务接
口工作过程如下：系统b通过数据服务接口接收到业务数据获取请求时，使用身份票据向集成认证中心验证票据的合法性和有效性，并获得用户身份信息，系统b根据用户身份信息返回对应的业务数据给系统a中发起请求的前端组件。10.根据权利要求6所述的跨系统前端组件调用系统，其特征在于，前端组件采用“固定前缀_业务系统名称_模块名称”的命名格式进行命名。

技术总结
本发明提供了一种跨系统前端组件调用方法及系统，应用在集成系统中的系统A与系统B之间，系统A的用户登录系统，通过集成认证中心获取并保存身份票据；系统A通过身份票据向系统B发起所需前端组件加载请求，系统B将身份票据发往集成认证中心进行验证，验证通过后调用前端组件资源包，并下发给系统A；系统A加载前端组件资源包后，前端组件通过身份票据向系统B完成验证后获取业务数据。本发明解决了资源下载、身份认证及鉴权等方面的问题，可应用于系统集成项目，实现业务功能的复用；调用方法及系统清晰明了，能适用于当前流行的各种前端框架和后端架构，接入成本低。接入成本低。接入成本低。


技术研发人员：王锋 吴蓉 冷青松 李林啸 杨洪 朱媛媛 涂俊亮 徐春花 陈德勇 魏雨汐 邓蕾 李开文
受保护的技术使用者：中国电子科技集团公司第三十研究所
技术研发日：2023.01.18
技术公布日：2023/7/11