CN-122018896-A - Front-end application customization method, system, electronic device and computer readable medium

CN122018896ACN 122018896 ACN122018896 ACN 122018896ACN-122018896-A

Abstract

Embodiments of the present disclosure disclose front-end application customization methods, systems, electronic devices, and computer readable media. The method comprises the steps of loading and running a standard front-end application with a built-in declarative hook call point, obtaining a custom plug-in unit containing custom logic based on hook registration, monitoring a hook event triggered by the standard application through a plug-in bridging module, determining and executing callback logic in the corresponding plug-in unit when a target hook event is triggered, and dynamically modifying an interface or a behavior of the standard front-end application through a set of application program interfaces. The application program interface comprises element control, life cycle hook registration and dynamic expansion interfaces. The implementation mode realizes complete decoupling of standard products and custom logic through the declarative hook and plug-in architecture, and supports dynamic, safe and reliable deep customization in running.

Inventors

ZHANG ZAIPING
YANG GANG
ZHENG YONGKE
ZHU WEI
WANG JINBO

Assignees

北京方寸无忧科技发展有限公司

Dates

Publication Date: 20260512
Application Date: 20260227

Claims (10)

1. A front-end application customization method, comprising: loading and running a standard front-end application, wherein the standard front-end application comprises a plurality of declarative hook call points; obtaining at least one custom plug-in, wherein the custom plug-in comprises custom logic registered based on the declarative hook call site; monitoring a declarative hook event triggered by the standard front-end application; in response to monitoring a target declarative hook event, determining a target custom plug-in which callback logic corresponding to the target declarative hook event is registered from the at least one custom plug-in; And executing the callback logic in the target customization plug-in to dynamically modify the user interface element or the behavior of the standard front-end application through an application program interface provided by the callback logic.
2. The method according to claim 1, wherein the method further comprises: Providing a plug-in development suite to a plug-in developer, the plug-in development suite encapsulating and exposing the application program interface; wherein, the application program interface at least comprises: An element control interface for performing visibility control or content replacement on user interface elements in the standard front-end application according to a predefined positioning path; A lifecycle hook registration interface for registering the callback logic at a lifecycle node of a specific user interface component of the standard front-end application; and the dynamic expansion interface is used for dynamically registering new page routing or injecting new components into the standard front-end application.
3. The method of claim 2, wherein the dynamically modifying user interface elements or behaviors of the standard front-end application through an application program interface provided by the callback logic comprises: Generating, by the element control interface, a virtual document object model node based on the positioning path, the virtual document object model node being used to describe a modification operation to a target user interface element; And mapping and applying the virtual document object model nodes to an actual document object model of the standard front-end application through a renderer to complete the dynamic modification.
4. The method of claim 1, wherein prior to executing the callback logic in the target custom plug-in, further comprising: receiving a ready waiting request for a target positioning path; monitoring the triggering state of a declarative hook event corresponding to the target positioning path in the standard front-end application; in response to determining that the corresponding declarative hook event has triggered, callback logic associated with the target location path is permitted to be executed.
5. The method of claim 1, wherein the obtaining at least one customized plug-in comprises: Providing a visual arrangement interface, wherein the visual arrangement interface is used for receiving a customization operation configured by a user in a non-programming mode; converting the configured customization operation into a structured customization logic description file; loading and interpreting the custom logic description file as one of the at least one custom plug-in.
6. The method of claim 1 or 5, wherein the executing the callback logic in the target custom plug-in comprises: code to run the target custom plug-in a stand-alone plug-in sandboxed environment; And intercepting and limiting unauthorized access operation of the target customized plug-in to the host environment according to a permission list predefined for the target customized plug-in.
7. The method according to claim 1, wherein the method further comprises: Managing the dependency relationship among a plurality of custom plug-ins, and determining the loading sequence or the execution sequence of the custom plug-ins according to the dependency relationship; An inter-plug-in communication mechanism is provided to enable a first customized plug-in to publish events or data to a second customized plug-in.
8. A front-end application customization system, comprising: A standard front-end application module configured to load and run a standard front-end application, the standard front-end application comprising a plurality of declarative hook call sites; A plug-in acquisition module configured to acquire at least one custom plug-in containing custom logic registered based on the declarative hook call site; An event listening module configured to listen for declarative hook events triggered by the standard front end application; A plug-in determination module configured to determine, from the at least one custom plug-in, a target custom plug-in which callback logic corresponding to the target declarative hook event is registered, in response to listening for the target declarative hook event; and the logic execution module is configured to execute the callback logic in the target customization plug-in so as to dynamically modify the user interface element or the behavior of the standard front-end application through an application program interface provided by the callback logic.
9. An electronic device, comprising: one or more processors; a storage device having one or more programs stored thereon; The one or more programs, when executed by the one or more processors, cause the one or more processors to implement the method of any of claims 1-7.
10. A computer readable storage medium, on which a computer program is stored, characterized in that the program, when being executed by a processor, implements the method according to any of claims 1-7.

