Plug-in-based front-end page rendering method and system

Abstract

The invention provides a plug-in-based front-end page rendering method and system, and relates to the technical field of data processing, and the method comprises the steps: obtaining a system event, triggering a target route to jump, and generating an initial request parameter of the target route; analyzing the routing configuration information, judging whether predefined plug-in processing logic is included or not, if not, executing a default rendering process, and if yes, determining a plug-in list including plug-in types and priorities through a plug-in dependency analysis algorithm; when the pre-cut plug-in exists, processing the initial request parameter to generate a final request parameter; initiating a service request to the server based on the final request parameter and receiving original response data; when the back-cut plug-in exists, processing the original response data to generate final business data; and finally, injecting the final business data into the corresponding view component, and executing rendering logic to complete page display.

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of data processing, in particular to a front-end page rendering method and system based on plug-in. BACKGROUND

[0002] With the development of information technology, the field of front-end development is gradually evolving towards modularity, dynamization and low code. The existing mainstream front-end framework (such as React, Vue) has supported component-based development, which to some extent meets the reuse and expansion of system functions. However, for the individual customization needs of different users, it still mainly relies on code branches or configuration centers to achieve. At the same time, micro-front-end architecture and plug-in architecture are gradually popularized, but there are still limitations in dynamic loading, hot updating and remote debugging capabilities.

[0003] At present, the customization and maintenance of the front-end system are mainly realized by the following ways: one is to rely on pre-compiled or server-side rendering to complete module loading. The other is to maintain independent code branches to deliver to meet the customization needs of different customers.

[0004] However, the existing technology usually relies on branch management to meet the individual needs of different customers, which is prone to code redundancy and collaboration conflicts, and is difficult to efficiently support parallel development of multiple needs. In addition, for sudden problems that occur during running, engineers often need to debug and repair on site, which not only takes a long time, but also has high operation and maintenance costs, lacks timeliness and flexibility. SUMMARY

[0005] In view of the above deficiencies of the prior art, the purpose of the embodiments of the present application is to provide a front-end page rendering method based on plug-in, which can solve the technical problems that the existing technology usually relies on branch management to meet the individual needs of different customers, which is prone to code redundancy and collaboration conflicts, and is difficult to efficiently support parallel development of multiple needs. In addition, for sudden problems that occur during running, engineers often need to debug and repair on site, which not only takes a long time, but also has high operation and maintenance costs, lacks timeliness and flexibility.

[0006] The first aspect of the embodiments of the present application provides a front-end page rendering method based on plug-in, comprising: S1: obtaining a system event, triggering the jump of a target route based on the system event, and generating initial request parameters of the target route; S2: analyzing the configuration information of the target route, and judging whether the configuration information contains predefined plug-in processing logic; if yes, go to S3; otherwise, execute the default rendering process and go to S7; S3: determining a plug-in list containing plug-in types and plug-in priorities by a plug-in dependency analysis algorithm; S4: determining whether there is a pre-cut plug-in in the plug-in list; if yes, performing plug-in processing logic of the pre-cut plug-in to process the initial request parameter to generate a final request parameter; otherwise, taking the initial request parameter as the final request parameter; S5: based on the final request parameter, initiating a core business request to a server, and receiving original response data; S6: determining whether there is a post-cut plug-in in the plug-in list; if yes, performing plug-in processing logic of the post-cut plug-in to process the original response data to generate final business data; otherwise, taking the original response data as the final business data; S7: injecting the final business data into a corresponding view component, performing component rendering logic, and completing rendering of a page.

[0007] The second aspect of the embodiment of the application provides a front-end page rendering system based on plug-in, comprising a processor and a memory. The memory stores programs or instructions executable on the processor, and the programs or instructions are executed by the processor to implement the steps of the front-end page rendering method based on plug-in.

[0008] The third aspect of the embodiment of the application provides a readable storage medium, and the readable storage medium stores programs or instructions, and the programs or instructions are executed by a processor to implement the steps of the front-end page rendering method based on plug-in.

