Application integration method and device based on micro-front-end framework and storage medium

Abstract

The embodiment of the invention provides an application integration method and device based on a micro-front-end framework, equipment and a storage medium, and belongs to the technical field of development. The method comprises the following steps: acquiring a configuration file of a micro-front-end framework; according to the configuration file, registering the sub-application in the main application to obtain registration information; performing route transformation on the sub-applications to obtain routes of the sub-applications; and under the condition that the main application runs in the micro-front-end environment, managing the sub-applications in the main application according to the routing and registration information. According to the embodiment of the invention, efficient and accurate development of the Web application can be realized.

Description

Technical Field

[0001] The present application relates to the field of development technology, and in particular to an application integration method, device, equipment and storage medium based on a micro-frontend framework. Background Art

[0002] In the long-term development of large-scale web applications, as the number of projects increases, after the common code in different projects is upgraded or bugs are fixed, it is necessary to copy, merge and modify the common code in all projects separately. This repetitive operation is not only time-consuming and labor-intensive, but also prone to omissions or errors.

[0003] Therefore, how to achieve efficient and accurate development of Web applications has become a technical problem that needs to be solved urgently. Summary of the invention

[0004] The main purpose of the embodiments of the present application is to propose an application integration method, device, equipment and storage medium based on a micro-front-end framework, aiming to achieve efficient and accurate development of Web applications.

[0005] To achieve the above objectives, a first aspect of an embodiment of the present application proposes an application integration method based on a micro-frontend framework, the method comprising:

[0006] Get the configuration file of the micro frontend framework;

[0007] According to the configuration file, register the sub-application in the main application to obtain registration information;

[0008] Performing routing transformation on the sub-application to obtain the routing of the sub-application;

[0009] When the main application runs in a micro front-end environment, the sub-application is managed in the main application according to the routing and the registration information.

[0010] To achieve the above-mentioned purpose, a second aspect of an embodiment of the present application proposes an application integration device based on a micro-frontend framework, the device comprising:

[0011] Configuration file acquisition module, used to obtain the configuration file of the micro front-end framework;

[0012] A sub-application registration module, used to register the sub-application in the main application according to the configuration file to obtain registration information;

[0013] A routing transformation module, used to perform routing transformation on the sub-application to obtain the routing of the sub-application;

[0014] The sub-application management module is used to manage the sub-application in the main application according to the routing and the registration information when the main application runs in the micro-frontend environment.

[0015] To achieve the above-mentioned purpose, the third aspect of an embodiment of the present application proposes a computer device, which includes a memory and a processor, the memory stores a computer program, and the processor implements the method described in the first aspect when executing the computer program.

[0016] To achieve the above-mentioned purpose, the fourth aspect of an embodiment of the present application proposes a computer-readable storage medium, wherein the computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the method described in the first aspect is implemented.

[0017] The present application proposes an application integration method, device, equipment and storage medium based on a micro-frontend framework. The application integration method based on a micro-frontend framework obtains a configuration file of the micro-frontend framework; registers a sub-application in a main application according to the configuration file to obtain registration information; performs routing transformation on the sub-application to obtain the routing of the sub-application; and manages the sub-application in the main application according to the routing and registration information when the main application runs in a micro-frontend environment. In this way, on the one hand, the sub-application is accurately and dynamically registered in the main application through the configuration file of the micro-frontend framework; on the other hand, the independence and compatibility of the routing between the main application and the sub-application are ensured by performing routing transformation on the sub-application, so that the sub-application can be managed in a standardized manner on demand in the main application based on the routing and registration information of the sub-application, so that the sub-application can maintain independence and is not interfered by the main application or other sub-applications, so as to achieve decoupling between the main application and the sub-application, and at the same time ensure that the sub-application can run independently and the sub-application is seamlessly integrated with the main application, thereby achieving independent and accurate development of the sub-application and improving development efficiency and collaboration. BRIEF DESCRIPTION OF THE DRAWINGS

