CN115586890A

CN115586890A - 一种基于微前端框架的平台国际化方法及系统

Info

Publication number: CN115586890A
Application number: CN202211192390.8A
Authority: CN
Inventors: 马青青
Original assignee: CCB Finetech Co Ltd
Current assignee: CCB Finetech Co Ltd
Priority date: 2022-09-28
Filing date: 2022-09-28
Publication date: 2023-01-10

Abstract

本发明涉及一种基于微前端框架的平台国际化方法及系统，包括将各个子应用部署于主应用，其中所述子应用包括国际化专有子应用；所述主应用将各个子应用的配置文件传输至国际化专有子应用；国际化子应用读取配置文件，对配置文件进行解析；判断配置文件是否更新；若配置文件未更新，所述国际化专有子应用使用已有的统一国际化文件；若配置文件已更新，所述国际化专有子应用根据更新后的所述配置文件及国际化文件配置规则，生成新的统一国际化文件；各个所述子应用根据所述统一国际化文件，生成国际化页面。通过由单独子应用控制整个平台的国际化功能，避免每个子应用对国际化功能的重复开发，减少工作重复，同时与底层代码解耦，迭代更为灵活。

Description

一种基于微前端框架的平台国际化方法及系统

技术领域

本发明涉及计算机技术领域，尤其涉及一种基于微前端框架的平台国际化方法及系统。

背景技术

微前端借鉴了微服务的架构理念，将一个庞大的前端应用拆分为多个独立灵活的小型应用，每个应用都可以独立开发、独立运行、独立部署，再将这些小型应用联合为一个完整的应用。微前端既可以将多个项目融合为一，又可以减少项目之间的耦合，提升项目扩展性，相比一整块的前端仓库，微前端架构下的前端应用仓库倾向于更小更灵活。

页面国际化就是指页面可以按照中英文切换显示。目前，页面国际化的实现方法是在应用中建立多语言配置文件，然后当应用中的页面加载时根据语言环境选择相应的配置文件作为依据，对页面上的关键词进行翻译。

目前若想实现整个平台的语言国际化，就需要各个子应用都开发一套国际化代码，造成研发人员重复开发类似功能，工作量产生冗余。

发明内容

为了解决上述背景技术中提到的至少一个问题，发明提出一种基于微前端框架的平台国际化方法及系统，能够将微前端架构中的各个子应用的统一国际化文件在国际化专有子应用中进行维护，由单独子应用控制整个平台的国际化功能，避免每个子应用对国际化功能的重复开发，减少工作量重复，同时与底层基座(即主应用)代码解耦，迭代更为灵活，提高工作效率。

为实现以上目的，本发明所采用的技术方案包括：

一种基于微前端框架的平台国际化方法，包括：

将各个子应用部署于主应用，其中所述子应用包括国际化专有子应用；

S2、所述主应用将各个所述子应用的配置文件传输至所述国际化专有子应用；

S3、所述国际化子应用读取所述配置文件，对所述配置文件进行解析；

S4、判断所述配置文件是否更新；

S5、若所述配置文件未更新，所述国际化专有子应用使用已有的统一国际化文件；

若所述配置文件已更新，所述国际化专有子应用根据更新后的所述配置文件及国际化文件配置规则，生成新的统一国际化文件；

S6、各个所述子应用根据所述统一国际化文件，生成国际化页面。

进一步地，所述S1之前还包括：所述主应用中包括所述国际化文件配置规则。

进一步地，所述S1之前还包括：将各个所述子应用需要国际化展示的文本内容存储于配置文件中，其中，一个子应用对应一个配置文件。

进一步地，所述S5还包括：当确定所述统一国际化文件后，生成配置完成通知，将所述通知传输至所述主应用；

所述主应用收到所述通知后，为各个所述子应用放行。

进一步的，所述将各个所述子应用需要国际化展示的文本内容存储于配置文件中，包括：

将各个所述子应用需要国际化展示的文本内容转换为json字符串写入配置文件中。

进一步地，所述方法还包括：将所述统一国际化文件存储至存储平台。

本发明还涉及一种基于微前端框架的平台国际化系统，包括：

部署模块，用于将各个子应用部署于主应用，其中所述子应用包括国际化专有子应用；

传输模块，用于所述主应用将各个所述子应用的配置文件传输至所述国际化专有子应用；

解析模块，用于所述国际化子应用读取所述配置文件，对所述配置文件进行解析；