[0009] The technical scheme provided by the embodiment of the application has at least the following beneficial effects: In the embodiment of the application, the plug-in mechanism is introduced to replace the traditional branch management mode, the flexible processing of the request parameter and the modular extension of the business logic are realized, so that the code redundancy and the cooperation conflict are effectively avoided, and the efficiency of the multi-demand parallel development is improved; meanwhile, in the process of processing the core business request and the response data, the plug-in logic can be used to dynamically process the data, the adaptive ability to the sudden problems in operation is enhanced, the manual debugging and the operation and maintenance dependence are reduced, so that the flexibility and the timeliness of the system are improved, and the operation and maintenance cost is reduced. BRIEF DESCRIPTION OF DRAWINGS

[0010] The accompanying drawings are only for the purpose of illustrating specific embodiments and are not considered as limiting the application. Throughout the drawings, the same reference signs indicate the same components. Obviously, the accompanying drawings described below are only some embodiments described in the embodiments of the application, and other drawings can be obtained by those skilled in the art without creative labor on the basis of these drawings.

[0011] Figure 1 is a flowchart of a front-end page rendering method based on plug-in provided by an embodiment of the present application; Figure 2 is a structural diagram of a front-end page rendering system based on plug-in provided by an embodiment of the present application. DETAILED DESCRIPTION

[0012] In order for those skilled in the art to better understand the technical solutions in the embodiments of the present application, the technical solutions of the present application will be described clearly and completely below in conjunction with the drawings. Obviously, the described embodiments are only a part of the embodiments of the present application, rather than all the embodiments. It should be understood that these descriptions are only exemplary and are not used to limit the scope of the present application. Based on the embodiments of the present application, all other embodiments obtained by those skilled in the art without creative labor should belong to the scope of protection of the present application.

[0013] The front-end page rendering method based on plug-in provided by the embodiments of the present application will be described in detail below in conjunction with the drawings, specific embodiments and application scenarios.

[0014] Reference is made to the accompanying drawings Figure 1 , which shows a flowchart of a front-end page rendering method based on plug-in provided by an embodiment of the present application.

[0015] The embodiments of the present application provide a front-end page rendering method based on plug-in, which can include the following steps: S1: Obtain a system event, trigger the jump of a target route based on the system event, and generate initial request parameters of the target route.

[0016] Among them, the system event refers to an input signal that can trigger the front-end application route jump or the business logic execution, which is usually generated by user operation or system internal mechanism. For example, user clicks on the navigation menu, input query request, submits the form, and other interactive behaviors, as well as system timing task, message push, permission change and other internal events, which can be used as system events. After the system event is captured, it will be used as the starting point of the process to drive the loading of the target route and the execution of the subsequent plug-in processing logic.

[0017] S2: Analyze the configuration information of the target route, and determine whether the configuration information contains predefined plug-in processing logic. If yes, go to S3. Otherwise, execute the default rendering process and go to S7.

[0018] Among them, the plug-in processing logic refers to the extended function logic dynamically loaded and executed according to the configuration information of the target route in the process of running the front-end application.

[0019] In one possible implementation, S2 executes the default rendering process and goes to S7, which specifically includes: S201: initiating a service request to the server based on the initial request parameter.

[0020] S202: receiving original response data returned by the server.

[0021] S203: taking the original response data as the final service data and entering S7.

[0022] In the embodiment of the application, by analyzing and judging the target routing configuration information, when it is detected that there is no pre-defined plug-in processing logic, the system directly executes the default rendering process, that is, initiates a service request to the server based on the initial request parameter, receives the original response data and takes it as the final service data for page rendering. This method ensures that the front-end application can still run normally in the case of no plug-in configuration or plug-in unavailability, realizes the stability and compatibility of the system; at the same time, it avoids the additional plug-in loading overhead, improves the page response speed, and thus improves the user experience.

[0023] S3: determining a plug-in list containing plug-in types and plug-in priorities by a plug-in dependency analysis algorithm.

[0024] The plug-in dependency analysis algorithm refers to a process of collecting, filtering and sorting the plug-ins declared by the target routing and its parent routing during the runtime of the front-end application.

[0025] The plug-in list refers to a set of plug-ins that can be actually loaded and executed in the target routing after being processed by the plug-in dependency analysis algorithm during the runtime of the front-end application. The plug-in list not only contains the unique identifiers of the plug-ins, but also includes the types, priorities and merged configuration parameters of the plug-ins.

[0026] In a possible implementation, S3 specifically includes: S301: reading the plug-in IDs declared by the target routing and the parent routing of the target routing to form an initial plug-in list.

