Application routing method and device, electronic equipment and computer readable storage medium
By maintaining its own routing records in a single-page sub-app and synchronizing them to the global routing records, conflict problems in routing management of multiple single-page applications are solved, improving the accuracy of routing and realizing the recording of global routing history.
Patent Information
- Application Number
- CN202311744284.0
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2023-12-18
- Publication Date
- 2025-06-20
AI Technical Summary
The prior art tends to lead to conflicts when managing the routes of multiple single-page applications, affecting the accuracy of the routing, and lacks the control ability of global routing state flow.
By maintaining its own routing records in a single-page sub-application and synchronizing routing information to global routing records when a routing event is triggered, coordinated management of multiple routing systems is achieved.
It improves the accuracy of routing for single-page applications, avoids routing conflicts, and realizes recording and backtracking of global routing history, ensuring the normal operation of the micro front-end system.
Smart Images

Figure CN120179944A_ABST
Abstract
Description
Background Art
[0002] The functions of modern Web (World Wide Web) applications are becoming increasingly complex. Due to the needs of function reuse, module decoupling, and independent development and maintenance, a method of loading multiple single-page applications (SPAs) simultaneously in a single browser tab page, namely micro frontends, has emerged. A micro frontend usually includes a base application and at least one sub-application. Usually, a single-page application uses a routing system to manage and display different contents in the application as needed. When there are multiple sub-applications in a browser tab page, a method of managing multiple routing systems simultaneously is required to meet the overall page navigation requirements of the micro frontend application.
[0003] In the related art, both the base application and the single-page sub-application use a URL (Uniform Resource Locator)-based routing mode. Since multiple routing systems in the page need to share the path and hash parts in the same URL, the ways in which the routing information of each application occupies and modifies the path and hash need to be strictly agreed upon. Otherwise, it is easy to cause conflicts, resulting in the page being unable to load or the routing resolution between applications interfering with each other. And adopting a routing mode that does not rely on browser APIs (Application Programming Interfaces) (such as the memory routing mode, Memory mode) lacks the ability to control the global routing state transition, affecting the response of the single-page sub-application to global events. Therefore, the current application routing methods all affect the accuracy of routing of single-page applications to a certain extent.
[0004] Therefore, there is an urgent need to provide a new application routing method.
[0005] It should be noted that the information disclosed in the above background art is only used to enhance the understanding of the background of the present disclosure. Therefore, it may include information that does not constitute the prior art known to those of ordinary skill in the art. Summary of the Invention
[0006] The purpose of the present disclosure is to provide an application routing method, an application routing device, an electronic device, and a computer-readable storage medium, thereby at least to a certain extent improving the accuracy of routing of single-page applications and realizing global routing records.
[0007] According to a first aspect of the present disclosure, there is provided an application routing method, which is applied to a single-page sub-application. The single-page sub-application maintains its own routing records, and when a routing event is triggered, synchronizes the routing information of the routing event to the global routing record. The method includes: if a global browser event is monitored, obtaining the target routing information corresponding to the browser event in the global routing record, and obtaining the current routing information in the own routing record; routing the single-page sub-application according to the target routing information and the current routing information.
[0008] In an exemplary embodiment, before the step of if a global browser event is monitored, obtaining the target routing information corresponding to the browser event in the global routing record, and obtaining the current routing information in the own routing record, the method further includes: when the single-page sub-application is mounted to the base application, synchronizing the initial routing information of the single-page sub-application in the global routing record; wherein, when any single-page sub-application triggers a routing event, the routing information of the routing event is synchronized to the global routing record in the order of occurrence.
[0009] In an exemplary embodiment, each piece of first routing information in the global routing record includes a first index and the routing state of the single-page sub-application when the first routing information is recorded; wherein, the first routing pointer indicates the current corresponding first routing information of the tab page, and the tab page includes a plurality of the single-page sub-applications.
[0010] In an exemplary embodiment, each piece of second routing information in the own routing record includes a second index, and the second routing pointer indicates the current corresponding second routing information of the single-page sub-application; the step of when a routing event is triggered, synchronizing the routing information of the routing event to the global routing record includes: determining the routing state of the single-page sub-application according to the identification information of the single-page sub-application and the second index of the routing event; reporting the routing state of the single-page sub-application to the browser, so as to add a piece of first routing information in the global routing record and generate a corresponding first index.
[0011] In an exemplary embodiment, the method further includes: in a piece of first routing information added in the global routing record, retaining the routing states of other single-page sub-applications that have not triggered routing events currently.
[0012] In an exemplary embodiment, the step of obtaining the target routing information corresponding to the browser event in the global routing record, and obtaining the current routing information in the own routing record includes: obtaining the current first routing information indicated by the first routing pointer as the target routing information; obtaining the current second routing information indicated by the second routing pointer as the current routing information.
[0013] In an exemplary embodiment, routing the single-page sub-application according to the target routing information and the current routing information includes: obtaining a target second index in the target routing information; obtaining a current second index corresponding to the current routing information; determining an index offset according to the target second index and the current second index; and routing the single-page sub-application based on the index offset.
[0014] In an exemplary embodiment, each piece of first routing information in the global routing record further includes the routing address of the base application when the first routing information is recorded; each piece of second routing information in the self-routing record further includes the routing address of the single-page sub-application when the second routing information is recorded.
[0015] According to a second aspect of the present disclosure, there is provided an application routing method, which is applied to a base application. The base application maintains a global routing record, and a single-page sub-application in a single page is mounted to the base application. The single-page sub-application maintains its own routing record and, when a routing event is triggered, reports the routing information of the routing event to the base application to synchronize the routing information to the global routing record. The method includes: receiving the self-routing record reported by the single-page sub-application; if a browser event is monitored, obtaining target routing information corresponding to the browser event in the global routing record and obtaining current routing information in the self-routing record reported by the single-page sub-application; and sending a routing instruction to the single-page sub-application according to the target routing information and the current routing information to instruct the single-page sub-application to perform routing.
[0016] In an exemplary embodiment, mounting the single-page sub-application in the single page to the base application includes: recording initial routing information of the single-page sub-application in the global routing record.
[0017] In an exemplary embodiment, each piece of first routing information in the global routing record includes a first index and the routing state of the single-page sub-application when the first routing information is recorded; wherein, a first routing pointer is used to indicate the first routing information currently corresponding to the tab page, and the tab page includes a plurality of the single-page sub-applications; each piece of second routing information in the self-routing record includes a second index, and a second routing pointer is used to indicate the second routing information currently corresponding to the single-page sub-application.
[0018] In an exemplary embodiment, if a browser event is monitored, obtaining target routing information corresponding to the browser event in the global routing record, and obtaining current routing information in the self-routing record reported by the single-page sub-application, includes: obtaining the current first routing information indicated by the first routing pointer as the target routing information; obtaining the current second routing information indicated by the second routing pointer as the current routing information.
[0019] In an exemplary embodiment, according to the target routing information and the current routing information, sending a routing instruction to the single-page sub-application to instruct the single-page sub-application to perform routing, includes: obtaining a target second index in the target routing information; obtaining a current second index corresponding to the current routing information; determining an index offset according to the target second index and the current second index; sending a routing instruction to the single-page sub-application based on the index offset to instruct the single-page sub-application to route the single-page sub-application according to the index offset.
[0020] In an exemplary embodiment, the method further includes: in response to an operation of adding a routing state of a single-page sub-application to the first routing information indicated by the first routing pointer, keeping the indication position of the first routing pointer unchanged.
[0021] In an exemplary embodiment, the method further includes: in response to an operation of adjusting a routing address of a base application, adding first routing information to the global routing record, and adjusting the position of the first routing pointer to indicate the added first routing information; deleting the first routing information between the positions before and after the adjustment of the first routing pointer.
[0022] According to a third aspect of the present disclosure, there is provided an application routing device applied to a single-page sub-application. The single-page sub-application maintains its own routing record and synchronizes the routing information of the routing event to the global routing record when a routing event is triggered. The device includes: an information acquisition module, configured to obtain target routing information corresponding to the browser event in the global routing record and obtain current routing information in the self-routing record if a global browser event is monitored; a routing module, configured to route the single-page sub-application according to the target routing information and the current routing information. According to a third aspect of the present disclosure, there is provided an electronic device, including: a processor; and a memory for storing executable instructions of the processor; wherein the processor is configured to implement the above method by executing the executable instructions.
[0023] According to a fourth aspect of the present disclosure, an application routing device is provided, which is applied to a base application. The base application maintains a global routing record, and single-page sub-applications in a single page are mounted to the base application. The single-page sub-applications maintain their own routing records, and when a routing event is triggered, report the routing information of the routing event to the base application to synchronize the routing information to the global routing record. The device includes: an information receiving module, configured to receive the own routing record reported by the single-page sub-application; an information obtaining module, configured to obtain the target routing information corresponding to the browser event in the global routing record and the current routing information in the own routing record reported by the single-page sub-application if a browser event is monitored; and a routing module, configured to issue a routing instruction to the single-page sub-application according to the target routing information and the current routing information to instruct the single-page sub-application to perform routing.
[0024] According to a fifth aspect of the present disclosure, an electronic device is provided, including: a processor; and a memory, configured to store executable instructions of the processor; wherein the processor is configured to execute the above method by executing the executable instructions.
[0025] According to a sixth aspect of the present disclosure, a computer-readable storage medium is provided, on which a computer program is stored. When the computer program is executed by a processor, the above method is implemented.
[0026] For the application routing method provided by the embodiments of the present disclosure, on the one hand, while single-page sub-applications maintain their own routing records, when a routing event is triggered, the routing information of the routing event is synchronized to the global routing record. There is no need for communication between single-page sub-applications, and the routing information of all single-page sub-applications is maintained through the global routing record, enabling single-page sub-applications to perform routing processing according to their own routing records and the global routing record during the application routing process. Single-page sub-applications do not interfere with each other and will not cause routing conflicts due to sharing the URL, improving the accuracy of application routing and ensuring the normal operation of the entire micro-frontend system. On the other hand, since the routing events triggered by single-page sub-applications are recorded in the global routing record, retaining the routing history of all applications, the backtracking of the global historical routing record can be realized, enabling single-page sub-applications to correctly respond to global browser events and further improving the accuracy of application routing.
[0027] It should be understood that the above general description and the following detailed description are only exemplary and explanatory, and cannot limit the present disclosure. BRIEF DESCRIPTION OF THE DRAWINGS
[0028] The accompanying drawings herein are incorporated into the specification and form a part of the specification, showing embodiments consistent with the present disclosure, and are used together with the specification to explain the principles of the present disclosure. Obviously, the accompanying drawings in the following description are only some embodiments of the present disclosure, and those of ordinary skill in the art can obtain other drawings based on these drawings without creative efforts.
[0029] Figure 1 A schematic diagram schematically shows some application scenarios of micro frontends according to an exemplary embodiment of the present disclosure.
[0030] Figure 2 A flowchart schematically shows a method for application routing according to an exemplary embodiment of the present disclosure.
[0031] Figure 3 A flowchart schematically shows the first routing state in an exemplary embodiment of the present disclosure.
[0032] Figure 4 A flowchart schematically shows an implementation manner in which a single-page sub-application synchronizes routing information to a global routing record in an exemplary embodiment of the present disclosure.
[0033] Figure 5 A flowchart schematically shows an implementation manner of obtaining target routing information and current routing information in an exemplary embodiment of the present disclosure.
[0034] Figure 6 A flowchart schematically shows an implementation manner of routing a single-page sub-application in an exemplary embodiment of the present disclosure.
[0035] Figure 7 A flowchart schematically shows a routing method for a single-page multi-application in an exemplary embodiment of the present disclosure.
[0036] Figure 8 A flowchart schematically shows the second routing state in an exemplary embodiment of the present disclosure.
[0037] Figure 9 A flowchart schematically shows the third routing state in an exemplary embodiment of the present disclosure.
[0038] Figure 10 A flowchart schematically shows the fourth routing state in an exemplary embodiment of the present disclosure.
[0039] Figure 11 A flowchart schematically shows the fifth routing state in an exemplary embodiment of the present disclosure.
[0040] Figure 12 A flowchart schematically shows the sixth routing state in an exemplary embodiment of the present disclosure.
[0041] Figure 13 The flowchart showing another application routing method that can apply the exemplary embodiments of the present disclosure is presented.
[0042] Figure 14 The schematic diagram showing the composition of an application routing device that can apply the exemplary embodiments of the present disclosure is presented.
[0043] Figure 15 The schematic diagram showing the composition of another application routing device that can apply the exemplary embodiments of the present disclosure is presented.
[0044] Figure 16 The schematic diagram showing the composition of an electronic device that can apply the exemplary embodiments of the present disclosure is presented. Detailed implementation manners
[0045] Example embodiments will now be described more fully with reference to the accompanying drawings. However, the example embodiments can be implemented in various forms and should not be construed as limited to the examples set forth herein; rather, these embodiments are provided so that this disclosure will be more complete and comprehensive, and will fully convey the concept of the example embodiments to those skilled in the art. The features, structures, or characteristics described may be combined in any suitable manner in one or more embodiments.
[0046] In addition, the accompanying drawings are only schematic illustrations of the present disclosure and are not necessarily drawn to scale. The same reference numerals in the drawings denote the same or similar parts, and thus their repeated description will be omitted. Some of the block diagrams shown in the drawings are functional entities and do not necessarily correspond to physically or logically independent entities. These functional entities can be implemented in software form, or in one or more hardware modules or integrated circuits, or in different networks and / or processor devices and / or microcontroller devices.
[0047] Micro frontends, that is, multiple single-page applications are loaded simultaneously in a single browser tab. A micro frontend generally includes a base application and at least one sub-application. The base application provides a container for loading each independently deployed sub-application and isolates the static resources of each sub-application through various technologies, enabling the code of each sub-application to run in the same window without interference from each other, while communicating with the base as necessary.
[0048] Such as Figure 1 The schematic diagram showing some application scenarios of micro frontends according to the exemplary embodiments of the present disclosure is presented. Such as Figure 1 As shown, an exemplary application scenario of a micro frontend is that a single single-page sub-application is embedded in the base application as a functional module to provide part of the functional support for the base application.
[0049] Another exemplary application scenario of micro frontends is to provide different functions through multiple single-page sub-applications. For example, in an e-commerce backend system, single-page sub-application A provides data query functions, and single-page sub-application B provides policy configuration functions. The base application serves as a portal to manage and integrate these functions and provide a unified entry.
[0050] Another exemplary application scenario of micro frontends is multi-layer nesting, that is, a single-page sub-application can simultaneously serve as a base application to provide an embedding container for "grandchild applications".
[0051] In each single-page sub-application in micro frontends, a routing system is usually required to manage and display different contents in the application on demand and provide page navigation functions. If there are multiple applications on a page, multiple routing systems need to be managed simultaneously to meet the overall page navigation requirements of the micro frontend application.
[0052] In a related technology, both the base application and the single-page sub-application adopt a URL-based routing mode. According to the different components of the URL carrying routing information, it can include the URL path-based method and the URL fragment (also known as hash)-based method. The URL-based routing mode will render the corresponding content according to the routing information carried in the path or hash in the URL, and the routing information will also be updated to the URL synchronously when a routing jump occurs. Among them, each application can choose the same or different parts in the URL as the routing carrier. Since the URL of the browser window is globally unique, if multiple applications choose the same part as the routing carrier, it is necessary to divide this part into different regions by an agreed-upon method to avoid interference with each other.
[0053] However, in the URL-based routing mode, since multiple routing systems in a page share the path and hash parts in the same URL, the ways in which the routing information of each application occupies and modifies the path and hash need to be strictly agreed upon, otherwise conflicts are likely to occur. For example, the path part of the browser URL simultaneously carries the loading path of the static resources of the base application. If the base application uses the hash-based routing method, it indicates that the base application usually does not intercept the changes in the path, that is, the path part cannot be allocated to the single-page sub-application, otherwise it will conflict with the path of the static resources of the base application and cause the page to fail to load. Another example is that when there are multiple single-page sub-applications under the base application, there will be a situation where multiple single-page sub-applications occupy the same part (taking the path as an example). Each single-page sub-application needs to read the part belonging to itself in the path according to the agreed rules. However, when the routing of one of the single-page sub-applications changes, the entire path will change, which is very likely to interfere with the routing resolution of other single-page sub-applications. For example, when the routing of single-page sub-application A changes, the routing information of single-page sub-application B needs to be retained at the same time, and the new base routing needs to be communicated to single-page sub-application B through the base in a timely manner, otherwise the routing information of single-page sub-application B will be lost or the parsing will fail.
[0054] In another related technology, the single-page sub-application can use a routing mode that is detached from the browser API, that is, a routing mode that does not rely on the browser API. For example, the MemoryRouter of react-router and the abstract mode of vue-router.
[0055] However, the routing mode that is detached from the browser API will disconnect the routing information of the single-page sub-application from the browser's historical routing records. As a result, only the base application can respond to browser events, and the routing information of each single-page sub-application can only exist independently and cannot be globally controlled, that is, it lacks the ability to control the global routing state transition, which affects the response of the single-page sub-application to global events.
[0056] In the above-mentioned related technologies, to a certain extent, they all affect the accuracy of routing in single-page applications. In yet another related technology, if the single-page sub-application does not use a routing system, it will bring extremely many inconveniences to the application routing due to abandoning the routing system (such as being unable to control the application routing state transition).
[0057] Therefore, based on one or more of the above problems, the embodiments of the present disclosure provide a new application routing method to solve the routing conflict problem caused by multiple applications sharing the URL, and maintain the routing history of all applications in the global routing record, so that the routing system of each application can normally respond to browser events, thereby improving the accuracy of application routing.
[0058] Figure 2The flowchart of an application routing method according to an exemplary embodiment of the present disclosure is shown. This application routing method can be applied to a single-page sub-application, which can be any single-page sub-application among multiple applications included in a single page, or can be the only single-page application in a single page.
[0059] Among them, the single-page sub-application needs to maintain its own routing records, that is, when a routing event is triggered in the single-page sub-application, the routing information of the routing event is recorded in its own routing records. At the same time, the single-page sub-application also needs to synchronize the routing information of the routing event to the global routing records when the routing event is triggered.
[0060] Among them, the routing event can be a routing jump operation. For example, if the single-page sub-application jumps the route / a to the route / b, then the routing information for this routing event is added to its own routing records, and at the same time, the routing information of this routing event is synchronously added to the global routing records. In its own routing records, the routing information of the routing event is concatenated in the actual occurrence order.
[0061] In the embodiments of the present disclosure, the global routing records record the routing information of all sub-single-page sub-applications triggering routing events, and concatenate the routing information of all single-page sub-applications in the actual occurrence order. At the same time, the global routing records also record the routing information of the base routing. That is to say, the global routing records are equivalent to the browser history, recording the routing history of all single-page applications (including the base application and single-page sub-applications) located in the same tab page to achieve the backtracking of the global historical routing, and thus facilitating the control of the routing state transition of each application.
[0062] In an optional embodiment, when the single-page sub-application is mounted to the base application, the initial routing information of the single-page sub-application needs to be synchronized in the global routing records. Of course, this initial routing information is also added to the own routing records of the single-page sub-application.
[0063] As Figure 3 shown, in Figure 3-1, the base application is located at the route / 1, and there is no single-page sub-application for this route / 1, so a routing information is added to the global routing records; further, in Figure 3-2, the base routing jumps to the route / 2, and the single-page sub-application A and the single-page sub-application B start to be mounted, so a routing information is continuously added to the global routing records, and after the mounting is completed, the initial routing information of the single-page sub-application A and the single-page sub-application B is recorded in this routing information (in Figure 3-3).
[0064] Among them, the global routing records can be maintained by the browser. Through the interaction between the single-page sub-application and the browser, the single-page sub-application reads the target routing information in the global routing records.
[0065] It should be noted that when any single-page sub-application mounted to the base application triggers a routing event, the routing information of the routing event will be synchronized to the global routing record in the order of occurrence.
[0066] See Figure 2 , the application routing method of the present disclosure embodiment may include step S210 and step S220:
[0067] In step S210, if a global browser event is monitored, the target routing information corresponding to the browser event in the global routing record is obtained, and the current routing information in its own routing record is obtained.
[0068] In an exemplary embodiment of the present disclosure, the global browser event refers to an event related to triggering the popstate event of the browser. The popstate event is a browser return event, and this event will be triggered when the window's history record changes.
[0069] Among them, the global browser events include clicking the browser back at least one step, clicking the browser forward at least one step, etc. (such as clicking the browser forward or backward button). For example, browser events implemented by the following methods: History.back() / History.forward() / History.go(): back / forward / move. These browser events are used to switch the current page to a certain historical state. If these operations occur, the popstate event of the browser will be triggered.
[0070] The single-page sub-application can obtain the target routing information corresponding to the browser event in the global routing record through interaction with the browser. The target routing information refers to the end routing information pointed to by the browser event. That is to say, the single-page sub-application can determine the end routing information pointed to by the browser event by reading the global routing record.
[0071] Correspondingly, the single-page sub-application can obtain the current routing information corresponding to the single-page sub-application in its own routing record. The current routing information is the routing information currently corresponding to the single-page sub-application among all the routing information in its own routing record.
[0072] In step S220, the single-page sub-application is routed according to the target routing information and the current routing information.
[0073] In an exemplary embodiment of the present disclosure, the target routing information is the end routing that the single-page sub-application needs to match. The single-page sub-application can be matched to the target routing information according to the target routing information and the current routing information to achieve routing.
[0074] It should be noted that since the routing information in the global routing record synchronizes the routing information of the single-page sub-application, and thus the target routing information records the historical routes of the single-page sub-application, the target routing information and the current routing information can be matched to implement the routing of the single-page sub-application.
[0075] For the application routing method provided by the embodiments of the present disclosure, on the one hand, while each single-page sub-application maintains its own routing record, when it triggers a routing event, it synchronizes the routing information of the routing event to the global routing record. There is no need for communication between single-page sub-applications, and the routing information of all single-page sub-applications is maintained through the global routing record, enabling single-page sub-applications to perform routing processing according to their own routing records and the global routing record during the application routing process. Single-page sub-applications do not interfere with each other and will not cause routing conflicts due to sharing the URL, improving the accuracy of application routing and ensuring the normal operation of the entire micro-frontend system. On the other hand, since the routing events triggered by single-page sub-applications are recorded in the global routing record, retaining the routing history of all applications, the backtracking of the global historical routing record can be realized, enabling single-page sub-applications to correctly respond to global browser events and further improving the accuracy of application routing.
[0076] In an exemplary embodiment, each piece of first routing information in the global routing record includes a first index and the routing state of the single-page sub-application when recording this first routing information; wherein, the first routing pointer indicates the first routing information currently corresponding to the tab page, and the tab page includes multiple single-page sub-applications.
[0077] Among them, the sequence of the first index numbers can indicate the sequence of recording the first routing information. The first routing pointer is a movable pointer, and the first routing information currently corresponding to the tab page can be indicated through the first routing pointer. Moreover, each piece of first routing information includes the routing state of each single-page sub-application when recording this first routing information.
[0078] Table 1 shows an example of a global routing record according to an exemplary embodiment of the present disclosure. As shown in Table 1, the global routing record includes multiple pieces of first routing information, corresponding to the first index (0, 1, 2 respectively) and the routing state of the single-page sub-application.
[0079] Table 1
[0080]
[0081] Referring to Table 1, the first routing information indicated by the first routing pointer includes the first index "2" and the routing states of single-page sub-application A and single-page sub-application B when recording this first routing information.
[0082] In an exemplary embodiment, each piece of first routing information in the global routing record may further include the routing address of the base application when the first routing information is recorded, so as to provide a routing basis for responding to global browser events.
[0083] Through the global routing record, the routing histories of all single-page applications within a tab page can be uniformly maintained, preventing the routing histories of single-page applications from being separated from the browser, and the routing states of each single-page sub-application do not interfere with each other. The global routing record provides a global historical routing record for the routing of single-page sub-applications, enabling the backtracking of historical routes.
[0084] In an exemplary embodiment, each piece of second routing information in the self-routing record of a single-page sub-application includes a second index, and the second routing pointer indicates the second routing information currently corresponding to the single-page sub-application.
[0085] Among them, the sequence of the second index numbers can indicate the sequence of recording the second routing information. The second routing pointer is a movable pointer, and through the second routing pointer, the second routing information currently corresponding to the single-page sub-application can be indicated.
[0086] Table 2 shows an example of a self-routing record according to an exemplary embodiment of the present disclosure. As shown in Table 2, the self-routing record includes multiple pieces of second routing information, corresponding to second indices (0, 1, 2) respectively. Of course, each piece of second routing information in the self-routing record may further include the routing address of the single-page sub-application when the second routing information is recorded, such as / x, / z, / y in Table 2.
[0087] Table 2
[0088]
[0089] Referring to Table 2, the second routing information indicated by the second routing pointer includes the second index "2" and the routing address " / y" of the single-page sub-application when the second routing information is recorded.
[0090] By each single-page sub-application maintaining its own self-routing record, each single-page sub-application can backtrack and query its own historical routes, providing a routing basis for routing.
[0091] In an exemplary embodiment, an implementation method for a single-page sub-application to synchronize routing information to the global routing record is provided. As Figure 4 shown, when a routing event is triggered, synchronizing the routing information of the routing event to the global routing record may include step S410 and step S420:
[0092] Step S410: Determine the routing state of the single-page sub-application according to the identification information of the single-page sub-application and the second index of the routing event.
[0093] The identification information is the unique identifier of the single-page sub-application globally. The single-page sub-application generates a unique identifier when it is mounted to the base application, and this unique identifier needs to be carried when the single-page sub-application synchronizes the routing information to the global routing record. The second index of the routing event is determined according to the second index of the existing records in the self-routing record of the single-page sub-application, that is, the sequential numbering can continue based on the second index of the existing records to obtain the second index of the routing event.
[0094] Exemplarily, if the self-routing record of the single-page sub-application is as shown in Table 2, when the single-page sub-application jumps to the route / a, a new second routing information "Second Index: 3; Routing Address: / a" is added to the self-routing record. Correspondingly, the second routing pointer indicates this newly added second routing information. Furthermore, the routing status of the single-page sub-application is determined according to the identification information (such as App: a) and the second index ("3") of the single-page sub-application.
[0095] Step S420: Report the routing status of the single-page sub-application to the browser to add a first routing information in the global routing record and generate a corresponding first index.
[0096] The single-page sub-application in the embodiment of the present disclosure interacts with the browser to report the routing status to the browser, so that the browser adds a first routing information in the global routing record and generates a first index of the newly added first routing information.
[0097] Among them, the first index of the newly added first routing information is determined according to the first index of the existing records in the global routing record, that is, the sequential numbering can continue based on the first index of the existing records to obtain the first index of the newly added first routing information.
[0098] Exemplarily, if the global routing record is as shown in Table 1, when the single-page sub-application jumps to the route / a, a first routing information "First Index: 3; Routing Status of Sub-application A 2; Routing Status of Sub-application B 2" is added to the global routing record. Correspondingly, the first routing pointer indicates this newly added first routing information. Among them, the current sub-application B has not triggered a routing event, so the routing status 2 of the sub-application B is retained in the newly added first routing information.
[0099] Based on the foregoing exemplary embodiments, in a first routing information added to the global routing record, the routing status of other single-page sub-applications that have not triggered routing events currently is retained. That is, when a single-page sub-application adds or modifies the global routing information, the routing status of other single-page sub-applications that already exist in the global routing record and have not triggered routing events should be completely retained without deletion or modification. Based on this, it can be ensured that the routing status of each single-page sub-application is completely maintained in each first routing information.
[0100] In an alternative embodiment, the single-page sub-application can report the routing state of the single-page sub-application to the browser by calling the following method: History.pushState(), so as to add the first routing information to the global routing record and generate the corresponding first index.
[0101] In an alternative embodiment, the single-page sub-application synchronizes the routing information of the routing event to the global routing record through the browser interface (History API). Since the History API of the browser is globally accessible within the scope of the tab page and all application historical routes are completely recorded in the global routing record, the historical routes of each application do not interfere with each other.
[0102] The single-page sub-application of the embodiments of the present disclosure reports the routing state to the browser, and thus can completely record the historical routes of the single-page sub-application in the global routing record, providing a historical routing basis for routing management.
[0103] In an exemplary embodiment, an implementation manner for obtaining target routing information and current routing information is provided. As Figure 5 shown, obtaining the target routing information corresponding to the browser event in the global routing record and obtaining the current routing information in its own routing record may include steps S510 to S530:
[0104] Step S510: Determine the current first routing information indicated by the first routing pointer as the target routing information.
[0105] After the browser event is monitored, according to the indicated position of the first routing pointer in the global routing record, the current first routing information can be determined, so as to determine the current first routing information as the target routing information.
[0106] For example, if the browser event is "click the browser back button / call History.back()", the route needs to be stepped back one step. Another example is that if the browser event is "click the browser forward button / call History.forward()", the route needs to be stepped forward one step. Of course, it can also be multiple steps back / forward for the route, which will not be listed one by one here.
[0107] In actual implementation, there is no need to distinguish the type of the browser event, and the current first routing information can be directly read according to the first routing index. The target routing information includes the target routing state that the single-page sub-application needs to match.
[0108] Step S520: Obtain the current second routing information indicated by the second routing pointer as the current routing information.
[0109] After monitoring a browser event, according to the indicated position of the second routing pointer in its own routing record, the current second routing information at the indicated position can be determined as the current routing information. The current routing information includes the current routing status of the single-page sub-application.
[0110] In the embodiments of the present disclosure, when a browser event is triggered, a single-page sub-application can accurately obtain the target routing information that it needs to navigate to and its current routing information based on the first routing pointer and the second routing pointer through the global routing record and its own routing record, thereby providing a routing information basis for its own routing management, without interfering with the routing processes of other single-page sub-applications, avoiding routing conflicts caused by sharing URLs, and improving routing accuracy.
[0111] In an exemplary embodiment, an implementation manner for routing a single-page sub-application is provided. As Figure 6 shown, routing the single-page sub-application according to the target routing information and the current routing information may include steps S610 to S640:
[0112] Step S610: Obtain the target second index in the target routing information.
[0113] Since each routing information in the global routing record maintains the routing status of all single-page sub-applications, the target routing status of the single-page sub-application can be obtained from the target routing information first, and then the target second index can be obtained from the target routing status.
[0114] Step S620: Obtain the current second index corresponding to the current routing information.
[0115] Each routing information in the self-routing information of the single-page sub-application maintains its own routing status, so the current second index can be directly read from the current routing information first.
[0116] Step S630: Determine the index offset according to the target second index and the current second index.
[0117] After obtaining the target second index and the current second index, the index offset can be determined according to the target second index and the current second index. The index offset includes the routing direction and the routing hop count, that is, the index offset is used to indicate that the second routing pointer moves along the target routing direction by the target routing hop count to make the routing status of the single-page sub-application match the routing status in the target routing information.
[0118] Step S640: Route the single-page sub-application based on the index offset.
[0119] After determining the index offset, the single-page sub-application can be routed based on the index offset to match the routing status of the single-page sub-application to the target routing status in the target routing information.
[0120] Exemplarily, when a single-page sub-application monitors a browser event, it can determine whether the target routing information contains the second index recorded by itself. If not, it can calculate the difference n between the target second index and the current second index as the index offset, so as to advance / retreat the second routing pointer of itself by n bits to match the routing status in the target routing information.
[0121] For example, if the target second index is 1 and the current second index is 2, the index offset is -1, indicating that the target routing status lags behind the current routing status of the single-page sub-application by one record. Then the single-page sub-application needs to retreat one step to match the target routing status.
[0122] In the embodiments of the present disclosure, from a global perspective, when the global first routing pointer moves, that is, when a browser event is triggered, each single-page sub-application can monitor it, and thereby determine whether its current routing status matches the target routing status, so as to synchronously adjust itself to match the target routing status when necessary. Since the single-page sub-application is in a routing mode that is separated from the browser API, the single-page sub-application will maintain its own routing records. Therefore, at any time, if a browser event is monitored, the current routing status can be obtained according to its own routing records, and the target routing status can be obtained according to the global routing records, and the two are compared. Then, operations such as routing jump, forward, and backward are implemented according to the comparison result, and this process does not require communication between single-page sub-applications.
[0123] It should be noted that the browser event (popstate event) is globally monitorable within the scope of the tab page. Therefore, the single-page sub-application can calculate the index offset between the target second index and the current second index to obtain the gap between the current routing status and the target routing status, and then move the second routing pointer to restore its own routing to the target routing status, that is, the routing system of the single-page sub-application can correctly respond to the browser event.
[0124] Figure 7 The flowchart of a routing method for a single-page multi-application according to an exemplary embodiment of the present disclosure is shown. The following combines Figure 7 to describe the application routing method of the embodiments of the present disclosure.
[0125] Step S710, each single-page sub-application is mounted to the base application, and the initial routing information of the single-page sub-application is synchronized in the global routing record.
[0126] Among them, in the initial state, the base application is located at route / 1, and there is no single-page sub-application under this route / 1. Refer to Figure 3 the initial state shown in FIG. 3-1, then the global routing record only includes the first routing information with the first index being "0".
[0127] Further, the base application jumps to the route / 2, and the single-page sub-application A and the single-page sub-application B start to be mounted ( Figure 3 as shown in 3-2), and after the mounting is completed, the initial route information of the single-page sub-application A and the single-page sub-application B is synchronized in the global route record. The initial route information includes the identification information and the second index of each single-page sub-application. Currently, the initial route information also includes the route address " / 2" of the base application ( Figure 3 as shown in 3-3).
[0128] Correspondingly, after the single-page sub-application A and the single-page sub-application B are mounted, a second route information is also added to their own route records. The second route information includes the second index and the route address when the second route information is recorded (such as " / a" and " / x"), see Figure 3 as shown.
[0129] Exemplarily, the initial route information of the single-page sub-application can be synchronized in the global route record by calling History.replace State().
[0130] In addition, after the single-page sub-application is mounted to the base application, the corresponding page content can be rendered (step S720).
[0131] The following process is described by taking the routing process of a certain single-page sub-application as an example.
[0132] In step S730, the single-page sub-application listens for route events or browser events.
[0133] The route event or browser event is triggered by the user or an automated event that starts to execute in response to a trigger instruction, and no special limitation is imposed on this.
[0134] Step S740, if an event is listened, the event type is judged.
[0135] In a possible embodiment, if the event type is its own route event, it goes to step S750. A second route information can be added to its own route record. The second route information includes the second index and the route address. And, the single-page sub-application determines the route status according to the identification information and the second index, and reports it to the browser to add a first route information in the global route record and generate a corresponding first index.
[0136] Exemplarily, see Figure 8 as shown, based on the foregoing Figure 3, the single-page sub-application A jumps to the route / b, adds a second route information "Second Index: 1; Route Address: / b" to its own route record, and correspondingly adds a first route information "First Index: 2; Route Address of the base application: / 2; Single-page sub-application A: Second Index 1; Single-page sub-application B: Second Index 0" to the global route record. Among them, the first route pointer moves to indicate the added first route information, and the second route pointer moves to indicate the added second route information.
[0137] Among them, the single-page sub-application B does not trigger a route event, its own route record remains unchanged, and the routing status of the single-page sub-application B is retained unchanged in the newly added first route information.
[0138] Further, see Figure 9 , based on the foregoing Figure 8 , the single-page sub-application B jumps to the route / z, adds a second route information "Second Index: 1; Route Address: / z" to its own route record, and correspondingly adds a first route information "First Index: 3; Route Address of the base application: / 2; Single-page sub-application A: Second Index 1; Single-page sub-application B: Second Index 1" to the global route record. Among them, the first route pointer moves to indicate the added first route information, and the second route pointer moves to indicate the added second route information.
[0139] Among them, the single-page sub-application A does not trigger a route event, its own route record remains unchanged, and the routing status of the single-page sub-application A is retained unchanged in the newly added first route information.
[0140] In the embodiments of the present disclosure, in the above-mentioned various route information, the own route records between different single-page sub-applications do not interfere with each other, the second indexes in the second route information between the own route records do not interfere with each other, and the second indexes in the second route information in each own route record do not interfere with the first indexes in the first route information in the global route record either.
[0141] In a possible embodiment, if the event type is a browser event, then go to step S760, obtain the target route information corresponding to the browser event in the global route record, and obtain the current route information in the own route record.
[0142] Among them, the current first route information indicated by the first route pointer can be obtained and determined as the target route information, and finally the current second route information indicated by the second route pointer is obtained as the current route information.
[0143] Exemplarily, in combination with Figure 9, if the browser event is clicking the browser back button / calling History.back(), the single-page sub-application listens to the browser event, and obtains the current first routing information indicated by the first routing pointer in the global routing record as the first routing information corresponding to the first index "3". Furthermore, based on the browser event of clicking the browser back button and the current first routing information, the target routing information is determined to be the first routing information corresponding to the first index "2". That is, the first routing pointer takes a step back.
[0144] Further, referring to Figure 9 , the single-page sub-application A obtains the current second routing information indicated by the second routing pointer according to its own routing record as the second routing information with the second index "1", and the single-page sub-application B obtains the current second routing information indicated by the second routing pointer according to its own routing record as the second routing information with the second index "1".
[0145] In step S770, the single-page sub-application determines whether the target routing status of the target routing information is included in the current routing information of this application.
[0146] Among them, if the single-page sub-application A determines that the target routing status "App-a:1" of the target routing information is included in the current routing information of this application (the current second routing information of the single-page sub-application A is the second index "1"), then the single-page sub-application A does not make any adjustments.
[0147] The single-page sub-application B determines that the target routing status "App-b:0" of the target routing information is not included in the current routing information of this application (the current second routing information of the single-page sub-application B is the second index "1"), then the single-page sub-application B needs to make adjustments to match the target routing status, and then turns to step S780.
[0148] Step S780, the single-page sub-application routes the single-page sub-application according to the target routing information and the current routing information.
[0149] Among them, for the single-page sub-application that needs to perform routing adjustment, first obtain the target second index in the target routing information, then obtain the current second index corresponding to the current routing information, then determine the index offset based on the target second index and the current second index, and finally route the single-page sub-application based on the index offset.
[0150] Exemplarily, based on the foregoing example, the single-page sub-application B can determine that the index offset is "-1" according to the target second index "0" and the current second index "1". Then, the route of the single-page sub-application takes a step back to match the target route state "App-b:0". That is, the second route index of the single-page sub-application B taking a step back indicates the second route information with the second index being "0", and the first route index in the global route record taking a step back indicates the first route information with the first index being "2". The second route index of the single-page sub-application A remains unchanged, as Figure 10 shown.
[0151] Step S790: After the single-page sub-application matches to the target route state, render the corresponding page content according to the matched target route state.
[0152] Similarly, based on the foregoing Figure 10 , see Figure 11 For the browser event of monitoring the click of the browser back button / History.back(), following the similar processing method of the above steps S760 to S790, the route of the single-page sub-application A takes a step back, and the single-page sub-application B makes no adjustment. Further, Figure 12 For the browser event of monitoring the click of the browser forward button / History.forward(), following the similar processing method of the above steps S760 to S790, the route of the single-page sub-application A takes a step forward, and the single-page sub-application B makes no adjustment.
[0153] In the above routing process, the base application does not need to be specially modified and can be routed in the conventional routing manner. For example, the base application can still be routed based on the routing mode of the URL. Each single-page sub-application selects a method that does not depend on the browser API and processes according to the routing method of the embodiments of the present disclosure.
[0154] For the application routing method provided by the embodiments of the present disclosure, on the one hand, while the single-page sub-applications maintain their respective own routing records, when a routing event is triggered, the routing information of the routing event is synchronized to the global routing record. There is no need for communication between the single-page sub-applications, and the routing information of all single-page sub-applications is maintained through the global routing record, enabling the single-page sub-applications to perform routing processing according to their own routing records and the global routing record during the application routing process. The single-page sub-applications do not interfere with each other and will not cause routing conflicts due to sharing the URL, improving the accuracy of the application routing and ensuring the normal operation of the entire micro-frontend system. On the other hand, since the routing events triggered by the single-page sub-applications are recorded in the global routing record, retaining the routing history of all applications, the backtracking of the global historical routing record can be realized, enabling the single-page sub-applications to correctly respond to the global browser events and further improving the accuracy of the application routing.
[0155] In the above exemplary embodiment, the single-page sub-application interacts with the browser, and the single-page sub-application obtains the global routing record provided by the browser to indicate the routing process. Further, the embodiments of the present disclosure also provide an application routing method, in which the base application can maintain the global routing record and listen for global routing events.
[0156] Specifically, the embodiments of the present disclosure provide an application routing method applied to a base application. The base application maintains a global routing record. The single-page sub-application in the single page is mounted to the base application. The single-page sub-application maintains its own routing record and, when a routing event is triggered, reports the routing information of the routing event to the base application to synchronize the routing information to the global routing record.
[0157] Among them, the base application and the single-page sub-application negotiate through the micro-frontend protocol. When the single-page sub-application triggers a routing event, it reports to the base application through the agreed micro-frontend protocol, and the base application maintains the routing information of the routing event in the global routing record. Correspondingly, the base application can receive the self-routing record reported by the single-page sub-application, listen for global browser events by the base application, and when a browser event is detected, decide which single-page sub-application needs to be routed according to the global routing record and the self-routing record reported by the single-page sub-application, so as to issue the adjusted instruction to the single-page sub-application.
[0158] Based on this, the base application implements the global routing record and the supporting add, modify, forward, and backward APIs, and provides them to the single-page sub-application for use through the micro-frontend protocol.
[0159] Specifically, as Figure 13 shown, the application routing method may include steps S1310 to S1330:
[0160] Step S1310: Receive the self-routing record reported by the single-page sub-application.
[0161] Step S1320: If a browser event is detected, obtain the target routing information corresponding to the browser event in the global routing record, and obtain the current routing information in the self-routing record reported by the single-page sub-application.
[0162] Step S1330: According to the target routing information and the current routing information, issue a routing instruction to the single-page sub-application to instruct the single-page sub-application to perform routing.
[0163] In an exemplary embodiment, when the single-page sub-application in the single page is mounted to the base application, the initial routing information of the single-page sub-application is recorded in the global routing record.
[0164] In an exemplary embodiment, each piece of first routing information in the global routing record includes a first index and the routing status of the single-page sub-application at the time when the first routing information is recorded; wherein, the first routing information currently corresponding to the tab page is indicated by a first routing pointer, and the tab page includes multiple single-page sub-applications.
[0165] Each piece of second routing information in the self-routing record includes a second index, and the second routing information currently corresponding to the single-page sub-application is indicated by a second routing pointer.
[0166] In an exemplary embodiment, if a browser event is monitored, obtaining the target routing information corresponding to the browser event in the global routing record and obtaining the current routing information in the self-routing record reported by the single-page sub-application may include:
[0167] First, obtain the current first routing information indicated by the first routing pointer and determine it as the target routing information, and then obtain the current second routing information indicated by the second routing pointer as the current routing information.
[0168] In an exemplary embodiment, according to the target routing information and the current routing information, sending a routing instruction to the single-page sub-application to instruct the single-page sub-application to perform routing may include:
[0169] First, obtain the target second index in the target routing information, then obtain the current second index corresponding to the current routing information, then determine the index offset according to the target second index and the current second index, and finally send a routing instruction to the single-page sub-application based on the index offset amount to instruct the single-page sub-application to route the single-page sub-application according to the index offset amount.
[0170] It should be noted that in the embodiment where the base application executes the application routing method, the specific implementation details can refer to the detailed description of the application routing method executed by the single-page sub-application, which will not be elaborated here. The difference is that in this exemplary embodiment, monitoring browser events, maintaining the global routing record, and sending routing instructions are all uniformly managed by the base application, reducing the processing logic of each single-page sub-application, realizing the unified management of the routing of single-page sub-applications within the tab page, and also facilitating quick problem location in case of failures.
[0171] In an exemplary embodiment, the embodiment of the present disclosure may also respond to an operation of adding the routing status of the single-page sub-application to the first routing information indicated by the first routing pointer, and keep the indication position of the first routing pointer unchanged.
[0172] Specifically, for replacing the first routing information indicated by the first routing pointer with a new record, i.e., "History.replaceState()", which modifies the routing state in the first routing information indicated by the first routing indication in place, the indication position of the first routing pointer can be kept unchanged.
[0173] Exemplarily, referring to Figure 11 , the first routing pointer currently indicates the first routing information with the first index being "1". At this time, if the single-page sub-application C is mounted to the base application, the routing state "App-c:0" is added to the first routing information, without affecting the pointing of the first routing pointer, that is, it does not affect the global routing record and the routing states of other single-page sub-applications, ensuring that each first routing information in the global routing record maintains the accurate routing state of the single-page sub-application.
[0174] In an exemplary embodiment, the embodiments of the present disclosure can also respond to an operation of adjusting the routing address of the base application, add the first routing information in the global routing record, adjust the position of the first routing pointer to indicate the added first routing information, and delete the first routing information between the positions before and after the adjustment of the first routing pointer.
[0175] Specifically, for adding a first routing information unrelated to the routing event of the single-page sub-application in the global routing record, the position of the first routing pointer can be adjusted to indicate the newly added first routing information, and the first routing information between the positions before and after the adjustment of the first routing pointer is deleted to ensure the accuracy of the global routing information.
[0176] Exemplarily, referring to Figure 11 , if the base application routes to a new page (new routing address / 3), the first routing information "routing address of the base application: / 3; routing state of the single-page sub-application" can be added, and the first index of the first routing information is configured as "2" and the first routing pointer points to the first routing information, and the first routing information with the original first index being "2" and "3" is deleted.
[0177] Since a new page is added, the original first routing information with the first index being "2" and "3" will be invalid. If a browser event is triggered subsequently, there is no need to route to the original first routing information with the first index being "2" and "3". Therefore, to ensure the accuracy of the application routing, these first routing information are deleted.
[0178] It should be noted that in the application routing method with the single-page sub-application as the execution subject, the browser maintains the global routing record, and at the same time, the above process of adjusting the global routing record can be implemented to always ensure the accuracy of the global routing record.
[0179] It should be noted that the above-mentioned drawings are only schematic illustrations of the processes included in the method according to the exemplary embodiments of the present disclosure, rather than for restrictive purposes. It is easy to understand that the processes shown in the above-mentioned drawings do not indicate or limit the chronological order of these processes. Additionally, it is also easy to understand that these processes can be executed synchronously or asynchronously in, for example, multiple modules.
[0180] Furthermore, referring to Figure 14 as shown, in an exemplary embodiment of the present disclosure, an application routing device 1400 is provided, which is applied to a single-page sub-application. The single-page sub-application maintains its own routing records and synchronizes the routing information of the routing event to the global routing record when a routing event is triggered. The device includes: an information acquisition module 1410 and a routing module 1420, where:
[0181] The information acquisition module 1410 is configured to, if a global browser event is monitored, acquire the target routing information corresponding to the browser event in the global routing record and acquire the current routing information in the self-routing record; the routing module 1420 is configured to route the single-page sub-application according to the target routing information and the current routing information.
[0182] In an exemplary embodiment, the device further includes an information synchronization module, which is configured to perform: when the single-page sub-application is mounted to the base application, synchronize the initial routing information of the single-page sub-application in the global routing record; where, when any single-page sub-application triggers a routing event, the routing information of the routing event is synchronized to the global routing record in the order of occurrence.
[0183] In an exemplary embodiment, each first routing information in the global routing record includes a first index and the routing state of the single-page sub-application when the first routing information is recorded; where, the first routing pointer indicates the first routing information currently corresponding to the tab page, and the tab page includes multiple single-page sub-applications.
[0184] In an exemplary embodiment, each second routing information in the self-routing record includes a second index, and the second routing pointer indicates the second routing information currently corresponding to the single-page sub-application;
[0185] The information synchronization module is configured to perform: determine the routing state of the single-page sub-application according to the identification information of the single-page sub-application and the second index of the routing event; report the routing state of the single-page sub-application to the browser, so as to add a first routing information in the global routing record and generate a corresponding first index.
[0186] In an exemplary embodiment, the information synchronization module is configured to perform: in a first piece of routing information added to the global routing record, retain the routing states of other single-page sub-applications for which no routing event has been triggered currently.
[0187] In an exemplary embodiment, the information acquisition module 1410 is configured to perform: acquire the current first routing information indicated by the first routing pointer as the target routing information; acquire the current second routing information indicated by the second routing pointer as the current routing information.
[0188] In an exemplary embodiment, the routing module 1420 is configured to perform: acquire the target second index in the target routing information; acquire the current second index corresponding to the current routing information; determine an index offset according to the target second index and the current second index; route the single-page sub-application based on the index offset.
[0189] In an exemplary embodiment, each piece of first routing information in the global routing record further includes the routing address of the base application when the first routing information is recorded; each piece of second routing information in the self-routing record further includes the routing address of the single-page sub-application when the second routing information is recorded.
[0190] The specific details of each module in the above application routing device have been described in detail in the implementation manner of the method part. The undisclosed detailed content can be referred to the implementation manner content of the method part. That is, the explanation and beneficial effects of the application routing method in the above embodiments are also applicable to the application routing device of the embodiments of the present disclosure, and will not be elaborated in detail here.
[0191] Furthermore, an embodiment of the present disclosure further provides an application routing method, which is applied to a base application. The base application maintains a global routing record. The single-page sub-applications in a single page are mounted to the base application. The single-page sub-applications maintain their own routing records, and when a routing event is triggered, report the routing information of the routing event to the base application to synchronize the routing information to the global routing record; as Figure 15 , the device includes:
[0192] An information receiving module 1510, configured to receive the self-routing record reported by the single-page sub-application; an information acquisition module 1520, configured to, if a browser event is monitored, acquire the target routing information corresponding to the browser event in the global routing record, and acquire the current routing information in the self-routing record reported by the single-page sub-application; a routing module 1530, configured to issue a routing instruction to the single-page sub-application according to the target routing information and the current routing information to instruct the single-page sub-application to perform routing.
[0193] In an exemplary embodiment, the device of the present disclosure embodiment further includes an information synchronization module, configured to perform: recording the initial routing information of the single-page sub-application in the global routing record.
[0194] In an exemplary embodiment, each piece of first routing information in the global routing record includes a first index and the routing state of the single-page sub-application when the first routing information is recorded; wherein, the first routing pointer is used to indicate the first routing information currently corresponding to the tab page, and the tab page includes a plurality of the single-page sub-applications; each piece of second routing information in the self-routing record includes a second index, and the second routing pointer is used to indicate the second routing information currently corresponding to the single-page sub-application.
[0195] In an exemplary embodiment, the information acquisition module 1510 is configured to perform: acquiring the currently first routing information indicated by the first routing pointer as the target routing information; acquiring the currently second routing information indicated by the second routing pointer as the current routing information.
[0196] In an exemplary embodiment, the routing module 1520 is configured to perform: acquiring the target second index in the target routing information; acquiring the current second index corresponding to the current routing information; determining an index offset according to the target second index and the current second index; and issuing a routing instruction to the single-page sub-application based on the index offset to instruct the single-page sub-application to route the single-page sub-application according to the index offset.
[0197] In an exemplary embodiment, the routing module 1520 is further configured to perform: in response to an operation of adding the routing state of the single-page sub-application to the first routing information indicated by the first routing pointer, keeping the indication position of the first routing pointer unchanged.
[0198] In an exemplary embodiment, the routing module 1520 is further configured to perform: in response to an operation of adjusting the routing address of the base application, adding first routing information to the global routing record, and adjusting the position of the first routing pointer to indicate the added first routing information; deleting the first routing information between the positions before and after the adjustment of the first routing pointer.
[0199] The specific details of each module in the above application routing device have been described in detail in the implementation manner of the method part. The details not disclosed can be seen in the implementation manner of the method part. That is, the explanation and beneficial effects of the application routing method in the above embodiments are also applicable to the application routing device of the present disclosure embodiment, and will not be elaborated in detail here.
[0200] Those skilled in the art can understand that various aspects of the present disclosure can be implemented as a system, a method, or a program product. Therefore, various aspects of the present disclosure can be specifically implemented in the following forms, namely: a complete hardware implementation, a complete software implementation (including firmware, microcode, etc.), or an implementation combining hardware and software aspects, which can be collectively referred to as "circuits", "modules", or "systems" here.
[0201] Reference will now be made to Figure 16 describe the electronic device 1600 according to such an embodiment of the present disclosure. Figure 16 The electronic device 1600 shown is merely an example and should not impose any limitation on the functions and scope of use of the embodiments of the present disclosure.
[0202] As Figure 16 shown, the electronic device 1600 is presented in the form of a general-purpose computing device. The components of the electronic device 1600 may include, but are not limited to: at least one of the above-mentioned processing units 1610, at least one of the above-mentioned storage units 1620, a bus 1630 connecting different system components (including the storage unit 1620 and the processing unit 1610), and a display unit 1640.
[0203] Among them, the storage unit stores program code, and the program code can be executed by the processing unit 1610, so that the processing unit 1610 executes the steps according to various exemplary embodiments of the present disclosure described in the above "Exemplary Method" section of this specification.
[0204] The storage unit 1620 may include a readable medium in the form of a volatile storage unit, such as a random access storage unit (RAM) 16201 and / or a cache storage unit 16202, and may further include a read-only storage unit (ROM) 16203.
[0205] The storage unit 1620 may further include a program / utility 16204 having a set (at least one) of program modules 16205. Such program modules 16205 include, but are not limited to: an operating system, one or more application programs, other program modules, and program data. The implementation of a network environment may be included in each or some combination of these examples.
[0206] The bus 1630 may represent one or more of several types of bus structures, including a storage unit bus or a storage unit controller, a peripheral bus, a graphics acceleration port, a processing unit, or a local bus using any bus structure in a variety of bus structures.
[0207] The electronic device 1600 can also communicate with one or more external devices 1700 (such as a keyboard, a pointing device, a Bluetooth device, etc.), and can also communicate with one or more devices that enable a user to interact with the electronic device 1600, and / or communicate with any device that enables the electronic device 1600 to communicate with one or more other computing devices (such as a router, a modem, etc.). Such communication can be carried out through the input / output (I / O) interface 1650. Moreover, the electronic device 1600 can also communicate with one or more networks (such as a local area network (LAN), a wide area network (WAN), and / or a public network, such as the Internet) through the network adapter 1660. As shown in the figure, the network adapter 1660 communicates with other modules of the electronic device 1600 through the bus 1630. It should be understood that, although not shown in the figure, other hardware and / or software modules can be used in combination with the electronic device 1600, including but not limited to: microcode, device drivers, redundant processing units, external disk drive arrays, RAID systems, tape drives, and data backup storage systems, etc.
[0208] In addition, the exemplary embodiments of the present disclosure also provide a computer-readable storage medium, on which a program product capable of implementing the above methods of this specification is stored. In some possible embodiments, various aspects of the present disclosure can also be implemented in the form of a program product, which includes program code. When the program product runs on a terminal device, the program code is used to cause the terminal device to execute the steps according to various exemplary embodiments described in the above "Exemplary Method" section of this specification.
[0209] It should be noted that the computer-readable medium shown in the present disclosure can be a computer-readable signal medium, a computer-readable storage medium, or any combination of the two. The computer-readable storage medium can be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination of the above. More specific examples of the computer-readable storage medium can include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above.
[0210] In this disclosure, a computer-readable storage medium can be any tangible medium that contains or stores a program, which can be used by or in conjunction with an instruction execution system, apparatus, or device. In this disclosure, a computer-readable signal medium can include a data signal propagated in a baseband or as part of a carrier wave, which carries computer-readable program code. Such a propagated data signal can take various forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the foregoing. A computer-readable signal medium can also be any computer-readable medium other than a computer-readable storage medium, which can send, propagate, or transmit a program for use by or in conjunction with an instruction execution system, apparatus, or device. The program code contained on the computer-readable medium can be transmitted using any appropriate medium, including but not limited to: wireless, wire, optical fiber cable, RF, etc., or any suitable combination of the foregoing.
[0211] In addition, the program code for performing the operations of this disclosure can be written in any combination of one or more programming languages, including object-oriented programming languages such as Java, C++, etc., and also including conventional procedural programming languages such as the "C" language or similar programming languages. The program code can be executed entirely on the user's computing device, partially on the user's device, executed as a stand-alone software package, partially on the user's computing device and partially on a remote computing device, or entirely on a remote computing device or server. In the case of a remote computing device, the remote computing device can be connected to the user's computing device through any type of network, including a local area network (LAN) or a wide area network (WAN), or, it can be connected to an external computing device (e.g., by using an Internet service provider to connect through the Internet).
[0212] Those skilled in the art will readily conceive of other embodiments of this disclosure after considering the specification and practicing the invention disclosed herein. This application is intended to cover any variations, uses, or adaptations of this disclosure, which follow the general principles of this disclosure and include known common knowledge or conventional technical means in this technical field not disclosed in this disclosure. The specification and embodiments are only regarded as exemplary, and the true scope and spirit of this disclosure are pointed out by the claims.
Claims
1. An application routing method, characterized in that, Applied to a single-page sub-application, the single-page sub-application maintains its own routing records and synchronizes the routing information of the routing event to the global routing record when a routing event is triggered; the method includes: If a global browser event is monitored, obtain the target routing information corresponding to the browser event in the global routing record, and obtain the current routing information in the own routing record; Route the single-page sub-application according to the target routing information and the current routing information.
2. The method according to claim 1, characterized in that, Before the step of if a global browser event is monitored, obtain the target routing information corresponding to the browser event in the global routing record, and obtain the current routing information in the own routing record, the method further includes: When the single-page sub-application is mounted to the base application, synchronize the initial routing information of the single-page sub-application in the global routing record; Wherein, when any single-page sub-application triggers a routing event, the routing information of the routing event is synchronized to the global routing record in the order of occurrence.
3. The method according to claim 1, characterized in that, Each first routing information in the global routing record includes a first index and the routing state of the single-page sub-application when the first routing information is recorded; Wherein, a first routing pointer is used to indicate the current first routing information corresponding to the tab page, and the tab page includes multiple single-page sub-applications.
4. The method according to claim 3, characterized in that, Each second routing information in the own routing record includes a second index, and a second routing pointer is used to indicate the current second routing information corresponding to the single-page sub-application; The step of when a routing event is triggered, synchronize the routing information of the routing event to the global routing record, includes: Determine the routing state of the single-page sub-application according to the identification information of the single-page sub-application and the second index of the routing event; Report the routing state of the single-page sub-application to the browser, so as to add a first routing information in the global routing record and generate a corresponding first index.
5. The method according to claim 4, characterized in that, The method further includes: In the first routing information added in the global routing record, retain the routing states of other single-page sub-applications that have not triggered routing events currently.
6. The method according to claim 4, characterized in that, The step of obtain the target routing information corresponding to the browser event in the global routing record, and obtain the current routing information in the own routing record, includes: Obtain the current first routing information indicated by the first routing pointer as the target routing information; Obtain the current second routing information indicated by the second routing pointer as the current routing information.
7. The method according to claim 6, characterized in that, The step of route the single-page sub-application according to the target routing information and the current routing information, includes: Obtain the target second index in the target routing information; Obtain the current second index corresponding to the current routing information; Determine an index offset according to the target second index and the current second index; Based on the index offset, route the single-page sub-application.
8. The method according to any one of claims 4 to 7, characterized in that, Each first routing information in the global routing record further includes the routing address of the base application when the first routing information is recorded; Each second routing information in the own routing record further includes the routing address of the single-page sub-application when the second routing information is recorded.
9. An application routing method, characterized in that, Applied to a base application that maintains a global routing record. A single-page sub-application in a single page is mounted to the base application. The single-page sub-application maintains its own routing record and, when a routing event is triggered, reports the routing information of the routing event to the base application to synchronize the routing information to the global routing record. The method includes: Receiving the self-routing record reported by the single-page sub-application; If a browser event is monitored, obtaining the target routing information corresponding to the browser event in the global routing record and obtaining the current routing information in the self-routing record reported by the single-page sub-application; Issuing a routing instruction to the single-page sub-application according to the target routing information and the current routing information to instruct the single-page sub-application to perform routing.
10. The method according to claim 9, characterized in that, Each piece of first routing information in the global routing record includes a first index and the routing state of the single-page sub-application when the first routing information is recorded. Among them, the first routing pointer indicates the first routing information currently corresponding to the tab page, and the tab page includes multiple single-page sub-applications; Each piece of second routing information in the self-routing record includes a second index, and the second routing pointer indicates the second routing information currently corresponding to the single-page sub-application.
11. The method according to claim 10, wherein, The method further includes: In response to an operation of adding the routing state of a single-page sub-application to the first routing information indicated by the first routing pointer, keeping the indication position of the first routing pointer unchanged.
12. The method according to claim 10, wherein, The method further includes: In response to an operation of adjusting the routing address of the base application, adding first routing information to the global routing record and adjusting the position of the first routing pointer to indicate the added first routing information; Deleting the first routing information between the positions before and after the adjustment of the first routing pointer.
13. An application routing device, characterized in that, Applied to a single-page sub-application that maintains its own routing record and, when a routing event is triggered, synchronizes the routing information of the routing event to the global routing record. The device includes: An information acquisition module for, if a global browser event is monitored, obtaining the target routing information corresponding to the browser event in the global routing record and obtaining the current routing information in the self-routing record; A routing module for routing the single-page sub-application according to the target routing information and the current routing information.
14. An application routing device, characterized in that, Applied to a base application that maintains a global routing record. A single-page sub-application in a single page is mounted to the base application. The single-page sub-application maintains its own routing record and, when a routing event is triggered, reports the routing information of the routing event to the base application to synchronize the routing information to the global routing record. The device includes: An information receiving module for receiving the self-routing record reported by the single-page sub-application; An information acquisition module for, if a browser event is monitored, obtaining the target routing information corresponding to the browser event in the global routing record and obtaining the current routing information in the self-routing record reported by the single-page sub-application; A routing module, configured to issue a routing instruction to the single-page sub-application according to the target routing information and the current routing information, so as to instruct the single-page sub-application to perform routing.
15. An electronic device, characterized in that, Comprising: A processor; And A memory, configured to store executable instructions of the processor; Wherein, the processor is configured to execute the method according to any one of claims 1 to 12 by executing the executable instructions.
16. A computer-readable storage medium, on which a computer program is stored, characterized in that, When the computer program is executed by a processor, the method according to any one of claims 1 to 12 is implemented.