判断模块，用于判断所述配置文件是否更新；

处理模块，用于若所述配置文件未更新，所述国际化专有子应用使用已有的统一国际化文件；

生成模块，用于各个所述子应用根据所述统一国际化文件，生成国际化页面。

本发明还涉及一种计算机可读存储介质，所述存储介质上存储有计算机程序，所述计算机程序被处理器执行时实现上述的方法。

本发明还涉及一种电子设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现上述的方法。

本发明还涉及一种计算机程序产品，包括计算机程序和/或指令，其特征在于，该计算机程序和/或指令被处理器执行时实现上述方法的步骤。

本发明的有益效果为：

本发明将微前端架构中的各个子应用的统一国际化文件在国际化专有子应用中进行维护，由单独子应用控制整个平台的国际化功能，避免每个子应用对国际化功能的重复开发，减少工作量重复，同时与底层基座(即主应用)代码解耦，迭代更为灵活，提高工作效率。

附图说明

图1为本发明一种基于微前端框架的平台国际化方法流程示意图。

图2为本发明一种基于微前端框架的平台国际化系统结构示意图。

具体实施方式

为使本申请的目的、技术方案和优点更加清楚，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。

应当理解，在本申请的描述中，除非上下文明确要求，否则整个说明书和权利要求书中的“包括”、“包含”等类似词语应当解释为包含的含义而不是排他或穷举的含义；也就是说，是“包括但不限于”的含义。

还应当理解，术语“第一”、“第二”等仅用于描述目的，而不能理解为指示或暗示相对重要性。此外，在本申请的描述中，除非另有说明，“多个”的含义是两个或两个以上。

需要注意的是，术语“S1”、“S2”等仅用于步骤的描述目的，并非特别指称次序或顺位的意思，亦非用以限定本申请，其仅仅是为了方便描述本申请的方法，而不能理解为指示步骤的先后顺序。另外，各个实施例之间的技术方案可以相互结合，但是必须是以本领域普通技术人员能够实现为基础，当技术方案的结合出现相互矛盾或无法实现时应当认为这种技术方案的结合不存在，也不在本申请要求的保护范围之内。

微前端是一种类似于微服务的架构，它将微服务的理念应用于浏览器端，即将Web应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。各个前端应用可以独立运行、独立开发、独立部署。

本发明第一方面涉及一种步骤流程如图1所示的基于微前端框架的平台国际化方法，方法包括：

S1、将各个子应用部署于主应用，其中所述子应用包括国际化专有子应用；

微前端包括一个主应用以及多个子应用。其中，主应用只提供总体的控制功能，不提供具体的业务功能；子应用提供具体的业务功能。

具体的，主应用为微前端架构中众多子应用的基础工程，其余各个子应用都在该主应用中注册。

微前端体系下，代码更加简洁，能够避免无关组件之间的不必要耦合，实现组件解耦，更易于维护，从而实现团队自治。然而，大幅提升的团队自治水平可能会让各个团队的工作愈加分裂。各团队只关注自己的业务或者平台功能，在面向用户的整体交付方面，会导致对用户需求和体现不敏感，和响应不及时。并且，不同子应用之间依赖的包存在很多重复，由于各应用独立开发、编译和发布，难免会存在重复依赖的情况。从而导致不同应用之间需要重复下载依赖，额外再增加了流量和服务端压力。

具体的，对于页面国际化场景下，每个子应用都有各自的国际化文件，不同的子应用间就存在相同的词条重复配置或是相同的词条而翻译不一致的情况。由单独子应用控制整个平台的国际化功能，避免每个子应用对国际化功能的重复开发，减少工作量重复，同时与底层基座(即主应用)代码解耦，迭代更为灵活，提高了开发效率，易于维护。

在一些实施例中，在S1之前包括，所述主应用中包括所述国际化文件配置规则；

示例性的，获取国际化页面中的至少一个词条，对每个词条配置多个属性，属性包括关键字以及至少一个语种翻译数据，关键字用于标识当前词条，关键字全局唯一。

具体的，上述词条为页面中国际化配置对象，可以包括一个或多个字或字段、一组或多组词语、一句或多句语句。

关键字可以包括key，key全局唯一。属性可以包括key、zh_CN、en_US等。其中，key用于标识文本，zh_cn表示当前文本对应的汉语译文，en表示当前文本对应的英语译文。若还需要其他语种翻译，可以增加其他语种属性，属性名称可以根据该语种自定义。

