Web page control generation method, device, equipment and storage medium
By obtaining the program module set and bridge selected by the client developer, determining the initialization rules and injection rules, and generating web controls, the problems of code duplication and increased number of interaction methods in hybrid development are solved, and efficient web control management and maintenance are achieved.
Patent Information
- Application Number
- CN202111444703.X
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2021-11-30
- Publication Date
- 2025-09-12
- Estimated Expiration
- 2041-11-30
AI Technical Summary
In hybrid development, there are problems with code duplication and the number of interactive methods increases rapidly, making it difficult to manage and maintain.
By obtaining the program module set and bridge selected by the client developer, the initialization rule and injection rule are determined according to the bridge to generate the web page control.
It solves the management and maintenance difficulties caused by code duplication and the increase in the number of interaction methods, and realizes efficient web page control generation.
Smart Images

Figure CN114115830B_ABST
Abstract
Description
Technical Field
[0001] Embodiments of the present invention relate to the field of computer technology, and in particular to a web page control generation method, apparatus, device, and storage medium. Background Art
[0002] With the rapid development and popularization of mobile internet and smart devices, the number of users of mobile apps, the number of R&D personnel involved in developing business functions, and the number of application business modules and functions are growing. Simultaneously, businesses are increasingly demanding the speed and frequency of version updates. Given the significant improvements in hardware performance and network speeds in recent years, hybrid development techniques have become a key means of improving version iteration efficiency and rapidly responding to business launch requirements.
[0003] Using hybrid development to generate web controls will have the following problems: 1. A large amount of duplicate code will appear. 2. As the business grows, the number of interaction methods and code will increase rapidly, making it difficult to manage and maintain. Summary of the Invention
[0004] The embodiments of the present invention provide a web page control generation method, apparatus, device and storage medium, which not only solve the problem of code duplication, but also solve the problem of difficulty in management and maintenance due to the rapid increase in the number of interaction methods and code. The web page control can be generated according to the selected program module set and bridge.
[0005] In a first aspect, an embodiment of the present invention provides a method for generating a web page control, comprising:
[0006] Obtaining a set of program modules and a bridge selected by a client developer;
[0007] determining an initialization rule and an injection rule according to the bridge;
[0008] A web page control is generated according to the initialization rule, the injection rule and the program module set.
[0009] In a second aspect, an embodiment of the present invention further provides a web page control generating device, the device comprising:
[0010] Acquisition module, used to obtain the program module set and bridge selected by the client developer;
[0011] a determination module, configured to determine an initialization rule and an injection rule according to the bridge;
[0012] A generation module is used to generate a web page control according to the initialization rule, the injection rule and the program module set.
[0013] In a third aspect, an embodiment of the present invention further provides an electronic device, comprising a memory, a processor, and a computer program stored in the memory and executable on the processor, wherein when the processor executes the program, the method described in any one of the embodiments of the present invention is implemented.
[0014] In a fourth aspect, an embodiment of the present invention further provides a computer-readable storage medium having a computer program stored thereon, which, when executed by a processor, implements any method described in the embodiments of the present invention.
[0015] The embodiment of the present invention obtains a program module set and a bridge selected by a client developer; determines initialization rules and injection rules based on the bridge; and generates a web page control based on the initialization rules, the injection rules, and the program module set. This solves the problem of code duplication and the problem of difficulty in management and maintenance due to the rapid increase in the number of interaction methods and code. The web page control can be generated according to the selected program module set and bridge. BRIEF DESCRIPTION OF THE DRAWINGS
[0016] In order to more clearly illustrate the technical solutions of the embodiments of the present invention, the following briefly introduces the drawings required for use in the embodiments. It should be understood that the following drawings only illustrate certain embodiments of the present invention and therefore should not be regarded as limiting the scope. For ordinary technicians in this field, other relevant drawings can be obtained based on these drawings without paying any creative work.
[0017] Figure 1 is a flow chart of a method for generating a web page control in an embodiment of the present invention;
[0018] Figure 1a This is a diagram of the overall client architecture in an embodiment of the present invention;
[0019] Figure 1b is a schematic diagram of the interaction between the front end and the client in an embodiment of the present invention;
[0020] Figure 2 It is a structural diagram of a web page control generating device in an embodiment of the present invention;
[0021] Figure 3 is a schematic structural diagram of an electronic device in an embodiment of the present invention;
[0022] Figure 4 It is a structural diagram of a computer-readable storage medium containing a computer program in an embodiment of the present invention. DETAILED DESCRIPTION
[0023] The present invention will be further described in detail below with reference to the accompanying drawings and examples. It will be understood that the specific embodiments described herein are intended only to illustrate the present invention and are not intended to limit the present invention. It should also be noted that, for ease of description, the accompanying drawings only illustrate portions relevant to the present invention, not all of the structures. Furthermore, the embodiments of the present invention and the features of the embodiments may be combined with one another unless otherwise specified.
[0024] It should be mentioned before discussing exemplary embodiments in more detail that some exemplary embodiments are described as processes or methods depicted as flow charts. Although flow charts describe various operations (or steps) as sequential processes, many operations therein can be implemented in parallel, concurrently or simultaneously. In addition, the order of various operations can be rearranged. When its operation is completed, the process can be terminated, but can also have additional steps not included in the accompanying drawings. The process can correspond to methods, functions, procedures, subroutines, subprograms, etc. In addition, the features in the embodiments of the present invention and the embodiments can be combined with each other without conflict.
[0025] The term "including" and its variations used in the present invention are open inclusions, that is, "including but not limited to." The term "based on" means "based at least in part on." The term "one embodiment" means "at least one embodiment."
[0026] It should be noted that similar reference numerals and letters represent similar items in the following drawings. Therefore, once an item is defined in one drawing, it does not need to be further defined or explained in subsequent drawings. At the same time, in the description of the present invention, the terms "first", "second", etc. are used only to distinguish the description and should not be understood as indicating or implying relative importance.
[0027] Figure 1 This is a flow chart of a web page control generation method provided by an embodiment of the present invention. This embodiment is applicable to the case of web page control generation. The method can be executed by a web page control generation device in an embodiment of the present invention. The device can be implemented in software and / or hardware. Figure 1 As shown, the method specifically includes the following steps:
[0028] S110 , obtaining a program module set and a bridge selected by a client developer.
[0029] The program modules are pre-built basic modules, and each program module includes at least one interaction method.
[0030] Specifically, a code repository containing multiple program modules is pre-built, a client developer selects at least one program module from the code repository, a program module set is determined based on the at least one program module selected by the client developer, and a bridge is obtained.
[0031] In a specific example, after the client developer opens the interface, the code repository area and the editing area are displayed in the interface. The client developer drags the program module icon in the code repository area to the editing area. After the client developer clicks the OK control, the program module icon selected by the client developer is obtained, and a program module set is generated based on the program module icon selected by the client developer, and the bridge selected by the client developer is obtained.
[0032] S120: Determine an initialization rule and an injection rule according to the bridge.
[0033] The initialization rule and the injection rule are rules pre-packaged into the bridge.
[0034] The initialization rule is used to initialize the program modules in the program module set, and the injection rule is used to inject the initialized program modules into the container, thereby obtaining the web page control.
[0035] Specifically, the method for determining the initialization rules and injection rules based on the bridge may include: obtaining pre-agreed interaction data, wherein the interaction data includes at least one of the following: a front-end technology stack name, an interaction interface name, basic fields, a response code, and an error code; creating a component project; determining the initialization rules and injection rules based on the front-end technology stack name; and encapsulating the initialization rules, injection rules, and interaction data into the component project to obtain a bridge. The initialization rules and injection rules encapsulated in the bridge are obtained.
[0036] S130: Generate a webpage control according to the initialization rule, the injection rule, and the program module set.
[0037] Specifically, the method of generating a web page control according to the initialization rule, the injection rule and the program module set can be: initializing the program modules in the program module set according to the initialization rule; creating a new container; and injecting the initialized program modules into the container based on the injection rule to obtain the web page control.
[0038] Optionally, generating a webpage control according to the initialization rule, the injection rule, and the program module set includes:
[0039] Initializing the program modules in the program module set according to the initialization rule;
[0040] Create a new container;
[0041] The initialized program module is injected into the container based on the injection rule to obtain a web page control.
[0042] Specifically, the program modules in the program module set are initialized according to the initialization rule. For example, if the program module set includes: program module A, program module B and program module C, the program module A is initialized according to the initialization rule, the program module B is initialized according to the initialization rule, and the program module C is initialized according to the initialization rule.
[0043] Specifically, the initialized program module is injected into the container based on the injection rule to obtain the webpage control. For example, the initialized program module A, the initialized program module B, and the initialized program module C are injected into the container based on the injection rule to obtain the webpage control.
[0044] Optionally, injecting the initialized program module into the container based on the injection rule to obtain the webpage control includes:
[0045] Upon detecting a user's touch operation on a target application, obtaining a webpage address corresponding to the target application;
[0046] Querying a configuration file according to the web page address, obtaining a target program module corresponding to the web page address;
[0047] The target program module is injected into the container to obtain a web page control.
[0048] The configuration file is pre-configured, and different applications correspond to different configuration files. The configuration file pre-stores program modules corresponding to different web page addresses.
[0049] Specifically, if a user touch operation on a target application is detected, the method for obtaining the webpage address corresponding to the target application can be: if a user click operation on an icon corresponding to the target application is detected, the configuration file corresponding to the target application and the webpage address corresponding to the target application are obtained.
[0050] Among them, the method of querying the configuration file according to the web address can be: the configuration file stores the correspondence between the web address and the program module, and the configuration file is queried according to the web address to obtain the target program module corresponding to the web address. For example, the configuration file can store: web address A corresponds to program module A, web address B corresponds to program module B, web address C corresponds to program module C. If the web address corresponding to the target application is web address A, then the configuration file is queried according to web address A to obtain program module A corresponding to web address A.
[0051] In an example, the configuration file stores: web page address A corresponds to program module A and program module B, web page address B corresponds to program module B and program module C, and web page address C corresponds to program module C and program module D. If the web page address corresponding to the target application is web page address A, the configuration file is queried according to web page address A to obtain program module A and program module B corresponding to web page address A, and program module A and program module B are determined as target program modules, and program module A and program module B are injected into the container to obtain a web page control.
[0052] Optionally, also include:
[0053] Get parameter information entered by front-end developers;
[0054] Generate a target page according to the parameter information.
[0055] The parameter information input by the front-end developer may include: module name and function name.
[0056] Specifically, a method of generating a target page according to the parameter information may be: determining a target program module name and a target function name according to the parameter information; and generating a target page according to the parameter information, the target program module name and the target function name.
[0057] Optionally, generating a target page according to the parameter information includes:
[0058] Determine the target program module name and the target function name according to the parameter information;
[0059] A target page is generated according to the parameter information, the target program module name and the target function name.
[0060] The program module includes at least one function. For example, program module A may include: a first function, a second function, a third function, and a fourth function.
[0061] Specifically, the target program module name and the target function name are determined according to the parameter information. For example, the target function may be determined to be the first function in program module A according to the parameter information.
[0062] Specifically, the target page may be generated according to the parameter information, the target program module name and the target function name by obtaining the target function according to the target program module name and the target function name, and generating the target page according to the target function and the parameter information.
[0063] Optionally, before obtaining the program module set and bridge selected by the client developer, the following is also included:
[0064] Obtaining pre-agreed interaction data, wherein the interaction data includes: at least one of a front-end technology stack name, an interaction interface name, basic fields, a response code, and an error code;
[0065] Create component projects;
[0066] Determine initialization rules and injection rules based on the name of the front-end technology stack;
[0067] The initialization rule, injection rule and interaction data are encapsulated into the component project to obtain a bridge.
[0068] The response code may be a preset response code, and the error code may be a preset error code. It should be noted that the response code and the error code are different, and the embodiment of the present invention does not limit this.
[0069] The front-end technology stack may be at least one of Web, RN, Weex, and Flutter.
[0070] The bridge can dynamically load program modules through a routing path.
[0071] In an example, the present invention proposes an overall application architecture design based on hybrid and pure native coexistence, which includes a client overall architecture design with five levels: app shell project, business layer, public layer (interface layer), component layer Library, and remote warehouse. Figure 1a As shown, where:
[0072] Shell project: Contains only the configuration, description, and version information of dependent modules. It is the entry point for application initialization.
[0073] Business layer: It is divided into two parts: native and hybrid. Native is the implementation of pure client functions, while hybrid is the implementation of basic functions provided by the client to the front end, such as code scanning, face recognition, and device permissions.
[0074] Public layer (interface layer): only contains the interface interfaces and entity classes exposed to the outside between modules, external interface protocols, and enumeration classes.
[0075] Component layer: Library: The underlying layer of business implementation dependencies, mostly encapsulating calls to open source projects or third-party SDKs. For example, it encapsulates network request services and the GSON library for parsing JSON.
[0076] Component layer AAR: Most of them are stable open source projects that can be directly relied upon, and third-party SDKs from cooperative suppliers, such as zxing, OCR, and speech recognition.
[0077] The above overall client architecture design breaks down the client into components and business modules. Front-end applications can access the corresponding component functionality based on business needs. This is a fundamental design that addresses the issue of the front-end's dependence on client updates, which prevents clients with older versions from using new native capabilities and conflicts with the real-time update nature of the front-end. Furthermore, in subsequent version iterations based on this architectural design, code additions will achieve a "high cohesion, low coupling" structure at the physical level based on business logic, fundamentally addressing the difficulty in management and maintenance caused by the rapid increase in the number of interaction methods and code as the business grows.
[0078] The embodiment of the present invention also provides a solution to bridge the gap between different front-end technology stacks and native interactions, such as Figure 1b As shown, this solution refers to the design of retrofit and spring-boot, decoupling through interfaces and providing bridges for various front-end technology stacks (jsp, vue, react-native). It provides a unified method implementation for different front-end technology stacks and clients, while supporting the expansion of subsequent mini-programs. The front-end JavaScript layer writes the corresponding implementation based on the native bridge, and based on the basic services and business goals provided by the existing client, it is split into three levels: modules, features, and methods. Solution users can focus on business functions and write corresponding functional implementations according to the agreed interfaces. They do not need to worry about the direct differences between iOS and Android clients, nor do they need to worry about the differences in interactions between Vue, react-native, and weex and the client. Based on this solution, a set of basic client capabilities will be reused to provide services for various front-end technology stacks, which will solve the problem of code duplication due to differences in interaction methods.
[0079] This embodiment of the present invention provides a highly reusable, component-based solution that can be directly used across various hybrid development projects. This means that different business project teams within the same app, as well as different project teams across different apps, can select the required program modules to rely on and access and utilize the corresponding native capabilities. This embodiment analyzes commonly used basic services and business functions, further breaking down the front-end JavaScript service layer into three levels: modules, features, and methods. The implementation of these methods adheres to principles such as service atomicity, high reusability, asynchronous responses, JSON entity class interaction, and transparent error message transmission. This embodiment currently includes 18 commonly used basic modules and implements 118 native interaction methods, covering multiple areas including basic mobile phone information, mobile multimedia services, camera face recognition, microphone voice recognition, mobile OCR QR code scanning, 4G / 5G / Wi-Fi network requests, low-level C language encryption and decryption, and password key controls. These basic modules have been packaged into independent functional components through an automated CI / CD pipeline. Android clients can access components from a Maven repository using Gradle script dependencies. iOS clients can access the framework using the Cocoapod install method. Front-end projects can access js-package via the scaffolding npm install method. The existing basic capabilities of the embodiments of this invention have all passed unit testing, business testing, automation testing, and compatibility testing. Each of these basic capabilities has been deployed and implemented by various project teams within the bank. After code compilation, it is managed through a code repository. The host app only needs to access it in a black-box manner and call the API, eliminating the need for manual code migration. This solves the problem of manually migrating existing framework and business implementation code to new projects when adding new apps and implementing hybrid development.
[0080] Embodiments of the present invention provide a plug-in-based dynamic update solution that allows for dynamic loading and unloading of existing online modules, as well as dynamic addition and modification of existing modules. During the development process, multiple people often collaborate on modular development, and project teams desire to independently run their own modules without being affected by others' modules. A common requirement is the rapid product iteration process, where project teams often want to seamlessly integrate new features into user phones. Excessively frequent product iterations or excessively long development cycles can cause mobile phone products to lose competitive advantage. Pluginization divides the client into a host and plug-in components. During client runtime, project teams can dynamically load or replace plug-in components. Embodiments of the present invention provide a client container framework that primarily supports componentization, dynamism, and decoupling, addressing various issues during the coding phase, client runtime, and subsequent maintenance and repair phases. During the engineering phase, it enables independent project development, debugging, and module independence. During runtime, it implements complete component lifecycle mapping and class isolation mechanisms. During maintenance, it provides rapid incremental updates and repairs, enabling fast upgrades. The plug-in capabilities of the embodiments of this invention enable platform-based / middleware-based web control generation, reducing R&D costs, improving development efficiency, and rapidly building stable, high-quality mobile applications. Based on a componentized architecture, the introduction of plug-in hot update technology allows the native app client to share the same hot update capabilities as the front-end. This resolves the issue of the front-end relying on native client updates, preventing older clients from using new native capabilities and contradicting the real-time update nature of the front-end.
[0081] The technical solution of this embodiment obtains the program module set and bridge selected by the client developer; determines the initialization rules and injection rules based on the bridge; and generates a web page control based on the initialization rules, the injection rules, and the program module set. This not only solves the problem of code duplication, but also solves the problem of difficulty in management and maintenance due to the rapid increase in the number of interaction methods and code. The web page control can be generated according to the selected program module set and bridge.
[0082] Figure 2 This is a schematic diagram of the structure of a web page control generation device provided by an embodiment of the present invention. This embodiment is applicable to the case of web page control generation. The device can be implemented in software and / or hardware. The device can be integrated into any device that provides web page control generation function, such as Figure 2 As shown, the webpage control generating device specifically includes: an acquisition module 210 , a determination module 220 and a generation module 230 .
[0083] The acquisition module 210 is used to acquire the program module set and bridge selected by the client developer;
[0084] a determination module 220, configured to determine an initialization rule and an injection rule according to the bridge;
[0085] The generating module 230 is configured to generate a web page control according to the initialization rule, the injection rule and the program module set.
[0086] Optionally, the generating module is specifically configured to:
[0087] Initializing the program modules in the program module set according to the initialization rule;
[0088] Create a new container;
[0089] The initialized program module is injected into the container based on the injection rule to obtain a web page control.
[0090] The above-mentioned product can execute the method provided by any embodiment of the present invention, and has the corresponding functional modules and beneficial effects of the execution method.
[0091] The technical solution of this embodiment obtains the program module set and bridge selected by the client developer; determines the initialization rules and injection rules based on the bridge; and generates a web page control based on the initialization rules, the injection rules, and the program module set. This not only solves the problem of code duplication, but also solves the problem of difficulty in management and maintenance due to the rapid increase in the number of interaction methods and code. The web page control can be generated according to the selected program module set and bridge.
[0092] Figure 3 This is a structural diagram of an electronic device provided in Example 3 of the present invention. Figure 3 A block diagram of an electronic device 312 suitable for implementing embodiments of the present invention is shown. Figure 3 The electronic device 312 shown is only an example and should not limit the functionality and scope of use of the embodiments of the present invention. The device 312 is a typical computing device for trajectory fitting.
[0093] like Figure 3 As shown, electronic device 312 is implemented as a general purpose computing device. Components of electronic device 312 may include, but are not limited to, one or more processors 316, storage device 328, and a bus 318 connecting various system components (including storage device 328 and processor 316).
[0094] Bus 318 represents one or more of several types of bus structures, including a memory bus or memory controller, a peripheral bus, an accelerated graphics port, a processor, or a local bus using any of a variety of bus architectures. Examples of these architectures include, but are not limited to, an Industry Standard Architecture (ISA) bus, a Micro Channel Architecture (MCA) bus, an Enhanced ISA bus, a Video Electronics Standards Association (VESA) local bus, and a Peripheral Component Interconnect (PCI) bus.
[0095] The electronic device 312 typically includes a variety of computer system readable media. These media can be any available media that can be accessed by the electronic device 312, including volatile and non-volatile media, removable and non-removable media.
[0096] The storage device 328 may include computer system readable media in the form of volatile memory, such as random access memory (RAM) 330 and / or cache memory 332. The electronic device 312 may further include other removable / non-removable, volatile / non-volatile computer system storage media. By way of example only, the storage system 334 may be used to read and write non-removable, non-volatile magnetic media ( Figure 3 Not shown, often called a "hard drive"). Although Figure 3 Not shown, a disk drive for reading and writing to a removable non-volatile disk (e.g., a floppy disk) and an optical disk drive for reading and writing to a removable non-volatile optical disk (e.g., a Compact Disc-Read Only Memory (CD-ROM), a Digital Video Disc-Read Only Memory (DVD-ROM), or other optical media) may be provided. In these cases, each drive may be connected to bus 318 via one or more data media interfaces. Storage device 328 may include at least one program product having a set (e.g., at least one) of program modules configured to perform the functions of various embodiments of the present invention.
[0097] A program 336 having a set (at least one) of program modules 326 may be stored, for example, in a storage device 328. Such program modules 326 include, but are not limited to, an operating system, one or more application programs, other program modules, and program data, each of which, or some combination thereof, may include an implementation of a network environment. Program modules 326 generally implement the functions and / or methods of the embodiments described herein.
[0098] The electronic device 312 can also communicate with one or more external devices 314 (e.g., a keyboard, pointing device, camera, display 324, etc.), one or more devices that enable a user to interact with the electronic device 312, and / or any device that enables the electronic device 312 to communicate with one or more other computing devices (e.g., a network card, a modem, etc.). This communication can occur via an input / output (I / O) interface 322. Furthermore, the electronic device 312 can communicate with one or more networks (e.g., a local area network (LAN), a wide area network (WAN), and / or a public network such as the Internet) via a network adapter 320. As shown, the network adapter 320 communicates with other modules of the electronic device 312 via a bus 318. It should be understood that, although not shown, other hardware and / or software modules can be used in conjunction with the electronic device 312, including but not limited to microcode, device drivers, redundant processing units, external disk drive arrays, Redundant Arrays of Independent Disks (RAID) systems, tape drives, and data backup storage systems.
[0099] The processor 316 executes various functional applications and data processing by running the programs stored in the storage device 328, such as implementing the web page control generation method provided in the above embodiment of the present invention:
[0100] Obtaining a set of program modules and a bridge selected by a client developer;
[0101] determining an initialization rule and an injection rule according to the bridge;
[0102] A web page control is generated according to the initialization rule, the injection rule and the program module set.
[0103] Figure 4This is a schematic diagram of the structure of a computer-readable storage medium containing a computer program in an embodiment of the present invention. This embodiment of the present invention provides a computer-readable storage medium 61 on which a computer program 610 is stored. When executed by one or more processors, the program implements the webpage control generation method provided in all embodiments of the present invention:
[0104] Obtaining a set of program modules and a bridge selected by a client developer;
[0105] determining an initialization rule and an injection rule according to the bridge;
[0106] A web page control is generated according to the initialization rule, the injection rule and the program module set.
[0107] Any combination of one or more computer-readable media can be used. A computer-readable medium can be a computer-readable signal medium or a computer-readable storage medium or any combination of the two. A computer-readable storage medium can be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or component, or any combination of the above. More specific examples (a non-exhaustive list) of computer-readable storage media include: 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. In this document, a computer-readable storage medium can be any tangible medium that contains or stores a program that can be used by or in combination with an instruction execution system, device or device.
[0108] A computer-readable signal medium may include a data signal propagated in baseband or as part of a carrier wave, which carries computer-readable program code. Such propagated data signals may take various forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination thereof. A computer-readable signal medium may also be any computer-readable medium other than a computer-readable storage medium that can transmit, propagate, or transport a program for use by or in conjunction with an instruction execution system, apparatus, or device.
[0109] Program code embodied on a computer readable medium may be transmitted using any appropriate medium, including but not limited to wireless, wireline, optical fiber cable, RF, etc., or any suitable combination of the foregoing.
[0110] In some embodiments, the client and server can communicate using any currently known or future developed network protocol, such as HTTP (Hypertext Transfer Protocol), and can be interconnected with any form or medium of digital data communication (e.g., a communication network). Examples of communication networks include a local area network ("LAN"), a wide area network ("WAN"), an internet (e.g., the Internet), and a peer-to-peer network (e.g., an ad hoc peer-to-peer network), as well as any currently known or future developed network.
[0111] The computer-readable medium may be included in the electronic device, or may exist independently without being incorporated into the electronic device.
[0112] The computer program code for performing the operations of the present invention can be written in one or more programming languages, or a combination thereof, including object-oriented programming languages such as Java, Smalltalk, C++, and conventional procedural programming languages such as "C" or similar programming languages. The program code can be executed entirely on the user's computer, partially on the user's computer, as a stand-alone software package, partially on the user's computer and partially on a remote computer, or entirely on a remote computer or server. In cases involving a remote computer, the remote computer can be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or can be connected to an external computer (e.g., through the Internet using an Internet service provider).
[0113] The flowcharts and block diagrams in the accompanying drawings illustrate the possible implementation architecture, functions and operations of the systems, methods and computer program products according to various embodiments of the present disclosure. In this regard, each box in the flowchart or block diagram can represent a module, program segment, or a part of code, and the module, program segment, or a part of code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the box can also occur in a different order than that marked in the accompanying drawings. For example, two boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each box in the block diagram and / or flowchart, and the combination of the boxes in the block diagram and / or flowchart, can be implemented with a dedicated hardware-based system that performs the specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.
[0114] The units involved in the embodiments described in this disclosure may be implemented in software or hardware, wherein the name of a unit does not necessarily limit the unit itself.
[0115] The functions described above herein may be performed, at least in part, by one or more hardware logic components. For example, and without limitation, exemplary types of hardware logic components that may be used include: field programmable gate arrays (FPGAs), application specific integrated circuits (ASICs), application specific standard products (ASSPs), systems on chip (SOCs), complex programmable logic devices (CPLDs), and the like.
[0116] In the context of the present disclosure, a machine-readable medium can be a tangible medium that can contain or store a program for use by or in conjunction with an instruction execution system, device or equipment. A machine-readable medium can be a machine-readable signal medium or a machine-readable storage medium. A machine-readable medium can include, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or equipment, or any suitable combination of the foregoing. A more specific example of a machine-readable storage medium can include an electrical connection based on one or more lines, 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 foregoing.
[0117] Note that the above are only preferred embodiments of the present invention and the technical principles employed. Those skilled in the art will appreciate that the present invention is not limited to the specific embodiments described herein, and that various obvious changes, readjustments, and substitutions are possible for those skilled in the art without departing from the scope of the present invention. Therefore, although the present invention has been described in detail through the above embodiments, the present invention is not limited to the above embodiments and may include many other equivalent embodiments without departing from the scope of the present invention. The scope of the present invention is determined by the scope of the appended claims.
Claims
1. A web page control generation method, characterized in that: include: Obtaining a set of program modules and a bridge selected by a client developer; determining an initialization rule and an injection rule according to the bridge; Generate a webpage control according to the initialization rule, the injection rule and the program module set; Wherein, determining the initialization rule and the injection rule according to the bridge includes: obtaining the initialization rule and the injection rule encapsulated in the bridge; The step of generating a webpage control according to the initialization rule, the injection rule, and the program module set includes: Initializing the program modules in the program module set according to the initialization rule; Create a new container; Injecting the initialized program module into the container based on the injection rule to obtain a web page control; Before obtaining the program module set and bridge selected by the client developer, the following steps are also included: Obtaining pre-agreed interaction data, wherein the interaction data includes: at least one of a front-end technology stack name, an interaction interface name, basic fields, a response code, and an error code; Create component projects; Determine initialization rules and injection rules based on the name of the front-end technology stack; The initialization rule, injection rule and interaction data are encapsulated into the component project to obtain a bridge.
2. The method according to claim 1, characterized in that Injecting the initialized program module into the container based on the injection rule to obtain a webpage control includes: Upon detecting a user's touch operation on a target application, obtaining a webpage address corresponding to the target application; Querying a configuration file according to the web page address, obtaining a target program module corresponding to the web page address; The target program module is injected into the container to obtain a web page control.
3. The method according to claim 1, characterized in that Also includes: Get parameter information entered by front-end developers; Generate a target page according to the parameter information.
4. The method according to claim 3, characterized in that Generating a target page according to the parameter information includes: Determine the target program module name and the target function name according to the parameter information; A target page is generated according to the parameter information, the target program module name and the target function name.
5. A web page control generating device, characterized in that: include: Acquisition module, used to obtain the program module set and bridge selected by the client developer; a determination module, configured to determine an initialization rule and an injection rule according to the bridge; A generation module, configured to generate a web page control according to the initialization rule, the injection rule, and the program module set; The determining module is specifically configured to: obtain the initialization rules and injection rules encapsulated in the bridge; The generating module is specifically used for: Initializing the program modules in the program module set according to the initialization rule; Create a new container; Injecting the initialized program module into the container based on the injection rule to obtain a web page control; Wherein, the device is further used for: Before obtaining the program module set and the bridge selected by the client developer, obtaining pre-agreed interaction data, wherein the interaction data includes at least one of: a front-end technology stack name, an interaction interface name, basic fields, a response code, and an error code; Create component projects; Determine initialization rules and injection rules based on the name of the front-end technology stack; The initialization rule, injection rule and interaction data are encapsulated into the component project to obtain a bridge.
6. An electronic device, characterized in that: include: one or more processors; a memory for storing one or more programs; When the one or more programs are executed by the one or more processors, the processors are enabled to implement the method according to any one of claims 1 to 4.
7. A computer-readable storage medium containing a computer program, wherein the computer program is stored thereon, characterized in that: When the program is executed by one or more processors, the method according to any one of claims 1 to 4 is implemented.
Citation Information
Patent Citations
A device for automatically realizing visual reuse of a Web system
CN109325203A
Page rendering method and device
CN111158818A