[0018] Figure 1 This is a flow chart of an application integration method based on a micro-frontend framework provided in an embodiment of the present application;

[0019] Figure 2 This is a schematic diagram of a micro front-end implemented by Webpack and qiankun provided in an embodiment of the present application;

[0020] Figure 3 is another flow chart of the application integration method based on the micro front-end framework provided in an embodiment of the present application;

[0021] Figure 4 This is another flow chart of the application integration method based on the micro front-end framework provided in an embodiment of the present application;

[0022] Figure 5 is a schematic block diagram of an application integration device based on a micro-frontend framework provided in an embodiment of the present application;

[0023] Figure 6 It is a schematic block diagram of the structure of the computer device provided in the embodiment of the present application. DETAILED DESCRIPTION

[0024] In order to make the purpose, technical solution and advantages of the present application more clearly understood, the present application is further described in detail below in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present application and are not used to limit the present application.

[0025] It should be noted that, although the functional modules are divided in the device schematic diagram and the logical order is shown in the flowchart, in some cases, the steps shown or described may be performed in a different order than the module division in the device or the order in the flowchart. The terms "first", "second", etc. in the specification, claims and the above drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence.

[0026] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as those commonly understood by those skilled in the art to which this application belongs. The terms used herein are only for the purpose of describing the embodiments of this application and are not intended to limit this application.

[0027] The embodiments of the present application provide an application integration method, apparatus, device and storage medium based on a micro-front-end framework, aiming to achieve efficient and accurate development of Web applications.

[0028] The application integration method, device, equipment and storage medium based on the micro-front-end framework provided in the embodiments of the present application are specifically illustrated by the following embodiments. First, the application integration method based on the micro-front-end framework in the embodiments of the present application is described.

[0029] The application integration method based on the micro-frontend framework provided in the embodiment of the present application relates to the field of development technology. The application integration method based on the micro-frontend framework provided in the embodiment of the present application can be applied to the terminal, can also be applied to the server side, and can also be software running in the terminal or the server side. In some embodiments, the terminal can be a vehicle-mounted terminal, a smart phone, a tablet computer, a laptop computer, a desktop computer, etc.; the server side can be configured as an independent physical server, or it can be configured as a server cluster or distributed system composed of multiple physical servers, and can also be configured as a cloud server that provides basic cloud computing services such as cloud services, cloud databases, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, CDN, and big data and artificial intelligence platforms; the software can be an application that implements the application integration method based on the micro-frontend framework, etc., but is not limited to the above forms.

[0030] The present application can be used in many general or special computer system environments or configurations. For example: personal computers, server computers, handheld or portable devices, tablet devices, multiprocessor systems, microprocessor-based systems, set-top boxes, programmable consumer computer devices, network PCs, minicomputers, mainframe computers, distributed computing environments including any of the above systems or devices, etc. The present application can be described in the general context of computer executable instructions executed by a computer, such as program modules. Generally, program modules include routines, programs, objects, components, data structures, etc. that perform specific tasks or implement specific abstract data types. The present application can also be practiced in distributed computing environments, in which tasks are performed by remote processing devices connected through a communication network. In a distributed computing environment, program modules can be located in local and remote computer storage media including storage devices.

[0031] It should be noted that in each specific implementation of the present application, when it comes to the need to perform relevant processing based on data related to user identity or characteristics such as user information, user behavior data, user historical data, and user location information, the user's permission or consent will be obtained first, and the collection, use, and processing of these data will comply with relevant laws, regulations, and standards. In addition, when the embodiment of the present application needs to obtain the user's sensitive personal information, the user's separate permission or consent will be obtained through a pop-up window or by jumping to a confirmation page. After clearly obtaining the user's separate permission or consent, the necessary user-related data for the normal operation of the embodiment of the present application will be obtained.