[0027] It should be noted that by reading the plug-in IDs declared by the target routing and its parent routing and forming an initial plug-in list, the inheritance and integrity of the plug-ins can be ensured, so that the plug-in logic declared by the upper routing can continue to take effect in the child routing, thereby improving the reusability of the system.

[0028] S302: performing a deduplication process on the duplicate plug-in IDs in the initial plug-in list.

[0029] S303: merging the configuration parameters of the same plug-in declared repeatedly by the merging strategy to form a first candidate plug-in list.

[0030] In a possible implementation, the merging strategy adopts shallow merging or overriding.

[0031] In the embodiment of the present application, the configuration parameters of the same plug-in declared repeatedly are merged by the merging strategy, which can guarantee the consistency of the plug-in functions, support the flexible coverage of different levels of configuration, and thus improve the flexibility and maintainability of the plug-in configuration.

[0032] S304: Construct context object information of the runtime.

[0033] Optionally, the context object includes user (role, permission, label), env (application version, device type, language, feature switch, etc.), route (parameter and query information), and app (application instance).

[0034] In the embodiment of the present application, the runtime context object is constructed, so that the plug-in can perceive user information, environment information, route information, and application instance, thereby realizing the dynamic loading of context awareness and enhancing the intelligent and customized capabilities of the system.

[0035] S305: Based on the plug-in ID of the plug-in, the metadata of each plug-in in the first candidate plug-in list is loaded asynchronously from the remote server, wherein the metadata includes the plug-in type, the priority, and the judgment function.

[0036] Specifically, the route guard (Route Guard) triggers the analysis process of the plug-in manager, and the manager collects all plug-in IDs declared on the current route chain (from the root route to the current route).

[0037] S306: Based on the context object information, the condition judgment function of each plug-in in the first candidate plug-in list is executed, and it is judged whether the returned result is successful. If yes, the corresponding plug-in is retained. Otherwise, the corresponding plug-in is removed to form a second candidate plug-in list.

[0038] In the embodiment of the present application, the condition judgment function of the plug-in is executed and the plug-in is filtered accordingly, which can ensure that only the plug-in meeting the current running environment and business scenario is retained, realize the on-demand loading of the plug-in, and thus improve the efficiency and reliability of the system running.

[0039] S307: According to the plug-in type and the priority, the execution order of each plug-in in the second candidate plug-in list is set.

[0040] It should be noted that the priority is the same, and the relative order is determined according to the stability rule (such as the declaration order).

[0041] S308: According to the execution order, each plug-in in the second candidate plug-in list is sorted to determine the plug-in list containing the plug-in type and the plug-in priority.

[0042] Specifically, the plugins field is read from the meta configuration of the current route, and all parent routes of the plugins field are recursively looked up to aggregate all declared plugins to form an initial plugin list. This step ensures the inheritability of the plugins. The same plugin can be declared in multiple levels of routes. The algorithm needs to deduplicate according to the plugin ID and merge its configuration parameters. The merging strategy usually adopts shallow merging or overriding. The conditional loading strategy is executed for each plugin in the list. According to the runtime environment, the plugins that do not meet the loading conditions are filtered out to generate a final plugin list that needs to be loaded. Priority sorting: after completing the dependency sorting, the plugins without dependency relationship are sorted according to the priority attribute explicitly declared by them. The plugin with high priority is executed first.

[0043] It should be noted that the present application designs a complete aspect programming scheme. The scheme supports three intervention modes: (1) PRE_HOOK intervention, which can modify the input parameters or variables before the method is executed by proxying the original method, typical applications include: forced modification of API request parameters, adjustment of configuration default values, etc.; (2) POST_HOOK intervention, which can process the output result again by intercepting the method return value, typical applications include: data format conversion, additional monitoring log, exception handling, etc.; (3) REPLACE, which allows complete rewriting of business logic or replacement of UI components while maintaining the interface compatibility of the original components. These intervention modes are implemented through dynamic code injection without modifying the original code. Through the synergistic effect of multiple innovations, the dynamic, customized and operable front-end application is realized. Compared with the traditional scheme, significant improvements have been made in development efficiency, operation cost and user experience.

[0044] In a possible implementation, S3 further comprises the following steps after S3: S3A: determining whether there is a function replacement plugin in the plugin list. If yes, the function replacement plugin takes over the processing flow to generate the final business data, and S7 is entered. Otherwise, S4 is entered.