Description

Front-end application customization method, system, electronic device and computer readable medium Technical Field The embodiment of the disclosure relates to the technical field of computer software, in particular to the fields of front-end Web application development, software architecture and runtime extension, and particularly relates to a front-end application plugin method, a system and related equipment supporting dynamic customization. Background In an enterprise-level software service (SaaS) scenario, a standardized set of front-end application products is typically required to service numerous customers with differentiated requirements. These customers often require personalized customization of standard product user interfaces, function modules, or interaction flows, such as hiding specific function buttons, replacing business terms, replacing theme styles, and even adding unique business pages. The traditional customization scheme mainly comprises the following two steps of firstly judging hard coding customization logic in a product source code through conditions, causing rapid expansion of a trunk code, disordered version branches and extremely high maintenance cost, and secondly injecting static configuration in an application construction stage, wherein customization contents are solidified in a release package and cannot be dynamically adjusted according to user identities, authorities or scenes in operation, and further cannot support structural expansion such as newly added pages or components. In recent years, micro front end architectures have been used to decouple large applications, but they are coarse-grained, complex to deploy, too cumbersome for the large, lightweight, high frequency interface customization requirements, introducing significant performance and complexity overhead. Thus, the prior art lacks a front-end dynamic customization scheme that enables fine granularity, secure controllability, and complete decoupling from standard code at application runtime. This results in a series of technical problems such as slow customization response, reduced code quality, difficulty in maintaining multiple versions, inability to construct an open custom ecology, etc. Disclosure of Invention The disclosure is in part intended to introduce concepts in a simplified form that are further described below in the detailed description. The disclosure is not intended to identify key features or essential features of the claimed subject matter, nor is it intended to be used to limit the scope of the claimed subject matter. Some embodiments of the present disclosure propose front-end application customization methods, systems, electronic devices, and computer readable media to solve the technical problems mentioned in the background section above. In a first aspect, some embodiments of the present disclosure provide a front-end application customization method, the method comprising loading and running a standard front-end application, the standard front-end application comprising a plurality of declarative hook call points, obtaining at least one customization plug-in, the customization plug-in comprising customization logic registered based on the declarative hook call points, listening for declarative hook events triggered by the standard front-end application, determining a target customization plug-in from the at least one customization plug-in, in response to listening for target declarative hook events, in which callback logic corresponding to the target declarative hook events is registered, executing the callback logic in the target customization plug-in, so as to dynamically modify user interface elements or behaviors of the standard front-end application through an application program interface provided by the callback logic. In a second aspect, some embodiments of the present disclosure provide a front-end application customization system, the system comprising a standard front-end application module configured to load and run a standard front-end application, the standard front-end application comprising a plurality of declarative hook call sites, a plug-in acquisition module configured to acquire at least one customization plug-in, the customization plug-in comprising customization logic registered based on the declarative hook call sites, an event monitoring module configured to monitor declarative hook events triggered by the standard front-end application, a plug-in determination module configured to determine a target customization plug-in from the at least one customization plug-in that has registered callback logic corresponding to the target declarative hook events, and a logic execution module configured to execute the callback logic in the target customization plug-in to dynamically modify user interface elements or behaviors of the standard front-end application through an application program interface provided by the callback logic. In a third aspect, some embodiments o