[0032] Figure 1 is an optional flow chart of an application integration method based on a micro-frontend framework provided in an embodiment of the present application. Figure 1The method may include but is not limited to steps S101 to S104.

[0033] Step S101, obtain the configuration file of the micro front-end framework.

[0034] Among them, Micro-Frontend Framework refers to a core tool for implementing micro-frontend architecture, which aims to split large and complex web applications into multiple small and independent sub-applications, and help the main application manage these multiple sub-applications. Each sub-application can use a different technology stack and can be independently developed, tested, deployed and maintained by different developers. Through the micro-frontend framework, development efficiency can be improved and the dependence between different developers can be reduced.

[0035] Exemplarily, the micro-frontend framework can be a fully functional qiankun, which can support different sub-applications at the same time, allow different sub-applications to coexist, and ensure the independence of each sub-application through sandbox isolation.

[0036] See also Figure 2 , Figure 2 This is a schematic diagram of a micro frontend implemented with Webpack and Qiankun. Webpack is a static module packager for an application, which aims to package various resources of the application into one or more files for encapsulation. Figure 2 In the diagram, Webpack can be used to encapsulate the common business components of the main application and sub-applications, thereby supporting the sharing of common business components between the main application and the sub-applications; it can support the sub-applications to share the state of the main application, and can also support the isolation of the state of the sub-applications from the main application; each sub-application can use a different technology stack to achieve independent integration of technology stacks; sandbox isolation can be used to ensure the independence of each sub-application, and support the independence and compatibility of routing between the main application and the sub-applications; it can simultaneously support different sub-applications such as React, Vue, Angular, and Jquery.

[0037] Exemplarily, the micro front-end framework may also be a lighter microApp.js, which can ensure rapid integration of sub-applications with the main application.

[0038] Get the configuration files of the micro frontend framework pre-compiled by the developer.

[0039] Among them, the configuration file is a configuration script used in the micro front-end framework to describe the details of how to register and manage multiple sub-applications in the main application.

[0040] The configuration file includes but is not limited to the following details:

[0041] Sub-application registration mechanism: declare which sub-applications need to be registered to the main application through which method (such as registerMicroApps method);

[0042] Basic information of the sub-application: such as the name of the sub-application, the unique identifier of the sub-application, the entry address of the sub-application (such as the URL address), etc.

[0043] Sub-application activation mechanism: specifies when to activate a sub-application (such as activation rules based on routing);

[0044] Sub-application rendering mechanism: specifies in which rendering container (such as DOM element) in the main application the sub-application is rendered;

[0045] Sub-application lifecycle functions: For example, sub-application lifecycle functions when initializing (bootstrap), loading (mount), mounting (unmount), and uninstalling (update). The sub-application lifecycle includes initialization, loading, mounting, and uninstalling.

[0046] Configuration files play an important role in the micro frontend framework, which can help the main application standardize and manage the behavior of sub-applications as needed.

[0047] Step S102: register the sub-application in the main application according to the configuration file to obtain registration information.

[0048] The configuration file of the micro-frontend framework is parsed and executed in the main application to accurately register the sub-application with the main application. The registration information of the sub-application includes but is not limited to the activation mechanism, rendering mechanism and life cycle function. In this way, the foundation is laid for the main application to effectively manage the sub-application.

[0049] Specifically, you can register a sub-application into the main application through the registerMicroApps method. The registerMicroApps method is used to register a sub-application into the main application and pass the sub-application's activation mechanism, rendering mechanism, and lifecycle functions to the main application.

[0050] In this way, based on the registration mechanism of the sub-application in the configuration file, the sub-application can be registered in the main application through the registerMicroApps method, ensuring that the subsequent main application can manage the sub-application as needed.

[0051] Step S103, performing routing transformation on the sub-application to obtain the routing of the sub-application.