在一些实施例中，将上述国际化文件配置规则保存到可永久保存的物理存储设备或数据库中。将内存中的对象存储在数据库中，或者存储在磁盘文件中、XML数据文件中等等。

其中，将上述国际化文件配置规则保存到可永久保存的物理存储设备中，具体包括：将上述国际化文件配置规则转换为json字符串写入文件中，将文件保存至物理存储设备中。

示例性的，将国际化文件配置规则转换为json字符串，例如，{key：“login”，zh_CN：“登录”，en_US：“Login”}这样的形式写入写入文件中，再将该文件存储至物理存储设备中。也可以通过国际化文件配置规则数据逐个保存到数据库中，以供后续取用。

将各个所述子应用需要国际化展示的文本内容存储于配置文件中，其中，一个子应用对应一个配置文件。

具体的，所述配置文件为Config文件。Config文件是通过各种程序使用的通用配置文件。它包含的设置和配置信息以及不同的程序可以以不同的格式存储数据。

在一些实施方式中，在S2之后，所述方法还包括：

201、在系统初始化时，在所述主应用中读取所有数据；

202、读取当前系统的语种环境，根据语种环境以及数据，得到每个词条的对应语种翻译数据；

203、将每个词条的关键字与对应语种翻译数据组合，得到组合后的词条数据。

具体的，系统可以包括浏览器，服务器等。系统初始化可以包括浏览器刷新，页面重新加载等情况。可以在改变语言环境、网络环境时进行系统初始化，这时就需要重新加载页面信息，重新读取词条数据对页面信息进行翻译转换。

示例性的，若识别到当前语言环境为汉语语言，则可以根据当前语言环境(汉语环境)，对词条数据进行转换，过滤掉其他语言环境属性数据信息，转换为key：value格式，即转换为key：zh_CN格式。使得词条、关键字与当前语言环境(汉语环境)对应的属性单独匹配，例如{login：“登录”}。通过这样的技术手段，可以减少与当前语言环境无关的其他语言环境属性数据信息的传输与处理，从而减少运算量与服务端的压力，提升翻译转换效率。

S4、判断所述配置文件是否更新；

从主应用中去请求子应用的资源是会存在跨域的问题，因此在子应用中必须要进行跨域放行。

在一些实施例中，S5还包括当确定所述统一国际化文件后，生成配置完成通知，将所述通知传输至所述主应用；

所述主应用收到所述通知后，为各个所述子应用放行。

在一些实施方式中，在为至少一个子应用放行时，将统一国际化文件传输至子应用；在子应用页面加载时，根据统一国际化文件进行页面翻译。S6、各个所述子应用根据所述统一国际化文件，生成国际化页面。

具体的，页面翻译与转换统一，可以实现页面翻译一致性。各个子应用自主完成页面翻译流程，实现团队的独立自治。

在一些实施例中，将所述统一国际化文件存储至存储平台。各个所述子应用从存储平台获取所述统一国际化文件，根据所述统一国际化文件，生成国际化页面。

本发明通过一个独立完整的国际化专有子应用完成整个平台的国际化配置，国际化专有子应用的主要业务为收集各子应用的页面文本并解析，生产新的国际化文件，达到平台的国际化功能与底层基座业务解耦的目的，国际化功能相对灵活，且能实现对各子应用国际化的统一管理。

具体而言，当基座上(主应用)上的其他子应用注册或更新时，基座将其他子应用的页面文本文件转发给国际化专有子应用，国际化专有子应用将所收集到的页面文本文件根据国际化文件配置规则，生产新的统一国际化文件，并将文件存储起来。其他子应用依据统一的国际化文件将页面进行国际化展示。

本发明另一方面还涉及一种基于微前端框架的平台国际化系统，其结构如图2所示，包括：

判断模块，用于判断所述配置文件是否更新；

若所述配置文件已更新，所述国际化专有子应用根据更新后的所述配置文件，生成新的统一国际化文件；

通过使用该系统，能够执行上述的运算处理方法并实现对应的技术效果。

本发明的实施例还提供能够实现上述实施例中的基于微前端框架的平台国际化方法中全部步骤的一种计算机可读存储介质，所述计算机可读存储介质上存储有计算机程序，该计算机程序被处理器执行时实现上述实施例中的基于微前端框架的平台国际化方法的全部步骤。