[0045] In a possible implementation, the function replacement plugin takes over the processing flow to generate the final business data in S3A specifically comprises the following steps: S3A1: calling the function replacement plugin and transferring the complete context control right to the function replacement plugin.

[0046] S3A2: the function replacement plugin independently completes the request initiation and response data processing based on the context to output the final business data.

[0047] Specifically, if the plug-in type is a function replacement plug-in, the default process is completely taken over; the function replacement plug-in is called, and the complete context control right including the initial request parameter is handed over to it. The plug-in independently completes the entire process from request initiation, data processing to final result generation initiated from its internal logic. It can completely rewrite the business logic, or selectively call back the default method. The output of this step is also a certain final business data.

[0048] In the embodiment of the application, by introducing the function replacement plug-in, when it is detected that the function replacement plug-in exists, the system hands over the complete context control right of the processing flow to the plug-in, and independently completes request initiation, data processing and result generation by the plug-in, so as to realize complete replacement of the default business logic. This method not only avoids direct modification of the core code, guarantees the stability and maintainability of the system, but also can flexibly customize the logic according to different customers or business scenarios, realizes rapid iteration and personalized expansion. Meanwhile, the function replacement plug-in can be dynamically updated through remote loading, so that the system has the ability of non-perception upgrade and remote repair, significantly reduces the operation and maintenance cost and improves the user experience.

[0049] S4: It is judged whether the front-cut plug-in exists in the plug-in list. If yes, the plug-in processing logic of the front-cut plug-in is executed to process the initial request parameter to generate the final request parameter. Otherwise, the initial request parameter is taken as the final request parameter.

[0050] In a possible implementation, the processing of the initial request parameter by the plug-in processing logic of the front-cut plug-in in S4 to generate the final request parameter specifically includes: S401: The front-cut plug-in is called, and the initial request parameter is taken as the input to execute the plug-in processing logic of the front-cut plug-in.

[0051] S402: The output result of the front-cut plug-in is received.

[0052] S403: The output result of the front-cut plug-in is parsed to judge whether the initial request parameter is modified. If yes, the parameter in the output result is used to replace the initial request parameter to obtain the final request parameter. Otherwise, the initial request parameter is taken as the final request parameter.

[0053] In the embodiment of the application, by introducing the front-cut plug-in logic, the system can preprocess the initial request parameter before the business request is initiated, call the front-cut plug-in and parse the output result, can modify or enhance the request parameter according to the business needs, which on the one hand guarantees the correctness and integrity of the request parameter, reduces the risk of request failure; on the other hand provides flexible parameter customization capability for different customers or business scenarios, realizes the extensible control of the request link, and thus improves the security, compatibility and adaptability of the system.

[0054] S5: initiating a core business request to the server based on the final request parameter, and receiving original response data.

[0055] The original response data refers to a response result returned directly by the server without any plugin processing after the front-end application initiates a business request to the server based on the final request parameter. The data usually contains core information required by the business, such as query results, status codes, user information, or configuration parameters.

[0056] It should be noted that the final request parameter is used to initiate an asynchronous data request to the server. This step is a key node that connects the previous step and the next step, and the request content is determined by the front plugin chain.

[0057] In the embodiment of the application, by using the final request parameter to initiate a core business request to the server and receiving original response data, it can be ensured that the system initiates a request according to the customized and verified parameters after completing the processing of the front plugin chain, thereby improving the accuracy of the request and the reliability of the business execution.

[0058] S6: determining whether there is a post-cut plugin in the plugin list. If yes, executing the plugin processing logic of the post-cut plugin to process the original response data and generating final business data. Otherwise, taking the original response data as the final business data.

[0059] It should be noted that the final business data refers to a deterministic data result that can be directly used for page rendering, obtained through the preprocessing of the request parameter by the front-cut plugin, the original response data returned by the server, and the processing of the post-cut plugin or the functional replacement plugin after the front-end application completes the core business request. The data usually meets the needs of business display or interaction.

[0060] In a possible implementation, the execution of the plugin processing logic of the post-cut plugin in S6 to process the original response data and generate the final business data specifically includes: S601: calling the post-cut plugin and executing the plugin processing logic of the post-cut plugin with the original response data as input.

[0061] S602: receiving the output result of the post-cut plugin.