[0052] You can perform routing transformation on the sub-application to obtain the sub-application's routing to ensure that the sub-application's routing does not conflict with the main application's routing, thereby ensuring the independence of the sub-application.

[0053] In step S103 of some embodiments, the original route of the sub-application may be obtained; the identifier of the sub-application is added as a prefix to the original route to obtain the route.

[0054] Among them, the original route of the sub-application is usually the same as the route of the main application. The unique identifier of the sub-application (such as the identifier miniApp1 of sub-application 1 and the identifier miniApp2 of sub-application 2) can be added to the front of the original route as a specific prefix to obtain the route of the sub-application, so as to distinguish the route of the sub-application from the route of the main application, avoid route conflicts, and ensure that the route of the sub-application is compatible and synchronized with the route of the main application.

[0055] Step S104: When the main application runs in the micro front-end environment, the sub-application is managed in the main application according to the routing and registration information.

[0056] When the main application runs in a micro-frontend environment, the sub-application is managed in the main application based on its routing and registration information to achieve decoupling between the sub-application and the main application, while ensuring that the sub-application can run independently and that the sub-application is seamlessly integrated with the main application. In this way, each sub-application can be independently developed by different developers.

[0057] See also Figure 3 In some embodiments, the registration information includes the activation mechanism and life cycle function of the sub-application, and step S104 may include but is not limited to steps S301 to S302.

[0058] Step S301, activating the sub-application in the main application according to the routing and activation mechanism;

[0059] Step S302: Initialize, load, mount and uninstall the sub-application in the main application according to the life cycle function.

[0060] The sub-application can be activated in the main application based on the routing and activation mechanism of the sub-application. For example, when the URL routing of the browser accessed by the user matches the routing of the sub-application, the sub-application can be activated.

[0061] After activating the sub-application in the main application, the sub-application can be initialized, loaded, mounted, and unloaded in the main application according to the lifecycle function, so as to realize on-demand management of the sub-application by the main application, so as to dynamically switch and display the sub-application in the main application.

[0062] See also Figure 4In some embodiments, the registration information includes a rendering mechanism of the sub-application, the life cycle function includes an initialization life cycle function, a loading life cycle function, a mounting life cycle function, and an uninstallation life cycle function, and step S302 may include but is not limited to steps S401 to S404.

[0063] Step S401, calling the initialization lifecycle function to initialize the sub-application in the main application;

[0064] Step S402, calling the loading lifecycle function to load the sub-application in the main application;

[0065] Step S403, calling the mount lifecycle function to render the sub-application into a designated rendering container of the main application for mounting according to the rendering mechanism;

[0066] Step S404, calling the uninstall lifecycle function to uninstall the sub-application from the main application.

[0067] Among them, the initialization lifecycle function is called when the sub-application is initialized, and is used to execute the startup logic of the sub-application, such as for preloading the resources of the sub-application.

[0068] Loading lifecycle function: called when the sub-application is loaded, used to execute the sub-application's loading logic and prepare for subsequent mounting.

[0069] Mount lifecycle function: called when the sub-application is mounted, used to render the sub-application's UI into the specified rendering container in the main application, making the sub-application visible and interactive.

[0070] Uninstall lifecycle function: called when a sub-application is uninstalled, used to clean up the sub-application's resources, such as removing the sub-application's DOM elements from the main application and cleaning up the sub-application's resources.

[0071] Lifecycle functions enable the main application to precisely control the initialization, loading, mounting, and unloading of sub-applications.

[0072] Based on this, by calling the initialization lifecycle function, the sub-application is initialized in the main application; by calling the loading lifecycle function, the sub-application is loaded in the main application; by calling the mounting lifecycle function, the sub-application is rendered into the designated rendering container of the main application according to the rendering mechanism and mounted, so that the sub-application can run with the main application, ensuring that the pages of the sub-application are integrated with the pages of the main application, and users can browse seamlessly; by calling the uninstallation lifecycle function, the sub-application is uninstalled from the main application.