本发明的实施例还提供一种用于执行上述方法的电子设备，作为该方法的实现装置，所述电子设备至少具备有处理器和存储器，特别是该存储器上存储有执行方法所需的数据和相关的计算机程序，并通过由处理器调用存储器中的数据、程序执行实现方法的全部步骤，并获得对应的技术效果。

优选的，该电子设备可以包含有总线架构，总线可以包括任意数量的互联的总线和桥，总线将包括由一个或多个处理器和存储器的各种电路链接在一起。总线还可以将诸如外围设备、稳压器和功率管理电路等之类的各种其他电路链接在一起，这些都是本领域所公知的，因此，本文不再对其进行进一步描述。总线接口在总线和接收器和发送器之间提供接口。接收器和发送器可以是同一个元件，即收发机，提供用于在传输介质上与各种其他系统通信的单元。处理器负责管理总线和通常的处理，而存储器可以被用于存储处理器在执行操作时所使用的数据。

额外的，所述电子设备还可以进一步包括通信模块、输入单元、音频处理器、显示器、电源等部件。其所采用的处理器(或称为控制器、操作控件)可以包括微处理器或其他处理器装置和/或逻辑装置，该处理器接收输入并控制电子设备的各个部件的操作；存储器可以是缓存器、闪存、硬驱、可移动介质、易失性存储器、非易失性存储器或其它合适装置中的一种或更多种，可储存上述有关的数据信息，此外还可存储执行有关信息的程序，并且处理器可执行该存储器存储的该程序，以实现信息存储或处理等；输入单元用于向处理器提供输入，例如可以为按键或触摸输入装置；电源用于向电子设备提供电力；显示器用于进行图像和文字等显示对象的显示，例如可为LCD显示器。通信模块即为经由天线发送和接收信号的发送机/接收机。通信模块(发送机/接收机)耦合到处理器，以提供输入信号和接收输出信号，这可以和常规移动通信终端的情况相同。基于不同的通信技术，在同一电子设备中，可以设置有多个通信模块，如蜂窝网络模块、蓝牙模块和/或无线局域网模块等。通信模块(发送机/接收机)还经由音频处理器耦合到扬声器和麦克风，以经由扬声器提供音频输出，并接收来自麦克风的音频输入，从而实现通常的电信功能。音频处理器可以包括任何合适的缓冲器、解码器、放大器等。另外，音频处理器还耦合到中央处理器，从而使得可以通过麦克风能够在本机上录音，且使得可以通过扬声器来播放本机上存储的声音。

本领域内的技术人员应明白，本发明的实施例可提供为方法、系统、或计算机程序产品。因此，本发明可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。

本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的系统。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令系统的制造品，该指令系统实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。

尽管已描述了本发明的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例做出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本发明范围的所有变更和修改。

以上所述仅为本发明较佳的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到的变化或替换等都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应该以权利要求书的保护范围为准。

Claims

1.一种基于微前端框架的平台国际化方法，其特征在于，包括：

S4、判断所述配置文件是否更新；

2.如权利要求1所述的方法，其特征在于，所述S1之前还包括：所述主应用中包括所述国际化文件配置规则。

3.如权利要求2所述的方法，其特征在于，所述S1之前还包括：将各个所述子应用需要国际化展示的文本内容存储于配置文件中，其中，一个子应用对应一个配置文件。

4.如权利要求3所述的方法，其特征在于，所述S5还包括：当确定所述统一国际化文件后，生成配置完成通知，将所述通知传输至所述主应用；

所述主应用收到所述通知后，为各个所述子应用放行。

5.如权利要求3所述的方法，其特征在于，所述将各个所述子应用需要国际化展示的文本内容存储于配置文件中，包括：

6.如权利要求1至5任一项所述的方法，其特征在于，所述方法还包括：将所述统一国际化文件存储至存储平台。

7.一种基于微前端框架的平台国际化系统，其特征在于，包括：

判断模块，用于判断所述配置文件是否更新；

8.一种计算机可读存储介质，其特征在于，所述存储介质上存储有计算机程序，所述计算机程序被处理器执行时实现权利要求1至6中任一项所述的方法。

9.一种计算机设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，其特征在于，所述处理器执行所述计算机程序时实现权利要求1至6任一项所述方法。

10.一种计算机程序产品，包括计算机程序和/或指令，其特征在于，该计算机程序和/或指令被处理器执行时实现权利要求1至6中任一项所述方法的步骤。