[0062] S603: analyzing the output result of the post-cut plugin to determine whether the original response data has been processed. If yes, replacing or merging the original response data with the data returned by the post-cut plugin to form the final business data. Otherwise, taking the original response data as the final business data.

[0063] Optionally, the original response data is processed, which can include filtering sensitive fields, adding status codes, or standardizing the data conversion.

[0064] In the embodiment of the application, the post-cut plug-in is called and the output result thereof is parsed, so that the response data can be filtered, converted or enhanced, for example, sensitive fields are removed, status identifiers are added, or data structures are standardized, thereby ensuring the security, integrity and consistency of business data. This way not only improves the system's ability to adapt to different business scenarios, but also enables the final business data to be output in a form that is more in line with the needs of front-end rendering and interaction, reducing the additional processing overhead of the front-end component, thereby improving overall efficiency and user experience.

[0065] S7: inject the final business data into the corresponding view component, execute the component rendering logic, and complete the rendering of the page.

[0066] It should be noted that the view component refers to an independent interface module in the front-end application for receiving final business data and executing rendering logic. It is usually composed of component units provided by frameworks (such as React, Vue, etc.), and can convert the input data into visual user interface elements. The view component is not only responsible for displaying the processed business results, but also can implement interactive functions such as table display, form submission, chart drawing or status prompt according to business logic.

[0067] In the embodiment of the application, the view component serves as the carrier of the final business data, ensuring that the results of the data processing link can be presented to the user in an intuitive, dynamic and scalable manner.

[0068] The technical scheme provided by the embodiment of the application has at least the following beneficial effects: In the embodiment of the application, the plug-in mechanism is introduced to replace the traditional branch management mode, realizing flexible processing of request parameters and modular extension of business logic, thereby effectively avoiding code redundancy and collaboration conflicts, improving the efficiency of multi-demand parallel development; at the same time, the system can dynamically process data with the help of plug-in logic in the process of processing core business requests and response data, enhancing the self-adaptive ability to sudden problems in operation, reducing the dependence on manual debugging and operation and maintenance, thereby improving the flexibility and timeliness of the system and reducing the operation and maintenance cost.

[0069] Reference is made to the accompanying drawings Figure 2 , which shows a structural schematic diagram of a front-end page rendering system based on plug-in provided by an embodiment of the application.

[0070] An embodiment of the application provides a front-end page rendering system based on plug-in 20, comprising a processor 201 and a memory 202. The memory 202 stores programs or instructions executable on the processor 201, which, when executed by the processor 201, implement the steps of the above-described plug-in-based front-end page rendering method and achieve the same technical effects. To avoid repetition, the present application will not repeat the same.

[0071] It should be understood that the processor 201 in the embodiments of the present application can be a central processing unit (CPU), and can also be other general-purpose processors, digital signal processors (DSP), application specific integrated circuits (ASIC), field programmable gate arrays (FPGA) or other programmable logic devices, discrete gates or transistor logic devices, discrete hardware components, etc. The general-purpose processor can be a microprocessor or can also be any conventional processor.

[0072] It should also be understood that the memory 202 in the embodiments of the present application can be a volatile memory or a non-volatile memory, or can include both volatile and non-volatile memories. The non-volatile memory can be a read-only memory (ROM), a programmable ROM (PROM), an erasable PROM (EPROM), an electrically EPROM (EEPROM), or a flash memory. The volatile memory can be a random access memory (RAM) used as an external cache. By way of example, but not limitation, many forms of random access memory (RAM) are available, such as static random access memory (SRAM), dynamic random access memory (DRAM), synchronous dynamic random access memory (SDRAM), double data rate SDRAM (DDR SDRAM), enhanced SDRAM (ESDRAM), synchlink DRAM (SLDRAM), and direct rambus RAM (DR RAM).

[0073] The above-described embodiments can be implemented in part or in whole through software, hardware (e.g., circuitry), firmware, or any combination thereof. When implemented in software, the above-described embodiments can be implemented in the form of a computer program product. The computer program product includes one or more computer instructions or computer programs. When loaded and executed by a computer, the computer instructions or computer programs cause the computer to perform the processes or functions described above according to the embodiments of the present application. The computer can be a general-purpose computer, a special-purpose computer, a computer network, or other programmable apparatus. The computer instructions can be stored in a computer-readable storage medium or transmitted from one computer-readable storage medium to another computer-readable storage medium, such as from a website, a computer, a server, or a data center to another website, computer, server, or data center through a wired (e.g., infrared, wireless, microwave, etc.) manner. The computer-readable storage medium can be any available medium or a collection of medium accessible by a computer or a data storage device such as a server, data center, etc. that contains one or more medium. The medium can be a magnetic medium (e.g., a floppy diskette, a hard disk, a magnetic tape), an optical medium (e.g., a DVD), or a semiconductor medium. The semiconductor medium can be a solid state disk.