[0073] In this way, under the control of the lifecycle function, the sub-application can be effectively loaded, mounted and unloaded independently, making the loading, mounting and unloading of sub-applications standardized, reducing the complexity of development and operation and maintenance. The sub-application only needs to focus on its own internal business logic and life cycle, and does not need to care about the details of the overall framework and other sub-applications. It will not affect the main application, nor will it be interfered with by other sub-applications.

[0074] In some embodiments, when a sub-application is loaded in a main application, the common business component can be passed to the sub-application through the main application.

[0075] Among them, when implementing a micro front-end based on a micro front-end framework, the common business components of the main application and the sub-application can be encapsulated into a preset component library. The common business components include common styles (such as toolbars, navigation, etc.) and common business logic (such as authentication business logic).

[0076] Please continue reading Figure 2 When a sub-application is loaded in a main application, the main application can obtain the common business components from the preset component library and pass the common business components to the sub-application. In this way, the main application and the sub-application can share the common business components. Moreover, when the sub-application runs independently, the sub-application can also obtain the common business components from the preset component library by itself. In this way, not only can the reusability of the code of the common business components be improved, but also after upgrading the code of the common business components or fixing bugs, there is no need to modify the code of the main application and the sub-application, which can significantly reduce maintenance costs.

[0077] In some embodiments, when the sub-application is rendered into a designated rendering container of the main application for mounting, the Store instance of the main application can be passed to the sub-application to share global public data between the main application and the sub-application.

[0078] The Store instance is a global state management object that is designed to ensure that the state can be shared and synchronized between the main application and the sub-application.

[0079] When mounting a sub-application in the main application, the global public data of the main application (such as user information) needs to be passed to the sub-application so that the sub-application can access and synchronize the global public data. The Store instance of the main application can be passed to the sub-application to share the global public data between the main application and the sub-application, ensuring the state consistency of the main application and the sub-application.

[0080] The application integration method based on the micro-frontend framework provided in the above embodiment obtains the configuration file of the micro-frontend framework; registers the sub-application in the main application according to the configuration file to obtain the registration information; performs routing transformation on the sub-application to obtain the routing of the sub-application; and manages the sub-application in the main application according to the routing and registration information when the main application runs in the micro-frontend environment. In this way, on the one hand, the sub-application is accurately and dynamically registered in the main application through the configuration file of the micro-frontend framework, and on the other hand, the independence and compatibility of the routing between the main application and the sub-application are ensured by performing routing transformation on the sub-application, so that the sub-application can be managed in a standardized manner on demand in the main application based on the routing and registration information of the sub-application, so that the sub-application can maintain its independence without being interfered by the main application or other sub-applications, and the decoupling between the main application and the sub-application is realized, while ensuring that the sub-application can run independently and the seamless integration between the sub-application and the main application is ensured, thereby achieving independent and accurate development of the sub-application and improving development efficiency and collaboration.

[0081] See also Figure 5 , Figure 5 It is a schematic block diagram of an application integration device based on a micro-frontend framework provided in an embodiment of the present application. The application integration device based on the micro-frontend framework can be configured in a computer device to execute the aforementioned application integration method based on the micro-frontend framework.

[0082] like Figure 5 As shown, the application integration device 500 based on the micro-frontend framework includes: a configuration file acquisition module 501, a sub-application registration module 502, a routing transformation module 503 and a sub-application management module 504.

[0083] Configuration file acquisition module 501, used to obtain the configuration file of the micro front-end framework;

[0084] The sub-application registration module 502 is used to register the sub-application in the main application according to the configuration file to obtain registration information;

[0085] A routing transformation module 503 is used to perform routing transformation on the sub-application to obtain the routing of the sub-application;

[0086] The sub-application management module 504 is used to manage the sub-application in the main application according to the routing and the registration information when the main application runs in the micro-frontend environment.

