Micro-front-end application data interaction method and device, storage medium and computer equipment
Access to multiple front-end applications through the micro front-end integrated service platform, and using preset technology stack template library and back-end service terminals, automatically identify and forward interactive data acquisition requests, solving the challenges of the existing micro front-end technology stack in terms of integration complexity, reducing the difficulty of development and maintenance, and improving the stability and security of the system.
Patent Information
- Application Number
- CN202411649811.4
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-11-18
- Publication Date
- 2025-03-11
AI Technical Summary
Existing micro front-end technology stacks have challenges in integration complexity, especially when integrating multiple complex front-end modules into a unified system, requiring a lot of configuration and definition work, increasing development and maintenance difficulties, and possibly affecting system stability and security.
Provide a micro front-end application data interaction method, access multiple front-end applications through the micro front-end integrated service platform, and use the preset technology stack template library and the back-end service terminal to automatically identify and forward interactive data acquisition requests, reducing manual configuration requirements.
By integrating multiple technology stacks, the difficulty of developing and maintaining financial-related applications is reduced, the stability and security of the system are improved, and the manual configuration needs are reduced.
Smart Images

Figure CN119597286A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the fields of financial technology and computer technology, and in particular to a micro-front-end application data interaction method and device, storage medium, and computer equipment. Background Art
[0002] With the vigorous development of front-end technology and the growing demand for digital and intelligent services in the financial sector, micro-front-end architecture has gradually emerged in the development and maintenance of large-scale web applications in the financial sector, becoming a key means to solve the problems of complexity and scale. Micro-front-end architecture cleverly splits large financial web applications into multiple independent and functionally clear small applications (i.e. micro-front-ends), allowing different development teams to develop in parallel based on their respective expertise and familiar technology stacks, which not only significantly improves development efficiency, but also greatly enhances the maintainability and scalability of applications.
[0003] In the financial field, these micro front-ends may cover multiple key links from user authentication, account management, transaction processing to risk monitoring, report generation, etc. Each micro front-end can choose the most suitable technology stack for development, such as React, Vue or Angular, according to business needs and technical characteristics, so as to build an efficient, flexible and easy-to-manage financial application system.
[0004] In the existing micro-frontend technology stack, Single-SPA, as a powerful JS framework, has been widely used in the financial field. It can not only seamlessly combine multiple front-end applications to form a highly unified and user-friendly interface, but also ensure the independent development, deployment and update of each micro-frontend by providing a complete set of routing management and lifecycle management mechanisms. This mechanism enables financial institutions to flexibly iterate and optimize applications according to different business scenarios and user needs without the need for tedious reconstruction of the entire system.
[0005] However, although micro-frontend frameworks such as Single-SPA have brought many conveniences to the financial field, integration complexity is still a major challenge currently faced. Since financial applications often involve multiple complex front-end modules, and these modules may use different technology stacks and frameworks, a lot of configuration and definition work is often required when integrating them into a unified system. This not only increases the difficulty of development and maintenance, but also may pose a potential threat to the stability and security of the system. Summary of the invention
[0006] In view of this, the present application provides a micro-front-end application data interaction method and device, storage medium, and computer equipment, which are applied to a micro-front-end integrated service platform that is connected to multiple front-end applications; the method includes: when a user performs an interactive operation based on any front-end application, the front-end application responds to the user's interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform, and the micro-front-end integrated service platform supports multiple technology stacks; the micro-front-end integrated service platform forwards the interactive data acquisition request to the background service terminal; the background service terminal obtains the required interactive data in a preset data storage remote warehouse based on the interactive data acquisition request, and returns the required interactive data to the front-end application through the micro-front-end integrated service platform, so that the user obtains the required interactive data corresponding to the interactive operation based on the front-end application. By integrating multiple technology stacks, the manual configuration requirements can be reduced and the difficulty of financial-related application development and maintenance can be reduced.
[0007] According to one aspect of the present application, a micro-frontend application data interaction method is provided, which is applied to a micro-frontend integrated service platform, wherein the micro-frontend integrated service platform is connected to multiple frontend applications; the method comprises:
[0008] When a user performs an interactive operation based on any front-end application, the front-end application sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform in response to the interactive operation, wherein the micro-front-end integrated service platform corresponds to a preset technology stack template library, and the preset technology stack template library contains multiple technology stack templates;
[0009] The micro-frontend integrated service platform determines the target technology stack template supported by the front-end application in the preset technology stack template library based on the interactive data acquisition request, and forwards the interactive data acquisition request to the backend service terminal based on the target technology stack template;
[0010] Based on the interaction data acquisition request, the background service terminal obtains the demand interaction data in the preset data storage remote warehouse, and returns the demand interaction data to the front-end application through the micro-front-end integrated service platform, so that the user can obtain the demand interaction data corresponding to the interaction operation based on the front-end application.
[0011] Optionally, the micro-frontend integration service platform determines, in a preset technology stack template library, a target technology stack template supported by the front-end application based on the interactive data acquisition request, including:
[0012] When the user performs the first interactive operation on the front-end application, the micro-front-end integration service platform loads the target technology stack template supported by the front-end application corresponding to the interactive data acquisition request from the preset technology stack template library based on the interactive data acquisition request;
[0013] When the user performs a non-first interactive operation on the front-end application, the micro-front-end integration service platform identifies the target technology stack template supported by the front-end application from the loaded technology stack templates.
[0014] Optionally, the backend service terminal obtains the required interaction data in a preset data storage remote warehouse based on the interaction data acquisition request, including:
[0015] The backend service terminal determines the required interactive data storage area in the preset data storage remote warehouse based on the interactive data acquisition request;
[0016] The background service terminal obtains the demand interaction data of the interaction data acquisition request in the demand interaction data storage area.
[0017] Optionally, the micro-frontend integrated service platform corresponds to a shared data storage center, and the shared data storage center stores shared interaction data of each front-end application; the method further includes:
[0018] When a user triggers a cross-application interaction data acquisition request based on an interactive operation of any front-end application, the front-end application sends the cross-application interaction data acquisition request to the micro-front-end integration service platform;
[0019] The micro-frontend integration service platform determines the associated interactive frontend application based on the cross-application interactive data acquisition request, and acquires the interactive associated data of the associated interactive frontend application in the shared data storage center;
[0020] The micro-frontend integrated service platform sends the interaction-related data to the front-end application so that the user can obtain the interaction-related data based on the front-end application, wherein the interaction-related data is the interaction data generated by the user performing interactive operations on the associated interactive front-end application, and the interaction data stored in the shared data storage center is the sharable interaction data of each front-end application.
[0021] Optionally, when the user performs an interactive operation based on any front-end application, before the front-end application responds to the interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integration service platform, the method further includes:
[0022] The micro-frontend integrated service platform sends a program remote installation instruction to the target service front-end application, so that the target service application front-end downloads and installs the micro-frontend integrated service platform access program based on the program remote installation instruction, wherein the micro-frontend integrated service platform access program provides the micro-frontend integrated service platform service to the target service front-end application after running.
[0023] Optionally, each front-end application runs based on an independent sandbox environment in the micro-front-end integration service platform.
[0024] Optionally, the micro-frontend integration service platform is built based on the node.js framework.
[0025] According to another aspect of the present application, a micro-frontend application data interaction device is provided, which is applied to a micro-frontend integrated service platform, wherein the micro-frontend integrated service platform is connected to multiple frontend applications; the device comprises:
[0026] An application interaction module, which is used for when a user performs an interactive operation based on any front-end application, the front-end application responds to the interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform, wherein the micro-front-end integrated service platform corresponds to a preset technology stack template library, and the preset technology stack template library contains multiple technology stack templates;
[0027] A request forwarding module is used for the micro-frontend integrated service platform to determine the target technology stack template supported by the front-end application based on the interactive data acquisition request in the preset technology stack template library, and forward the interactive data acquisition request to the backend service terminal based on the target technology stack template;
[0028] The data transmission module is used for the background service terminal to obtain the demand interaction data in the preset data storage remote warehouse based on the interaction data acquisition request, and return the demand interaction data to the front-end application through the micro-front-end integrated service platform, so that the user can obtain the demand interaction data corresponding to the interaction operation based on the front-end application.
[0029] Optionally, the request forwarding module is further used to:
[0030] When the user performs the first interactive operation on the front-end application, the micro-front-end integration service platform loads the target technology stack template supported by the front-end application corresponding to the interactive data acquisition request from the preset technology stack template library based on the interactive data acquisition request;
[0031] When the user performs a non-first interactive operation on the front-end application, the micro-front-end integration service platform identifies the target technology stack template supported by the front-end application from the loaded technology stack templates.
[0032] Optionally, the data transmission module is further used to:
[0033] The backend service terminal determines the required interactive data storage area in the preset data storage remote warehouse based on the interactive data acquisition request;
[0034] The background service terminal obtains the demand interaction data of the interaction data acquisition request in the demand interaction data storage area.
[0035] Optionally, the micro-frontend integrated service platform corresponds to a shared data storage center, and the shared data storage center stores shared interaction data of each front-end application; the device also includes a data sharing module for:
[0036] When a user triggers a cross-application interaction data acquisition request based on an interactive operation of any front-end application, the front-end application sends the cross-application interaction data acquisition request to the micro-front-end integration service platform;
[0037] The micro-frontend integration service platform determines the associated interactive frontend application based on the cross-application interactive data acquisition request, and acquires the interactive associated data of the associated interactive frontend application in the shared data storage center;
[0038] The micro-frontend integrated service platform sends the interaction-related data to the front-end application so that the user can obtain the interaction-related data based on the front-end application, wherein the interaction-related data is the interaction data generated by the user performing interactive operations on the associated interactive front-end application, and the interaction data stored in the shared data storage center is the sharable interaction data of each front-end application.
[0039] Optionally, the device further includes a platform access module, configured to:
[0040] The micro-frontend integrated service platform sends a program remote installation instruction to the target service front-end application, so that the target service application front-end downloads and installs the micro-frontend integrated service platform access program based on the program remote installation instruction, wherein the micro-frontend integrated service platform access program provides the micro-frontend integrated service platform service to the target service front-end application after running.
[0041] Optionally, each front-end application runs based on an independent sandbox environment in the micro-front-end integration service platform.
[0042] Optionally, the micro-frontend integration service platform is built based on the node.js framework.
[0043] According to another aspect of the present application, a storage medium is provided, on which a computer program is stored, and when the program is executed by a processor, the above-mentioned micro-front-end application data interaction method is implemented.
[0044] According to another aspect of the present application, a computer device is provided, including a storage medium, a processor, and a computer program stored on the storage medium and executable on the processor, wherein the processor implements the above-mentioned micro-frontend application data interaction method when executing the program.
[0045] By means of the above technical scheme, a micro-front-end application data interaction method and device, storage medium, and computer equipment provided by the present application are applied to a micro-front-end integrated service platform, and the micro-front-end integrated service platform is connected to multiple front-end applications; when a user performs an interactive operation based on any front-end application, the front-end application responds to the user's interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform, and the micro-front-end integrated service platform supports multiple technology stacks; the micro-front-end integrated service platform forwards the interactive data acquisition request to the background service terminal; the background service terminal obtains the required interactive data in a preset data storage remote warehouse based on the interactive data acquisition request, and returns the required interactive data to the front-end application through the micro-front-end integrated service platform, so that the user can obtain the required interactive data corresponding to the interactive operation based on the front-end application. By integrating multiple technology stacks, the manual configuration requirements can be reduced, and the difficulty of financial-related application development and maintenance can be reduced.
[0046] The above description is only an overview of the technical solution of the present application. In order to more clearly understand the technical means of the present application, it can be implemented in accordance with the contents of the specification. In order to make the above and other purposes, features and advantages of the present application more obvious and easy to understand, the specific implementation methods of the present application are listed below. BRIEF DESCRIPTION OF THE DRAWINGS
[0047] The drawings described herein are used to provide a further understanding of the present application and constitute a part of the present application. The illustrative embodiments of the present application and their descriptions are used to explain the present application and do not constitute an improper limitation on the present application. In the drawings:
[0048] Figure 1 A schematic diagram of a process flow of a micro-frontend application data interaction method provided in an embodiment of the present application is shown;
[0049] Figure 2 A schematic diagram of building a micro-frontend integrated service platform provided by an embodiment of the present application is shown;
[0050] Figure 3 A schematic diagram of a process flow of another micro-frontend application data interaction method provided in an embodiment of the present application is shown;
[0051] Figure 4 A schematic diagram of a process flow of another micro-frontend application data interaction method provided in an embodiment of the present application is shown;
[0052] Figure 5 A schematic diagram of the structure of a micro-front-end application data interaction device provided in an embodiment of the present application is shown;
[0053] Figure 6 A structural schematic diagram of a micro-front-end application data interaction device provided in an embodiment of the present application is shown. DETAILED DESCRIPTION
[0054] The present application will be described in detail below with reference to the accompanying drawings and in combination with embodiments. It should be noted that the embodiments and features in the embodiments of the present application can be combined with each other without conflict.
[0055] In this embodiment, a micro-frontend application data interaction method is provided, which is applied to a micro-frontend integrated service platform. The micro-frontend integrated service platform is connected to multiple frontend applications; Figure 1 As shown, the method includes:
[0056] Step 101, when a user performs an interactive operation based on any front-end application, the front-end application responds to the interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integration service platform, wherein the micro-front-end integration service platform corresponds to a preset technology stack template library, and the preset technology stack template library contains multiple technology stack templates.
[0057] In the above embodiments of the present application, it can be applied to a micro-frontend integrated service platform, such as Figure 2 As shown, the micro-frontend integrated service platform is located between the front-end application and the back-end service terminal, and the micro-frontend integrated service platform can access multiple front-end applications. The micro-frontend integrated service platform is established based on Node.js, which is a JavaScript operating environment based on the ChromeV8 engine. When a user performs an interactive operation based on any front-end application, that is, when a user opens any website through an intelligent operation terminal (such as a computer, etc.) to start browsing the web page, he clicks on a certain functional module in the web page, which is the front-end application. At this time, the front-end application responds to the user's interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-frontend integrated service platform. In particular, the micro-frontend integrated service platform corresponds to a preset technology stack template library, which contains a variety of technology stack templates.
[0058] Specifically, front-end applications include smart financial management applications, stock trading applications, risk management applications, financial data analysis applications, etc. The interactive operations performed by users on the front-end applications are as follows:
[0059] 1. For smart financial management applications, when users select the financial products they want to view or make investment configurations on the front-end smart financial management interface, the front-end application will send corresponding data acquisition requests to the micro-front-end integrated service platform based on the user's interactive operations. At this time, the micro-front-end integrated service platform determines the technology stack template suitable for the front-end application based on the preset technology stack template library, and forwards the request to the back-end financial data service terminal. The back-end service terminal (financial data service terminal) retrieves the financial product information, market dynamics data, etc. required by the user from the remote warehouse, and returns it to the front-end application through the micro-front-end integrated service platform to help users make more informed financial decisions.
[0060] 2. For stock trading applications, users perform stock inquiries and transactions on the front-end interface of stock trading. These operations will trigger the front-end application to send a request for data acquisition or transaction instructions to the micro-front-end integrated service platform. The back-end stock trading system will eventually process the request, obtain real-time stock quotes, user account information, transaction results and other data, and return it to the front-end application through the micro-front-end integrated service platform for users to view and operate.
[0061] 3. For risk management applications, on the front-end interface of financial risk management, users set risk monitoring conditions or view risk reports. The front-end application sends a request to the micro-front-end integrated service platform based on the user's interactive operation. The micro-front-end integrated service platform forwards the request to the risk management service terminal. The risk management service terminal retrieves risk data, model analysis results, etc. from the remote warehouse, and returns them to the front-end application through the micro-front-end integrated service platform to help users manage risks and make decisions.
[0062] 4. For financial data analysis applications, on the front-end interface of financial data analysis, users select data sources, set analysis parameters or view analysis results. The micro-front-end integration service platform forwards the request to the data analysis service terminal, which retrieves data from the remote warehouse, executes the analysis algorithm, and returns the analysis results to the front-end application through the platform for users to conduct further analysis and decision-making.
[0063] Step 102: The micro-frontend integrated service platform determines the target technology stack template supported by the front-end application in the preset technology stack template library based on the interactive data acquisition request, and forwards the interactive data acquisition request to the background service terminal based on the target technology stack template.
[0064] Step 103: The background service terminal obtains the demand interaction data in the preset data storage remote warehouse based on the interaction data acquisition request, and returns the demand interaction data to the front-end application through the micro-front-end integrated service platform, so that the user can obtain the demand interaction data corresponding to the interaction operation based on the front-end application.
[0065] Next, the micro-frontend integrated service platform forwards the interactive data acquisition request to the backend service terminal. Specifically, the micro-frontend integrated service platform determines the target technology stack template supported by the front-end application based on the interactive data acquisition request in the preset technology stack template library, and forwards the interactive data acquisition request to the backend service terminal based on the target technology stack template. The backend service terminal obtains the required interactive data in the preset data storage remote warehouse based on the interactive data acquisition request, and returns the required interactive data to the front-end application through the micro-frontend integrated service platform, so that the user can obtain the required interactive data corresponding to the interactive operation based on the front-end application. To this end, by connecting multiple front-end applications to the micro-frontend integrated service platform, the micro-frontend integrated service platform supports a variety of technology stacks, such as React, Vue, Angular, etc., and can ensure that the integration of different front-end applications is not restricted by the technology stack. By adding a "micro-frontend integrated service platform" between the front-end application and the back-end service terminal, the micro-frontend integrated service platform can help users use Single-SPA front-end applications. When switching front-end applications developed by different technology stacks, they can make a better transition, ensure that the performance of each front-end application is not affected, and maintain a good user experience.
[0066] By applying the technical solution of this embodiment, when a user performs an interactive operation based on any front-end application, the front-end application responds to the user's interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform. The micro-front-end integrated service platform supports multiple technology stacks; the micro-front-end integrated service platform forwards the interactive data acquisition request to the back-end service terminal; the back-end service terminal obtains the required interactive data in the preset data storage remote warehouse based on the interactive data acquisition request, and returns the required interactive data to the front-end application through the micro-front-end integrated service platform, so that the user obtains the required interactive data corresponding to the interactive operation based on the front-end application. By integrating multiple technology stacks in a unified manner, the manual configuration requirements can be reduced, and the difficulty of developing and maintaining financial-related applications can be reduced.
[0067] Further, as a refinement and extension of the specific implementation of the above embodiment, in order to fully illustrate the specific implementation process of this embodiment, another micro-frontend application data interaction method is provided, which is applied to a micro-frontend integrated service platform, and the micro-frontend integrated service platform is connected to multiple front-end applications; Figure 3 As shown, the method includes:
[0068] Step 201, when a user performs an interactive operation based on any front-end application, the front-end application responds to the interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integration service platform, wherein the micro-front-end integration service platform corresponds to a preset technology stack template library, and the preset technology stack template library contains multiple technology stack templates.
[0069] In the above embodiment of the present application, when a user performs an interactive operation based on any front-end application, the front-end application responds to the user's interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform. The micro-front-end integrated service platform supports multiple technology stacks, that is, the micro-front-end integrated service platform corresponds to a preset technology stack template library, and the preset technology stack template library contains multiple technology stack templates. In particular, the micro-front-end integrated service platform is established based on Node.js.
[0070] Step 202, when the user performs the first interactive operation on the front-end application, the micro-front-end integration service platform loads the target technology stack template supported by the front-end application corresponding to the interactive data acquisition request in the preset technology stack template library based on the interactive data acquisition request.
[0071] Step 203: When the user performs a non-first interactive operation on the front-end application, the micro-front-end integration service platform identifies a target technology stack template supported by the front-end application from the loaded technology stack templates.
[0072] Next, when the user performs the first operation on the front-end application, that is, the first interactive operation, the micro-front-end integrated service platform loads the target technology stack template supported by the front-end application corresponding to the interactive data acquisition request in the preset technology stack template library based on the interactive data acquisition request, and forwards the interactive data acquisition request to the back-end service terminal based on the loaded target technology stack template. When the interactive operation is a non-first interactive operation of the user on the front-end application, the micro-front-end integrated service platform identifies the target technology stack template supported by the front-end application in the loaded technology stack template, and forwards the interactive data acquisition request to the back-end service terminal based on the target technology stack template. To this end, the micro-front-end integrated service platform detects the changes of each front-end application in real time, and when the front-end application initiates an interactive data acquisition request, it can automatically adjust and load the corresponding module (target technology stack template), which can reduce the need for manual configuration. That is, if the front-end application operated by the user uses technology stack A, the micro-front-end integrated service platform can randomly load technology stack A for caching. When the user uses the front-end application of technology stack A again, there is no need to reload technology stack A, that is, the unused technology stack will not be loaded in advance, thereby reducing redundant code and resource waste. Since the micro-front-end architecture often needs to load multiple independent front-end applications, the number of network requests and resource loading time are increased, which may cause the initial page loading time to be too long. By loading the technology stack "on demand", the initial loading time and resource consumption are reduced, and the user experience is improved, especially in large-scale application scenarios.
[0073] Step 204: The micro-frontend integrated service platform forwards the interactive data acquisition request to the backend service terminal based on the target technology stack template.
[0074] Step 205: the background service terminal determines a required interactive data storage area in a preset data storage remote warehouse based on the interactive data acquisition request.
[0075] Step 206: the background service terminal obtains the demand interaction data of the interaction data acquisition request in the demand interaction data storage area.
[0076] Step 207: The backend service terminal returns the demand interaction data to the front-end application through the micro-front-end integrated service platform, so that the user obtains the demand interaction data corresponding to the interactive operation based on the front-end application.
[0077] Next, the micro-frontend integrated service platform forwards the interactive data acquisition request to the backend service terminal based on the target technology stack template. The backend service terminal determines the demand interactive data storage area in the preset data storage remote warehouse based on the interactive data acquisition request. The backend service terminal obtains the demand interactive data of the interactive data acquisition request in the demand interactive data storage area. Finally, the backend service terminal returns the demand interactive data to the frontend application through the micro-frontend integrated service platform, so that the user can obtain the demand interactive data corresponding to the interactive operation based on the frontend application.
[0078] By applying the technical solution of this embodiment, when a user performs an interactive operation based on any front-end application, the front-end application responds to the user's interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform. When the interactive operation is the first interactive operation of the user on the front-end application, the micro-front-end integrated service platform loads the target technology stack template supported by the front-end application corresponding to the interactive data acquisition request in the preset technology stack template library based on the interactive data acquisition request. When the interactive operation is not the first interactive operation of the user on the front-end application, the micro-front-end integrated service platform identifies the target technology stack template supported by the front-end application in the loaded technology stack template. The micro-front-end integrated service platform forwards the interactive data acquisition request to the back-end service terminal based on the target technology stack template. The back-end service terminal obtains the required interaction number in the preset data storage remote warehouse based on the interactive data acquisition request, and returns it to the front-end application through the micro-front-end integrated service platform, so that the user obtains the required interaction data corresponding to the interactive operation based on the front-end application. Through the seamless integration mechanism and the technology stack compatibility layer, the integration difficulty of the micro-front-end architecture is significantly reduced, so that different front-end teams can combine financial-related applications faster and more efficiently.
[0079] Further, as a refinement and extension of the specific implementation of the above embodiment, in order to fully illustrate the specific implementation process of this embodiment, another micro-frontend application data interaction method is provided, which is applied to a micro-frontend integrated service platform, and the micro-frontend integrated service platform is connected to multiple front-end applications; Figure 4 As shown, the method includes:
[0080] Step 301, the micro-frontend integrated service platform sends a program remote installation instruction to the target service front-end application, so that the target service application front-end downloads and installs the micro-frontend integrated service platform access program based on the program remote installation instruction, wherein the micro-frontend integrated service platform access program provides the micro-frontend integrated service platform service to the target service front-end application after running.
[0081] In the above embodiment of the present application, for the target service application front-end that needs to accept the service of the micro-front-end integrated service platform, the micro-front-end integrated service platform can send a program remote installation instruction to the target service front-end application, and the target service application front-end can remotely download and install the micro-front-end integrated service platform access program based on the program remote installation instruction. In particular, the micro-front-end integrated service platform access program is downloaded and stored in the storage directory of the target service front-end application. When the micro-front-end integrated service platform access program is installed, the target service front-end application can accept the service of the micro-front-end integrated service platform. The overall download and installation process does not require user operation, so that the application performance can be "improved" without the user's perception.
[0082] Step 302: When a user performs an interactive operation based on any front-end application, the front-end application responds to the interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform, wherein the micro-front-end integrated service platform corresponds to a preset technology stack template library, and the preset technology stack template library contains multiple technology stack templates. The micro-front-end integrated service platform corresponds to a shared data storage center, and the shared data storage center stores the shared interactive data of each front-end application. Each front-end application runs in an independent sandbox environment in the micro-front-end integrated service platform, and the micro-front-end integrated service platform is built based on the node.js framework.
[0083] Step 303: The micro-frontend integrated service platform determines the target technology stack template supported by the front-end application in the preset technology stack template library based on the interactive data acquisition request, and forwards the interactive data acquisition request to the background service terminal based on the target technology stack template.
[0084] In step 304, the background service terminal obtains the demand interaction data in the preset data storage remote warehouse based on the interaction data acquisition request, and returns the demand interaction data to the front-end application through the micro-front-end integration service platform, so that the user can obtain the demand interaction data corresponding to the interaction operation based on the front-end application.
[0085] Then, when the user performs an interactive operation based on any front-end application, the front-end application responds to the user's interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform. The micro-front-end integrated service platform determines the target technology stack supported by the front-end application based on the interactive data acquisition request, and forwards the interactive data acquisition request to the back-end service terminal based on the target technology stack. The back-end service terminal obtains the required interactive data in the preset data storage remote warehouse based on the interactive data acquisition request, and returns the required interactive data to the front-end application through the micro-front-end integrated service platform, so that the user can obtain the required interactive data corresponding to the interactive operation based on the front-end application. In particular, each front-end application runs based on an independent sandbox environment in the micro-front-end integrated service platform, that is, each front-end application runs in an independent sandbox environment in the Node.js middle layer (micro-front-end integrated service platform), which can limit direct interactions across applications and ensure secure isolation between each front-end application. At the same time, the access rights of each front-end application can also be managed in the Node.js middle layer based on the role-based access control mechanism to ensure that different front-end applications can only access the data and resources they need, thereby improving the security of application use.
[0086] Step 305: When a user triggers a cross-application interaction data acquisition request based on an interactive operation of any front-end application, the front-end application sends the cross-application interaction data acquisition request to the micro-front-end integration service platform.
[0087] Step 306: The micro-frontend integration service platform determines the associated interactive frontend application based on the cross-application interactive data acquisition request, and acquires the interactive associated data of the associated interactive frontend application in the shared data storage center.
[0088] Step 307, the micro-frontend integration service platform sends the interaction-related data to the front-end application so that the user can obtain the interaction-related data based on the front-end application, wherein the interaction-related data is the interaction data generated by the user performing interaction operations on the associated interaction front-end application, and the interaction data stored in the shared data storage center is the sharable interaction data of each front-end application.
[0089] Next, when the user triggers a cross-application interaction data acquisition request based on an interactive operation of any front-end application, the front-end application sends the cross-application interaction data acquisition request to the micro-front-end integration service platform. The micro-front-end integration service platform determines the associated interactive front-end application based on the cross-application interaction data acquisition request, obtains the interaction-related data of the associated interactive front-end application in the shared data storage center of the micro-front-end integration service platform, and sends the interaction-related data to the front-end application, so that the user can obtain the interaction-related data based on the front-end application. Specifically, a global event bus can be introduced in Node.js to support message transmission between front-end applications, ensuring that different applications can communicate in real time and not relying on the implementation of a specific framework. At the same time, through a unified state manager, each front-end application is allowed to access the shared state, ensuring data consistency between applications, and supporting state persistence and synchronization across applications. For example, when a user logs in to application front-end 1 for interactive operation, application front-end 1 interactive operation data will be generated. Among the interactive operation data of application front-end 1, the sharable part of the data is uploaded to the shared data storage center of the micro-front-end integrated service platform. At the same time, the user will also log in to application front-end 2 for interactive operation, generating application front-end 2 interactive operation data. Similarly, among the interactive operation data of application front-end 2, the sharable part of the data is also uploaded to the shared data storage center of the micro-front-end integrated service platform. When the user logs in to application front-end 1 for interactive operation and needs to obtain application front-end 2 interactive operation data, a cross-application interactive data acquisition request is triggered. At this time, the micro-front-end integrated service platform obtains the interactive association data of the associated interactive front-end application (front-end application 2) in the shared data storage center and transmits it to application front-end 1 to complete the user's cross-application interactive operation. By adding a shared data storage center to store the sharable interactive data of each front-end application, each front-end application runs based on an independent sandbox environment in the micro-front-end integrated service platform, which can "share data" at any time while avoiding "cross communication" of each front-end application, which not only improves the use security, but also improves the user's application experience.
[0090] Specifically, "cross-application interaction", for example, when a user performs an investment operation on a front-end application (such as the investment and financial management page of a mobile banking APP), he may want to view the market dynamics or risk assessment report related to it. At this time, the user triggers a cross-application interaction data acquisition request based on the interaction operation of the front-end application. After receiving the request, the micro-front-end integration service platform can determine the interactive front-end application associated with it (such as a news information page or a risk assessment tool), and obtain the interactive related data in these related applications from the shared data storage center (such as relevant market dynamics, historical investment records, risk assessment results, etc.). In this way, users can obtain all relevant information in one stop in the mobile banking APP, improving user experience and satisfaction. Not only that, cross-application interaction can also be reflected in the integration of cross-platform financial services. With the continuous development of financial technology, financial institutions often need to provide consistent and convenient financial services on multiple platforms. For example, a financial institution may have multiple front-end applications such as web version, mobile APP and WeChat applet at the same time. When a user performs an operation on one platform (such as applying for a loan), it may be necessary to obtain information that has been submitted or reviewed on other platforms (such as identity authentication information, proof of income, etc.). Through the micro-frontend integrated service platform, these cross-platform data can be seamlessly integrated, making it smooth and efficient for users to switch between different front-end applications, thereby improving the overall experience and efficiency of financial services.
[0091] By applying the technical solution of this embodiment, the micro-frontend integrated service platform sends a program remote installation instruction to the target service front-end application, so that the target service application front-end downloads and installs the micro-frontend integrated service platform access program based on the program remote installation instruction. When the user performs an interactive operation based on any front-end application, the front-end application responds to the user's interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-frontend integrated service platform. The micro-frontend integrated service platform determines the target technology stack supported by the front-end application based on the interactive data acquisition request, and forwards the interactive data acquisition request to the background service terminal based on the target technology stack. The background service terminal obtains the required interactive data in the preset data storage remote warehouse based on the interactive data acquisition request, and returns the required interactive data to the front-end application through the micro-frontend integrated service platform, so that the user obtains the required interactive data corresponding to the interactive operation based on the front-end application. When the user triggers a cross-application interactive data acquisition request based on the interactive operation of any front-end application, the front-end application sends the cross-application interactive data acquisition request to the micro-frontend integrated service platform. The micro-frontend integration service platform determines the associated interactive front-end applications based on the cross-application interactive data acquisition request, obtains the interactive related data of the associated interactive front-end applications in the shared data storage center of the micro-frontend integration service platform, and sends the interactive related data to the front-end application, so that users can obtain the interactive related data based on the front-end application, which can ensure that the communication and status management between different front-end applications are more efficient and consistent, and through sandbox technology and access control strategies, the isolation between front-end applications is strengthened, the security risks are reduced, and the overall security of the system is ensured.
[0092] Further, as Figure 1 The specific implementation of the method, the embodiment of the present application provides a micro-front-end application data interaction device, which is applied to a micro-front-end integrated service platform, and the micro-front-end integrated service platform is connected to multiple front-end applications; Figure 5 As shown, the device comprises:
[0093] The application interaction module 401 is used for when a user performs an interactive operation based on any front-end application, the front-end application responds to the interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform, wherein the micro-front-end integrated service platform corresponds to a preset technology stack template library, and the preset technology stack template library contains multiple technology stack templates;
[0094] The request forwarding module 402 is used for the micro-frontend integrated service platform to determine the target technology stack template supported by the front-end application based on the interactive data acquisition request in the preset technology stack template library, and forward the interactive data acquisition request to the backend service terminal based on the target technology stack template;
[0095] The data transmission module 403 is used for the background service terminal to obtain the demand interaction data in the preset data storage remote warehouse based on the interaction data acquisition request, and return the demand interaction data to the front-end application through the micro-front-end integrated service platform, so that the user can obtain the demand interaction data corresponding to the interaction operation based on the front-end application.
[0096] Optionally, the request forwarding module 402 is further configured to:
[0097] When the user performs the first interactive operation on the front-end application, the micro-front-end integration service platform loads the target technology stack template supported by the front-end application corresponding to the interactive data acquisition request from the preset technology stack template library based on the interactive data acquisition request;
[0098] When the user performs a non-first interactive operation on the front-end application, the micro-front-end integration service platform identifies the target technology stack template supported by the front-end application from the loaded technology stack templates.
[0099] Optionally, the data transmission module 403 is further configured to:
[0100] The backend service terminal determines the required interactive data storage area in the preset data storage remote warehouse based on the interactive data acquisition request;
[0101] The background service terminal obtains the demand interaction data of the interaction data acquisition request in the demand interaction data storage area.
[0102] Optionally, each front-end application runs based on an independent sandbox environment in the micro-front-end integration service platform.
[0103] Optionally, the micro-frontend integration service platform is built based on the node.js framework.
[0104] Further, the embodiment of the present application provides another micro-frontend application data interaction device, which is applied to a micro-frontend integrated service platform, wherein the micro-frontend integrated service platform is connected to multiple frontend applications; Figure 6 As shown, the device comprises:
[0105] The application interaction module 501 is used for when a user performs an interactive operation based on any front-end application, the front-end application responds to the interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform, wherein the micro-front-end integrated service platform corresponds to a preset technology stack template library, and the preset technology stack template library contains multiple technology stack templates;
[0106] The request forwarding module 502 is used for the micro-frontend integrated service platform to determine the target technology stack template supported by the front-end application based on the interactive data acquisition request in the preset technology stack template library, and forward the interactive data acquisition request to the backend service terminal based on the target technology stack template;
[0107] The data transmission module 503 is used for the backend service terminal to obtain the demand interaction data in the preset data storage remote warehouse based on the interaction data acquisition request, and return the demand interaction data to the front-end application through the micro-front-end integrated service platform, so that the user can obtain the demand interaction data corresponding to the interaction operation based on the front-end application;
[0108] The data sharing module 504 is used for, when a user triggers a cross-application interaction data acquisition request based on an interactive operation of any front-end application, the front-end application sends the cross-application interaction data acquisition request to the micro-front-end integrated service platform; the micro-front-end integrated service platform determines the associated interactive front-end application based on the cross-application interaction data acquisition request, and obtains the interaction-related data of the associated interactive front-end application in the shared data storage center; the micro-front-end integrated service platform sends the interaction-related data to the front-end application, so that the user obtains the interaction-related data based on the front-end application, wherein the interaction-related data is the interaction data generated by the user performing an interactive operation on the associated interactive front-end application, and the interaction data stored in the shared data storage center is the sharable interaction data of each front-end application, and the micro-front-end integrated service platform corresponds to a shared data storage center, and the shared data storage center stores the shared interaction data of each front-end application;
[0109] The platform access module 505 is used for the micro-front-end integrated service platform to send a program remote installation instruction to the target service front-end application, so that the target service application front-end downloads and installs the micro-front-end integrated service platform access program based on the program remote installation instruction, wherein the micro-front-end integrated service platform access program provides the micro-front-end integrated service platform service to the target service front-end application after running.
[0110] Optionally, the request forwarding module 502 is further configured to:
[0111] When the user performs the first interactive operation on the front-end application, the micro-front-end integration service platform loads the target technology stack template supported by the front-end application corresponding to the interactive data acquisition request from the preset technology stack template library based on the interactive data acquisition request;
[0112] When the user performs a non-first interactive operation on the front-end application, the micro-front-end integration service platform identifies the target technology stack template supported by the front-end application from the loaded technology stack templates.
[0113] Optionally, the data transmission module 503 is further used to:
[0114] The backend service terminal determines the required interactive data storage area in the preset data storage remote warehouse based on the interactive data acquisition request;
[0115] The background service terminal obtains the demand interaction data of the interaction data acquisition request in the demand interaction data storage area.
[0116] Optionally, each front-end application runs based on an independent sandbox environment in the micro-front-end integration service platform.
[0117] Optionally, the micro-frontend integration service platform is built based on the node.js framework.
[0118] It should be noted that for other corresponding descriptions of the functional units involved in the micro-frontend application data interaction device provided in the embodiment of the present application, please refer to Figure 1 , Figure 3 and Figure 4 The corresponding description in the method will not be repeated here.
[0119] Based on the above Figure 1 , Figure 3 and Figure 4 The method shown in the embodiment of the present application is accordingly provided with a storage medium on which a computer program is stored, and when the computer program is executed by a processor, the above-mentioned Figure 1 , Figure 3 and Figure 4 The micro-frontend application data interaction method shown.
[0120] Based on this understanding, the technical solution of the present application can be embodied in the form of a software product, which can be stored in a non-volatile storage medium (which can be a CD-ROM, a USB flash drive, a mobile hard disk, etc.), and includes a number of instructions for enabling a computer device (which can be a personal computer, a server, or a network device, etc.) to execute the methods described in each implementation scenario of the present application.
[0121] Based on the above Figure 1 , Figure 3 and Figure 4 The method shown, and Figure 5 , Figure 6 In order to achieve the above-mentioned purpose, the embodiment of the present application further provides a computer device, which can be a personal computer, a server, a network device, etc. The computer device includes a storage medium and a processor; the storage medium is used to store a computer program; the processor is used to execute the computer program to achieve the above-mentioned Figure 1 , Figure 3 and Figure 4The micro-frontend application data interaction method shown.
[0122] Optionally, the computer device may further include a user interface, a network interface, a camera, a radio frequency (RF) circuit, a sensor, an audio circuit, a WI-FI module, etc. The user interface may include a display, an input unit such as a keyboard, etc., and the optional user interface may also include a USB interface, a card reader interface, etc. The network interface may optionally include a standard wired interface, a wireless interface (such as a Bluetooth interface, a WI-FI interface), etc.
[0123] Those skilled in the art will appreciate that the computer device structure provided in this embodiment does not limit the computer device, and may include more or fewer components, or a combination of certain components, or different component arrangements.
[0124] The storage medium may also include an operating system and a network communication module. The operating system is a program that manages and saves the hardware and software resources of the computer device, and supports the operation of information processing programs and other software and / or programs. The network communication module is used to realize communication between the components inside the storage medium, and communication with other hardware and software in the physical device.
[0125] Through the description of the above implementation methods, technical personnel in this field can clearly understand that the present application can be implemented by means of software plus necessary general hardware platforms, and can also be implemented by hardware. When a user performs interactive operations based on any front-end application, the front-end application responds to the user's interactive operations and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform. The micro-front-end integrated service platform supports multiple technology stacks; the micro-front-end integrated service platform forwards the interactive data acquisition request to the background service terminal; the background service terminal obtains the required interactive data in the preset data storage remote warehouse based on the interactive data acquisition request, and returns the required interactive data to the front-end application through the micro-front-end integrated service platform, so that the user can obtain the required interactive data corresponding to the interactive operation based on the front-end application. By integrating multiple technology stacks, the manual configuration requirements can be reduced, and the difficulty of financial-related application development and maintenance can be reduced.
[0126] Those skilled in the art will appreciate that the accompanying drawings are only schematic diagrams of a preferred implementation scenario, and the modules or processes in the accompanying drawings are not necessarily necessary for implementing the present application. Those skilled in the art will appreciate that the modules in the devices in the implementation scenario can be distributed in the devices of the implementation scenario according to the description of the implementation scenario, or can be changed accordingly and located in one or more devices different from the present implementation scenario. The modules of the above-mentioned implementation scenario can be combined into one module, or can be further split into multiple submodules.
[0127] The above serial numbers of this application are only for description and do not represent the advantages and disadvantages of the implementation scenarios. The above disclosure is only a few specific implementation scenarios of this application, but this application is not limited to them, and any changes that can be thought of by technicians in this field should fall within the scope of protection of this application.
Claims
1. A micro-frontend application data interaction method, characterized in that: Applied to a micro-frontend integrated service platform, the micro-frontend integrated service platform is connected to multiple frontend applications; the method includes: When a user performs an interactive operation based on any front-end application, the front-end application sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform in response to the interactive operation, wherein the micro-front-end integrated service platform corresponds to a preset technology stack template library, and the preset technology stack template library contains multiple technology stack templates; The micro-frontend integrated service platform determines the target technology stack template supported by the front-end application in the preset technology stack template library based on the interactive data acquisition request, and forwards the interactive data acquisition request to the backend service terminal based on the target technology stack template; Based on the interaction data acquisition request, the background service terminal obtains the demand interaction data in the preset data storage remote warehouse, and returns the demand interaction data to the front-end application through the micro-front-end integrated service platform, so that the user can obtain the demand interaction data corresponding to the interaction operation based on the front-end application.
2. The method according to claim 1, characterized in that The micro-frontend integrated service platform determines the target technology stack template supported by the front-end application based on the interactive data acquisition request in a preset technology stack template library, including: When the user performs the first interactive operation on the front-end application, the micro-front-end integration service platform loads the target technology stack template supported by the front-end application corresponding to the interactive data acquisition request from the preset technology stack template library based on the interactive data acquisition request; When the user performs a non-first interactive operation on the front-end application, the micro-front-end integration service platform identifies the target technology stack template supported by the front-end application from the loaded technology stack templates.
3. The method according to claim 1, characterized in that The backend service terminal obtains the required interactive data from a preset data storage remote warehouse based on the interactive data acquisition request, including: The backend service terminal determines the required interactive data storage area in the preset data storage remote warehouse based on the interactive data acquisition request; The background service terminal obtains the demand interaction data of the interaction data acquisition request in the demand interaction data storage area.
4. The method according to claim 1, characterized in that The micro-frontend integrated service platform corresponds to a shared data storage center, and the shared data storage center stores shared interaction data of each front-end application; the method also includes: When a user triggers a cross-application interaction data acquisition request based on an interactive operation of any front-end application, the front-end application sends the cross-application interaction data acquisition request to the micro-front-end integration service platform; The micro-frontend integration service platform determines the associated interactive frontend application based on the cross-application interactive data acquisition request, and acquires the interactive associated data of the associated interactive frontend application in the shared data storage center; The micro-frontend integrated service platform sends the interaction-related data to the front-end application so that the user can obtain the interaction-related data based on the front-end application, wherein the interaction-related data is the interaction data generated by the user performing interactive operations on the associated interactive front-end application, and the interaction data stored in the shared data storage center is the sharable interaction data of each front-end application.
5. The method according to claim 1, characterized in that When the user performs an interactive operation based on any front-end application, before the front-end application sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integration service platform in response to the interactive operation, the method further includes: The micro-frontend integrated service platform sends a program remote installation instruction to the target service front-end application, so that the target service application front-end downloads and installs the micro-frontend integrated service platform access program based on the program remote installation instruction, wherein the micro-frontend integrated service platform access program provides the micro-frontend integrated service platform service to the target service front-end application after running.
6. The method according to any one of claims 1 to 5, characterized in that Each front-end application runs based on an independent sandbox environment in the micro-front-end integration service platform.
7. The method according to claim 6, characterized in that The micro front-end integrated service platform is built based on the node.js framework.
8. A micro-frontend application data interaction device, characterized in that: Applied to a micro-frontend integrated service platform, the micro-frontend integrated service platform is connected to multiple frontend applications; the device includes: An application interaction module, which is used for when a user performs an interactive operation based on any front-end application, the front-end application responds to the interactive operation and sends an interactive data acquisition request corresponding to the interactive operation to the micro-front-end integrated service platform, wherein the micro-front-end integrated service platform corresponds to a preset technology stack template library, and the preset technology stack template library contains multiple technology stack templates; A request forwarding module is used for the micro-frontend integrated service platform to determine the target technology stack template supported by the front-end application based on the interactive data acquisition request in the preset technology stack template library, and forward the interactive data acquisition request to the backend service terminal based on the target technology stack template; The data transmission module is used for the background service terminal to obtain the demand interaction data in the preset data storage remote warehouse based on the interaction data acquisition request, and return the demand interaction data to the front-end application through the micro-front-end integrated service platform, so that the user can obtain the demand interaction data corresponding to the interaction operation based on the front-end application.
9. A storage medium having a computer program stored thereon, characterized in that: When the computer program is executed by a processor, the method for micro-frontend application data interaction described in any one of claims 1 to 7 is implemented.
10. A computer device comprising a storage medium, a processor, and a computer program stored in the storage medium and executable on the processor, characterized in that: When the processor executes the computer program, the method for micro-frontend application data interaction described in any one of claims 1 to 7 is implemented.