[0074] It should be understood that the size of the sequence number of each process described above does not mean the order of execution, and the execution order of each process should be determined according to its function and inherent logic, and should not constitute any limitation on the implementation process of the embodiments of the present application.

[0075] Those of ordinary skill in the art can realize that the units and algorithm steps of the examples described in conjunction with the embodiments disclosed herein can be realized in electronic hardware, or a combination of computer software and electronic hardware. Whether the functions are performed in hardware or software depends on the specific application and design constraints of the technical solution. A person skilled in the art can use different methods to implement the described functions for each specific application, but such implementation should not be considered beyond the scope of the present application.

[0076] Those skilled in the art can clearly understand that, for the convenience and brevity of description, the specific working processes of the above-described devices, apparatuses, and units can refer to the corresponding processes in the foregoing method embodiments, which will not be described here.

[0077] In several embodiments provided by the present application, it should be understood that the disclosed devices, apparatuses and methods can be implemented in other manners. For example, the embodiments of the apparatus described above are merely schematic. For example, the division of the units is only a logical function division. There can be another division manner for the actual implementation. For example, a plurality of units or components can be combined or integrated into another device, or some features can be ignored or not executed. In addition, the displayed or discussed mutual couplings or direct couplings or communication connections between different units, can be indirect couplings or communication connections through some interfaces, devices or units, and can be in electrical, mechanical or other forms.

[0078] The units described as separate components can or can not be physically separate, and the components shown as units can or can not be physical units, i.e., can be located in one place, or can be distributed on a plurality of network units. Some or all of the units can be selected according to actual needs to achieve the purpose of the embodiment.

[0079] In addition, each functional unit in each embodiment of the present application can be integrated into a processing unit, or each unit can be physically present separately, or two or more units can be integrated into one unit.

[0080] If the functions are realized in the form of software function units and sold or used as independent products, they can be stored in a computer readable storage medium. Based on this understanding, the technical solutions of the present application or the parts of the present application that essentially contribute to the prior art or the parts of the technical solutions can be embodied in the form of a software product. The computer software product is stored in a storage medium and includes a plurality of instructions for causing a computer device (which can be a personal computer, a server, or a network device, etc.) to execute all or part of the steps of the method described in each embodiment of the present application. The aforementioned storage medium includes: a U disk, a mobile hard disk, a read-only memory (ROM), a random access memory (RAM), a magnetic disk or an optical disk, and various media that can store program codes.

[0081] The embodiment of the present application provides a readable storage medium, which includes: a program or instructions stored on the readable storage medium, the program or instructions are executed by a processor to realize the steps of the front-end page rendering method based on the plug-in provided above, and the same technical effects can be achieved. To avoid repetition, the present application will not be described again.

[0082] It should be pointed out finally that the above embodiments are only used to illustrate the technical solutions of the embodiments of the present application, but not to limit them. Although the present application has been described in detail with reference to the foregoing embodiments, it should be understood by those skilled in the art that the technical solutions recorded in the foregoing embodiments can be modified, or some technical features can be replaced equivalently; and these modifications or replacements do not make the essence of the corresponding technical solutions deviate from the spirit and scope of the technical solutions of the embodiments of the present application. Any changes or replacements that can be easily thought of by those skilled in the art within the technical scope disclosed by the present application should be covered within the protection scope of the present application.

Claims