[0087] In one embodiment, the sub-application management module 504 is further used to:

[0088] activating the sub-application in the main application according to the routing and the activation mechanism;

[0089] According to the life cycle function, the sub-application is initialized, loaded, mounted and unloaded in the main application.

[0090] In one embodiment, the sub-application management module 504 is further used to:

[0091] Calling the initialization lifecycle function to initialize the sub-application in the main application;

[0092] Calling the loading lifecycle function to load the sub-application in the main application;

[0093] Calling the mount lifecycle function to render the sub-application into a designated rendering container of the main application for mounting according to the rendering mechanism;

[0094] The uninstall lifecycle function is called to uninstall the sub-application from the main application.

[0095] In one embodiment, the sub-application management module 504 is further used to:

[0096] When the sub-application is loaded in the main application, the common service component is passed to the sub-application through the main application.

[0097] In one embodiment, the sub-application management module 504 is further used to:

[0098] When the sub-application is rendered into a designated rendering container of the main application for mounting, the Store instance of the main application is passed to the sub-application, so as to share global public data between the main application and the sub-application.

[0099] In one embodiment, the sub-application registration module 502 is further used to:

[0100] Obtain the original route of the sub-application;

[0101] The identifier of the sub-application is added as a prefix to the original route to obtain the route.

[0102] In one embodiment, the micro front-end framework includes qiankun.

[0103] Among them, each module in the above-mentioned application integration device 500 based on the micro-front-end framework corresponds to each step in the above-mentioned application integration method embodiment based on the micro-front-end framework, and its functions and implementation processes are no longer repeated here one by one.

[0104] The application integration device 500 based on the micro-front-end framework can execute the application integration method based on the micro-front-end framework provided in the embodiment of the present application. Therefore, the beneficial effects that can be achieved by the application integration method based on the micro-front-end framework provided in the embodiment of the present application can be achieved. Please refer to the previous embodiment for details and will not be repeated here.

[0105] The method and apparatus of the present application can be used in many general or special computer system environments or configurations. For example: personal computers, server computers, handheld or portable devices, tablet devices, multiprocessor systems, microprocessor-based systems, set-top boxes, programmable consumer electronic devices, network PCs, minicomputers, mainframe computers, distributed computing environments including any of the above systems or devices, etc. The present application can be described in the general context of computer-executable instructions executed by a computer, such as program modules. Generally, program modules include routines, programs, objects, components, data structures, etc. that perform specific tasks or implement specific abstract data types. The present application can also be practiced in distributed computing environments, in which tasks are performed by remote processing devices connected through a communication network. In a distributed computing environment, program modules can be located in local and remote computer storage media including storage devices.

[0106] Exemplarily, the above method and apparatus may be implemented in the form of a computer program. The computer program may be implemented in the form of a computer program. Figure 6 Runs on the computer device shown.

[0107] See also Figure 6 , Figure 6 It is a schematic block diagram of the structure of a computer device provided in an embodiment of the present application.

[0108] See also Figure 6 The computer device includes a processor and a memory connected via a system bus, wherein the memory may include a non-volatile storage medium and an internal memory.

[0109] The processor is used to provide computing and control capabilities and support the operation of the entire computer equipment.

[0110] The internal memory provides an environment for the operation of the computer program in the non-volatile storage medium. When the computer program is executed by the processor, the processor can execute any application integration method based on the micro-frontend framework.

[0111] It should be understood that the processor may be a central processing unit (CPU), and the processor may also be other general-purpose processors, digital signal processors (DSP), application-specific integrated circuits (ASIC), field-programmable gate arrays (FPGA) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. Among them, the general-purpose processor may be a microprocessor or the processor may also be any conventional processor, etc.

[0112] In one embodiment, the processor is used to run a computer program stored in the memory to implement the following steps:

[0113] Get the configuration file of the micro frontend framework;

[0114] According to the configuration file, register the sub-application in the main application to obtain registration information;

[0115] Performing routing transformation on the sub-application to obtain the routing of the sub-application;

[0116] When the main application runs in a micro front-end environment, the sub-application is managed in the main application according to the routing and the registration information.

[0117] In one embodiment, the registration information includes an activation mechanism and a life cycle function of the sub-application, and the processor, when implementing the management of the sub-application in the main application according to the routing and the registration information, is used to implement:

[0118] activating the sub-application in the main application according to the routing and the activation mechanism;

[0119] According to the life cycle function, the sub-application is initialized, loaded, mounted and unloaded in the main application.

[0120] In one embodiment, the registration information includes a rendering mechanism of the sub-application, the life cycle function includes an initialization life cycle function, a loading life cycle function, a mounting life cycle function, and an uninstallation life cycle function, and the sub-application is initialized, loaded, mounted, and uninstalled in the main application according to the life cycle function, so as to implement:

[0121] Calling the initialization lifecycle function to initialize the sub-application in the main application;

[0122] Calling the loading lifecycle function to load the sub-application in the main application;

[0123] Calling the mount lifecycle function to render the sub-application into a designated rendering container of the main application for mounting according to the rendering mechanism;

[0124] The uninstall lifecycle function is called to uninstall the sub-application from the main application.

[0125] In one embodiment, the processor runs a computer program stored in the memory and further implements the following steps:

[0126] When the sub-application is loaded in the main application, the common service component is passed to the sub-application through the main application.

[0127] In one embodiment, the processor runs a computer program stored in the memory and further implements the following steps:

[0128] When the sub-application is rendered into a designated rendering container of the main application for mounting, the Store instance of the main application is passed to the sub-application, so as to share global public data between the main application and the sub-application.

[0129] In one embodiment, when implementing the routing transformation of the sub-application to obtain the routing of the sub-application, the processor is used to implement:

[0130] Obtain the original route of the sub-application;

[0131] The identifier of the sub-application is added as a prefix to the original route to obtain the route.

[0132] In one embodiment, the micro front-end framework includes qiankun.

[0133] The computer device can execute the application integration method based on the micro-front-end framework provided in the embodiment of the present application. Therefore, it can achieve the beneficial effects that can be achieved by the application integration method based on the micro-front-end framework provided in the embodiment of the present application. Please see the previous embodiment for details and will not be repeated here.

[0134] An embodiment of the present application also provides a computer-readable storage medium.

[0135] A computer program is stored on the computer-readable storage medium of the present application, and when the computer program is executed by the processor, the steps of the application integration method based on the micro-frontend framework as described above are implemented.

[0136] The computer-readable storage medium may be an internal storage unit of the application integration device or computer device based on the micro-frontend framework described in the aforementioned embodiment, such as a hard disk or memory of the application integration device or computer device based on the micro-frontend framework. The computer-readable storage medium may also be an external storage device of the application integration device or computer device based on the micro-frontend framework, such as a plug-in hard disk, a smart memory card (Smart Media Card, SMC), a secure digital card (SecureDigital Card, SD Card), a flash card (Flash Card), etc., equipped on the application integration device or computer device based on the micro-frontend framework.

[0137] Since the computer program stored in the computer-readable storage medium can execute any one of the application integration methods based on the micro-front-end framework provided in the embodiments of the present application, the beneficial effects that can be achieved by any one of the application integration methods based on the micro-front-end framework provided in the embodiments of the present application can be achieved. Please refer to the previous embodiments for details and will not be repeated here.

[0138] Furthermore, the computer-readable storage medium may mainly include a program storage area and a data storage area, wherein the program storage area may store an operating system, an application required for at least one function, etc.; the data storage area may store data created according to the use of the blockchain node, etc.