1. A plug-in based front-end page rendering method, characterized in that, The method comprises the following steps: S1: acquiring a system event, triggering a jump of a target route based on the system event, and generating initial request parameters of the target route; S2: analyzing configuration information of the target route, and determining whether the configuration information contains predefined plug-in processing logic; if yes, S3 is entered; otherwise, a default rendering process is executed, and S7 is entered; S3: determining a plug-in list containing plug-in types and plug-in priorities by using a plug-in dependency analysis algorithm; S4: determining whether there is a pre-cut plug-in in the plug-in list; if yes, the initial request parameters are processed by using plug-in processing logic of the pre-cut plug-in to generate final request parameters; otherwise, the initial request parameters are taken as the final request parameters; S5: based on the final request parameters, a core business request is initiated to a server, and original response data is received; S6: determining whether there is a post-cut plug-in in the plug-in list; if yes, the original response data are processed by using plug-in processing logic of the post-cut plug-in to generate final business data; otherwise, the original response data are taken as the final business data; S7: the final business data are injected into a corresponding view component, a component rendering logic is executed, and page rendering is completed. The default rendering process in S2 is specifically as follows: S201: a business request is initiated to the server based on the initial request parameters; S202: original response data returned by the server are received; S203: the original response data are taken as the final business data, and S7 is entered.

2. The plug-in based front-end page rendering method according to claim 1, wherein, S3 specifically comprises the following steps: S301: reading plug-in IDs declared by the target route and a parent route of the target route to form an initial plug-in list; S302: removing duplicate plug-in IDs in the initial plug-in list; S303: by using a merging strategy, configuration parameters of the same plug-in declared repeatedly are merged to form a first candidate plug-in list; 3. The plug-in based front-end page rendering method according to claim 1, wherein, S304: constructing context object information of a runtime; S305: based on the plug-in IDs of the plug-ins, metadata of each plug-in in the first candidate plug-in list is asynchronously loaded from a remote server, wherein the metadata comprises a plug-in type, a priority, and a judgment function; S306: based on the context object information, a condition judgment function of each plug-in in the first candidate plug-in list is executed, and it is determined whether the returned result is successful; if yes, the corresponding plug-in is retained; otherwise, the corresponding plug-in is removed to form a second candidate plug-in list; S307: according to the plug-in type and the priority, an execution order of each plug-in in the second candidate plug-in list is set; S308: according to the execution order, each plug-in in the second candidate plug-in list is sorted to determine a plug-in list containing plug-in types and plug-in priorities. The merging strategy adopts shallow merging or covering. After S3, the following step is further included: S3A: determining whether there is a function replacement plug-in in the plug-in list; if yes, the function replacement plug-in takes over the processing flow to generate the final business data, and S7 is entered; otherwise, S4 is entered. ​ 4. The plug-in based front-end page rendering method of claim 1, wherein, ​ 5. The plug-in based front-end page rendering method according to claim 1, wherein, ​ ​ 6. The plug-in based front-end page rendering method according to claim 5, wherein, The function replacement plug-in in the S3A takes over the processing flow, and generating the final service data specifically includes: S3A1: calling the function replacement plug-in, and handing over the complete context control right to the function replacement plug-in; S3A2: the function replacement plug-in independently completes the request initiation and response data processing based on the context information, and outputs the final service data.

7. The plug-in based front-end page rendering method according to claim 1, wherein, The plug-in processing logic of the front plug-in in the S4 processes the initial request parameter, and generating the final request parameter specifically includes: S401: calling the front plug-in, and taking the initial request parameter as input, and executing the plug-in processing logic of the front plug-in; S402: receiving the output result of the front plug-in; S403: analyzing the output result of the front plug-in, and judging whether the initial request parameter is modified; if yes, using the parameter in the output result to cover the initial request parameter to obtain the final request parameter; otherwise, taking the initial request parameter as the final request parameter.

8. The plug-in based front-end page rendering method according to claim 1, wherein, The plug-in processing logic of the back plug-in in the S6 processes the original response data, and generating the final service data specifically includes: S601: calling the back plug-in, and taking the original response data as input to execute the plug-in processing logic of the back plug-in; S602: receiving the output result of the back plug-in; S603: analyzing the output result of the back plug-in, and judging whether the original response data is processed; if yes, using the data returned by the back plug-in to replace or merge the original response data to form the final service data; otherwise, taking the original response data as the final service data.

9. A plug-in based front-end page rendering system, characterized in that, including: a processor and a memory; The memory stores programs or instructions that can be run on the processor, and the programs or instructions are executed by the processor to realize the steps of the plug-in-based front-end page rendering method according to any one of claims 1 to 8.

10. A readable storage medium, characterized by, The readable storage medium stores programs or instructions, and the programs or instructions are executed by the processor to realize the steps of the inverter exception detection method according to any one of claims 1 to 8.

Images