[0139] The blockchain referred to in this application is a new application model of computer technologies such as distributed data storage, peer-to-peer transmission, consensus mechanism, encryption algorithm, etc. Blockchain is essentially a decentralized database, a string of data blocks generated by cryptographic methods. Each data block contains a batch of network transaction information, which is used to verify the validity of its information (anti-counterfeiting) and generate the next block. Blockchain can include the underlying blockchain platform, platform product service layer, and application service layer.

[0140] It should be noted that, in this article, the terms "include", "comprises" or any other variations thereof are intended to cover non-exclusive inclusion, so that a process, method, article or system including a series of elements includes not only those elements, but also other elements not explicitly listed, or also includes elements inherent to such process, method, article or system. In the absence of further restrictions, an element defined by the sentence "comprises a ..." does not exclude the existence of other identical elements in the process, method, article or system including the element.

[0141] The above description is only a specific implementation mode of the present application, but the protection scope of the present application is not limited thereto. Any technician familiar with the technical field can easily think of various equivalent modifications or substitutions within the technical scope disclosed in the present application, and these modifications or substitutions should be included in the protection scope of the present application.

Claims

1. An application integration method based on a micro front-end framework, characterized in that: The method comprises: Get the configuration file of the micro frontend framework; According to the configuration file, register the sub-application in the main application to obtain registration information; Performing routing transformation on the sub-application to obtain the routing of the sub-application; When the main application runs in a micro front-end environment, the sub-application is managed in the main application according to the routing and the registration information.

2. The method according to claim 1, characterized in that The registration information includes the activation mechanism and life cycle function of the sub-application, and the managing the sub-application in the main application according to the routing and the registration information includes: activating the sub-application in the main application according to the routing and the activation mechanism; According to the life cycle function, the sub-application is initialized, loaded, mounted and unloaded in the main application.

3. The method according to claim 2, characterized in that The registration information includes a rendering mechanism of the sub-application, the life cycle function includes an initialization life cycle function, a loading life cycle function, a mounting life cycle function, and an uninstallation life cycle function, and performing initialization, loading, mounting, and uninstallation of the sub-application in the main application according to the life cycle function includes: Calling the initialization lifecycle function to initialize the sub-application in the main application; Calling the loading lifecycle function to load the sub-application in the main application; Calling the mount lifecycle function to render the sub-application into a designated rendering container of the main application for mounting according to the rendering mechanism; The uninstall lifecycle function is called to uninstall the sub-application from the main application.

4. The method according to claim 3, characterized in that The method further comprises: When the sub-application is loaded in the main application, the common service component is passed to the sub-application through the main application.

5. The method according to claim 3, characterized in that: The method further comprises: When the sub-application is rendered into a designated rendering container of the main application for mounting, the Store instance of the main application is passed to the sub-application, so as to share global public data between the main application and the sub-application.

6. The method according to claim 1, characterized in that The performing routing transformation on the sub-application to obtain the routing of the sub-application includes: Obtain the original route of the sub-application; The identifier of the sub-application is added as a prefix to the original route to obtain the route.

7. The method according to any one of claims 1 to 6, characterized in that: The micro front-end framework includes qiankun.

8. An application integration device based on a micro front-end framework, characterized in that: The device comprises: Configuration file acquisition module, used to obtain the configuration file of the micro front-end framework; A sub-application registration module, used to register the sub-application in the main application according to the configuration file to obtain registration information; A routing transformation module, used to perform routing transformation on the sub-application to obtain the routing of the sub-application; The sub-application management module is used to manage the sub-application in the main application according to the routing and the registration information when the main application runs in the micro-frontend environment.

9. A computer device, characterized in that: The computer device includes a memory and a processor, the memory stores a computer program, and the processor implements the application integration method based on the micro-frontend framework as described in any one of claims 1 to 7 when executing the computer program.

10. A computer-readable storage medium storing a computer program, characterized in that: When the computer program is executed by a processor, the application integration method based on a micro-frontend framework described in any one of claims 1 to 7 is implemented.

Images