Method and device for registering front-end data stream status file

By using preset code templates and configuration files to generate data flow state file code in the react-redux front-end framework, and using the registry to compile and register, the problem of missing file registration and redundant code is solved, and the project's compilation and loading efficiency is improved.

CN113254019BActive Publication Date: 2025-05-16BEIJING WODONG TIANJUN INFORMATION TECH CO LTD +1
View PDF 2 Cites 0 Cited by

Patent Information

Application Number
CN202010084744.1
Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2020-02-10
Publication Date
2025-05-16
Estimated Expiration
2040-02-10

AI Technical Summary

Technical Problem

In the prior art, when registering data flow state files in the react-redux front-end framework, problems of missing file registration and redundant code are prone to occur, resulting in project compilation errors and slow packaging loading speed.

Method used

The file code and configuration file of the front-end data flow state file are generated through preset code templates and configuration files, and the file code is compiled with the preset registrant to register the front-end data flow state file.

Benefits of technology

It realizes the rapid generation of file code, avoids project compilation errors and code redundancy, and improves project packaging and loading speed.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN113254019B_ABST
    Figure CN113254019B_ABST
Patent Text Reader

Abstract

The present invention discloses a method and device for registering a front-end data stream status file, and relates to the field of computer technology. A specific implementation of the method includes: generating a file code of a front-end data stream status file according to a preset code template; generating a configuration file of the front-end data stream status file according to a preset configuration file; and compiling the file code according to the configuration file and a preset registration machine to register the front-end data stream status file. On the one hand, this implementation can realize the rapid generation of file code, avoiding the problem of project compilation error caused by manual code generation errors or file registration omissions, and on the other hand, it can greatly reduce the size of the code and improve the speed of project packaging and loading.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present invention relates to the field of computer technology, and in particular to a method and device for registering a front-end data stream status file. Background Art

[0002] The implementation of standard services of react-redux (a front-end framework) requires the registration of many data flow state files, such as actions files (code for listening to various trigger events), reducers files (code for modifying the old data flow state to generate a new data flow state according to the trigger event), Store files (code for saving the new data flow state), etc. Figure 1 This is a schematic diagram of the data flow in the react-redux front-end framework. In the figure, in response to the page trigger event (action), Action Creators forward the action to the Store, which is dispatch (action) in the figure; Store is a public area for saving and managing event topics. Store forwards the current state (previousState in the figure) and the received action to Reducers, and Reducers return a new data flow state (newState) after processing and feedback to Store. React Components render the front-end page according to the new data flow state.

[0003] In the prior art, each file is often registered manually or by copying and modifying existing codes to obtain a corresponding code file.

[0004] In the process of implementing the present invention, the inventors found that there are at least the following problems in the prior art:

[0005] (1) File registration is often missed, resulting in project compilation failure and error reporting;

[0006] (2) Invalid copying and pasting, as well as redundant code, cause the project package size to become larger and larger, and the packaging and loading speeds to be slow. Summary of the invention

[0007] In view of this, an embodiment of the present invention provides a method and device for registering a front-end data stream status file, which can, on the one hand, realize the rapid generation of file code and avoid project compilation errors caused by manual code generation errors or missing file registration, and on the other hand, can greatly reduce the size of the code and improve the speed of project packaging and loading.

[0008] To achieve the above object, according to one aspect of an embodiment of the present invention, a method for registering a front-end data stream status file is provided, comprising:

[0009] Generate the file code of the front-end data flow status file according to the preset code template;

[0010] Generate a configuration file for the front-end data stream state file according to a preset configuration file;

[0011] The file code is compiled according to the configuration file and a preset registration machine to register the front-end data stream status file.

[0012] Optionally, based on a preset code template, file code for the front-end data flow status file is generated, including: extracting variable parameters from user input information, replacing placeholders corresponding to the variable parameters in the preset code file with the variable parameters, and generating file code for the front-end data flow status file; determining a project address based on user input information, and writing the file code into the project address based on file flow operations.

[0013] Optionally, before compiling the file code according to the configuration file and the preset registration machine, it also includes: using a factory mode to abstract the front-end data stream state file into a registration machine.

[0014] Optionally, the preset registration machine includes a download status attribute.

[0015] According to a second aspect of an embodiment of the present invention, there is provided a device for registering a front-end data stream status file, comprising:

[0016] A code generator module generates file codes for front-end data stream status files according to preset code templates;

[0017] The file configuration module generates a configuration file of the front-end data stream status file according to a preset configuration file; and compiles the file code according to the configuration file and a preset registration machine to register the front-end data stream status file.

[0018] Optionally, the code generation module generates the file code of the front-end data stream state file according to a preset code template, including:

[0019] Extract variable parameters from user input information, replace placeholders corresponding to the variable parameters in the preset code file with the variable parameters, and generate file code for the front-end data stream status file; determine the project address according to the user input information, and write the file code into the project address based on the file stream operation.

[0020] Optionally, the code compilation module is further used to: before compiling the file code according to the configuration file and the preset registration machine, use a factory mode to abstract the front-end data stream state file into a registration machine.

[0021] Optionally, the preset registration machine includes a download status attribute.

[0022] According to a third aspect of an embodiment of the present invention, there is provided an electronic device for registering a front-end data stream status file, comprising:

[0023] one or more processors;

[0024] a storage device for storing one or more programs,

[0025] When the one or more programs are executed by the one or more processors, the one or more processors implement the method provided in the first aspect of the embodiment of the present invention.

[0026] According to a fourth aspect of an embodiment of the present invention, a computer-readable medium is provided, on which a computer program is stored, and when the program is executed by a processor, the method provided by the first aspect of the embodiment of the present invention is implemented.

[0027] An embodiment of the above invention has the following advantages or beneficial effects: by registering the front-end data stream status file according to the preset code template and configuration file, on the one hand, it can realize the rapid generation of file code and avoid project compilation errors caused by manual code generation errors or missing file registration, and on the other hand, it can greatly reduce the size of the code and improve the speed of project packaging and loading.

[0028] The further effects of the above-mentioned non-conventional optional manner will be described below in conjunction with the specific implementation manner. BRIEF DESCRIPTION OF THE DRAWINGS

[0029] The accompanying drawings are used to better understand the present invention and do not constitute an improper limitation of the present invention.

[0030] Figure 1 This is a schematic diagram of the data flow in the react-redux front-end framework;

[0031] Figure 2 It is a schematic diagram of the main process of the method for registering a front-end data stream status file according to an embodiment of the present invention;

[0032] Figure 3 It is a schematic diagram of main modules of the device for registering a front-end data stream status file according to an embodiment of the present invention;

[0033] Figure 4 is an exemplary system architecture diagram to which embodiments of the present invention may be applied;

[0034] Figure 5 It is a schematic diagram of the structure of a computer system of a terminal device or a server suitable for implementing an embodiment of the present invention. DETAILED DESCRIPTION

[0035] The following is a description of exemplary embodiments of the present invention in conjunction with the accompanying drawings, including various details of the embodiments of the present invention to facilitate understanding, which should be considered as merely exemplary. Therefore, it should be recognized by those of ordinary skill in the art that various changes and modifications may be made to the embodiments described herein without departing from the scope and spirit of the present invention. Similarly, for clarity and conciseness, the description of well-known functions and structures is omitted in the following description.

[0036] According to one aspect of an embodiment of the present invention, a method for registering a front-end data stream status file is provided.

[0037] Figure 2 FIG. 1 is a schematic diagram of the main process of the method for registering a front-end data stream status file according to an embodiment of the present invention. Figure 2 As shown, the method for registering a front-end data stream status file includes: step S201, step S202 and step S203.

[0038] Step S201: Generate a file code of a front-end data stream status file according to a preset code template.

[0039] In the embodiment of the present invention, a code template is pre-generated based on a plurality of front-end data flow state files, and the preset code template includes common parts in the plurality of front-end data flow state files, such as interface fields, method name fields, etc. Non-common parts in the plurality of front-end data flow state files can be obtained through user input in the form of variables, such as interface names, method names, etc.

[0040] Generate the file code of the front-end data flow status file according to the preset code template. On the one hand, it can realize the rapid generation of file code and avoid project compilation errors caused by manual code generation errors or missing file registration. On the other hand, it can avoid invalid copying and pasting, redundant code, greatly reduce the size of the code, and improve the speed of project packaging and loading.

[0041] Optionally, based on a preset code template, file code for the front-end data flow status file is generated, including: extracting variable parameters from user input information, replacing placeholders corresponding to the variable parameters in the preset code file with the variable parameters, and generating file code for the front-end data flow status file; determining a project address based on user input information, and writing the file code into the project address based on file flow operations.

[0042] In this example, there is a variable parameter "method name" in the preset code model. When generating a code file, the user enters the method name through the command line, and the method name entered by the user replaces the placeholder in the corresponding position in the code template to obtain the file code. Entering variable parameters through the command line and combining the preset code template to generate file code can greatly improve the speed of file code generation.

[0043] Step S202: Generate a configuration file for the front-end data stream status file according to a preset configuration file.

[0044] The preset configuration file is a template for configuring each method. The preset configuration file can define the required attributes and non-required attributes of the method to be registered. The specific content of the required attributes and non-required attributes can be set selectively. The required attributes may include: the name of the method to be defined (funName), such as "getList"; the remote service address, such as " / xz / api / xxxx / getList"; the request type (method), such as get, post, delete (get, post, delete are the information interaction methods defined in http respectively); the event type (actionType), such as "GET_TEST_LIST"; the name of the reducer (reducerName), such as "testList". Non-required attributes may include: method description (desc); success prompt (tip), such as "operation successful"; error prompt (errorTip), such as "operation failed".

[0045] In actual application, you can add the methods that the project needs to call to the preset configuration file to get the configuration file of the project, and you can also modify and delete the methods in the configuration file. If you need to add a new method or interface, just add it in the preset configuration file according to the format.

[0046] According to the preset configuration file, you can easily manage the remote service address, request type and other properties required by the project through configuration, manage the interfaces in a unified manner, facilitate viewing and maintenance, and allow developers to focus more on implementing business logic.

[0047] Step S203, compile the file code according to the configuration file and a preset registration machine (a software tool for analyzing and modifying internal program information of software) to register the front-end data stream status file.

[0048] In this step, the configuration file is passed into the preset registration machine as a parameter of the preset registration machine, thereby dynamically realizing the registration of all front-end data flow status files.

[0049] Optionally, before compiling the file code according to the configuration file and the preset registration machine, the method further includes: abstracting the front-end data stream state file into a registration machine using a factory mode. Sampling the registration machine using the factory mode can greatly improve the generation speed of the file code.

[0050] Exemplarily, the react-redux front-end framework includes actions files, reducers files, and Store files. In the actions files of different projects, except for the method names and types, everything else is basically similar. For this reason, the factory pattern can be used to abstract into an action registration machine, and the object registration method can be used in combination with sourceMap (a file that saves source code mapping relationships) to batch generate actions file codes. In the Store files of different projects, except for the processing method names, interface calling methods, and specific APIs, everything else is similar. You can also create a Store registration machine by referring to the action registration machine. Similarly, the factory pattern is used to abstract the reducers registration machine.

[0051] Optionally, the preset registration machine includes a download state attribute (loading state). By making the registration machine of the front-end data stream state file include a loading state attribute, the problem of manually writing the loading state can be avoided, thereby improving the project loading speed.

[0052] In an embodiment of the present invention, the method for generating file code can be encapsulated into a node installation package, for example, by packaging and encapsulating through webpack (a static module packager) to achieve componentization. When any project needs to register the front-end data flow status file, it can be achieved by downloading and installing the node installation package (that is, JavaScript running on the server), so as to achieve fast and portable code. The specific process example is as follows:

[0053] (1) Download NPM (a package management tool);

[0054] (2) Install the node installation package encapsulated above;

[0055] (3) Enter the module name through the node Command (command management tool) (the module name is used to indicate the location of the preset configuration file);

[0056] (4) Select the project name to be created from the project list through node Command (command management tool);

[0057] (5) After entering the front-end project directory, press Enter to automatically register the front-end data flow status file of the react-redux front-end framework.

[0058] In this embodiment, the user only needs to install NPM to quickly register the front-end data flow state file of the react-redux front-end framework through the command line selection method. The file will be directly injected into the project to realize the automatic writing of the data flow part code quickly and efficiently, which greatly reduces the amount of code and controls the volume after webpack packaging, thereby helping to improve the loading and browsing speed of the project. Let developers have more time to focus on business logic processing. In addition, for existing preset configuration files, they can also be quickly compatible. You only need to copy the content of the above preset configuration file into the file code, and a little reference can be compatible and coexist.

[0059] According to a second aspect of an embodiment of the present invention, a device for implementing the above method is provided.

[0060] Figure 3 Schematic diagram of the main modules of the device for registering the front-end data stream status file according to an embodiment of the present invention, such as Figure 3 As shown, the device 300 for registering the front-end data stream status file includes:

[0061] The code generation module 301 generates the file code of the front-end data stream state file according to the preset code template;

[0062] The file configuration module 302 generates a configuration file of the front-end data stream state file according to a preset configuration file;

[0063] The code compiling module 303 compiles the file code according to the configuration file and a preset registration machine to register the front-end data stream status file.

[0064] Optionally, the code generation module generates the file code of the front-end data stream state file according to a preset code template, including:

[0065] Extract variable parameters from user input information, replace placeholders corresponding to the variable parameters in the preset code file with the variable parameters, and generate file code for the front-end data stream status file; determine the project address according to the user input information, and write the file code into the project address based on the file stream operation.

[0066] Optionally, the code compilation module is further used to: before compiling the file code according to the configuration file and the preset registration machine, use a factory mode to abstract the front-end data stream state file into a registration machine.

[0067] Optionally, the preset registration machine includes a download status attribute.

[0068] According to a third aspect of an embodiment of the present invention, there is provided an electronic device for registering a front-end data stream status file, comprising:

[0069] one or more processors;

[0070] a storage device for storing one or more programs,

[0071] When the one or more programs are executed by the one or more processors, the one or more processors implement the method provided in the first aspect of the embodiment of the present invention.

[0072] According to a fourth aspect of an embodiment of the present invention, a computer-readable medium is provided, on which a computer program is stored, and when the program is executed by a processor, the method provided by the first aspect of the embodiment of the present invention is implemented.

[0073] Figure 4 An exemplary system architecture 400 is shown to which the method for registering a front-end data stream status file or the apparatus for registering a front-end data stream status file according to the embodiments of the present invention can be applied.

[0074] like Figure 4 As shown, system architecture 400 may include terminal devices 401, 402, 403, network 404 and server 405. Network 404 is used to provide a medium for communication links between terminal devices 401, 402, 403 and server 405. Network 404 may include various connection types, such as wired, wireless communication links or optical fiber cables, etc.

[0075] Users can use terminal devices 401, 402, 403 to interact with server 405 through network 404 to receive or send messages, etc. Various communication client applications can be installed on terminal devices 401, 402, 403, such as shopping applications, web browser applications, search applications, instant messaging tools, email clients, social platform software, etc. (only as examples).

[0076] The terminal devices 401 , 402 , and 403 may be various electronic devices having a display screen and supporting web browsing, including but not limited to smart phones, tablet computers, laptop computers, and desktop computers.

[0077] The server 405 may be a server that provides various services, such as a background management server (only for example) that supports shopping websites browsed by users using the terminal devices 401, 402, and 403. The background management server may analyze and process the received data such as the front-end data stream state file registration request, and feed back the processing result (such as registration result information - only for example) to the terminal device.

[0078] It should be noted that the method for registering the front-end data stream status file provided in the embodiment of the present invention is generally executed by the server 405 , and accordingly, the device for registering the front-end data stream status file is generally set in the server 405 .

[0079] It should be understood that Figure 4 The number of terminal devices, networks and servers in the embodiment is only for illustration. Any number of terminal devices, networks and servers may be provided according to implementation requirements.

[0080] Reference below Figure 5 , which shows a schematic diagram of the structure of a computer system 500 of a terminal device suitable for implementing an embodiment of the present invention. Figure 5 The terminal device shown is only an example and should not bring any limitation to the functions and scope of use of the embodiments of the present invention.

[0081] like Figure 5 As shown, the computer system 500 includes a central processing unit (CPU) 501, which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM) 502 or a program loaded from a storage part 508 into a random access memory (RAM) 503. In the RAM 503, various programs and data required for the operation of the system 500 are also stored. The CPU 501, the ROM 502, and the RAM 503 are connected to each other via a bus 504. An input / output (I / O) interface 505 is also connected to the bus 504.

[0082] The following components are connected to the I / O interface 505: an input section 506 including a keyboard, a mouse, etc.; an output section 507 including a cathode ray tube (CRT), a liquid crystal display (LCD), etc., and a speaker, etc.; a storage section 508 including a hard disk, etc.; and a communication section 509 including a network interface card such as a LAN card, a modem, etc. The communication section 509 performs communication processing via a network such as the Internet. A drive 510 is also connected to the I / O interface 505 as needed. A removable medium 511, such as a magnetic disk, an optical disk, a magneto-optical disk, a semiconductor memory, etc., is installed on the drive 510 as needed, so that a computer program read therefrom is installed into the storage section 508 as needed.

[0083] In particular, according to the embodiments disclosed in the present invention, the process described above with reference to the flowchart can be implemented as a computer software program. For example, the embodiments disclosed in the present invention include a computer program product, which includes a computer program carried on a computer-readable medium, and the computer program includes a program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from the network through the communication part 509, and / or installed from the removable medium 511. When the computer program is executed by the central processing unit (CPU) 501, the above-mentioned functions defined in the system of the present invention are executed.

[0084] It should be noted that the computer-readable medium shown in the present invention may be a computer-readable signal medium or a computer-readable storage medium or any combination of the above two. The computer-readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or device, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present invention, a computer-readable storage medium may be any tangible medium containing or storing a program that can be used by or in combination with an instruction execution system, device or device. In the present invention, a computer-readable signal medium may include a data signal propagated in a baseband or as part of a carrier wave, which carries a computer-readable program code. This propagated data signal may take a variety of forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the above. Computer-readable signal media may also be any computer-readable medium other than computer-readable storage media, which may send, propagate or transmit a program for use by or in conjunction with an instruction execution system, apparatus or device. The program code contained on the computer-readable medium may be transmitted using any appropriate medium, including but not limited to: wireless, wire, optical cable, RF, etc., or any suitable combination of the above.

[0085] The flow chart and block diagram in the accompanying drawings illustrate the possible architecture, function and operation of the system, method and computer program product according to various embodiments of the present invention. In this regard, each box in the flow chart or block diagram can represent a module, a program segment, or a part of a code, and the above-mentioned module, program segment, or a part of a 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 from the order 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 or flow chart, and the combination of the boxes in the block diagram or flow chart can be implemented with a dedicated hardware-based system that performs a specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.

[0086] The modules involved in the embodiments of the present invention may be implemented by software or hardware. The modules described may also be set in a processor, for example, may be described as: a processor comprising: a code generation module, which generates a file code of a front-end data flow status file according to a preset code template; a file configuration module, which generates a configuration file of the front-end data flow status file according to a preset configuration file; a code compilation module, which compiles the file code according to the configuration file and a preset registration machine to register the front-end data flow status file. Among them, the names of these modules do not constitute a limitation on the module itself in some cases. For example, the code generation module may also be described as "a module that compiles the file code according to the configuration file and the preset registration machine."

[0087] As another aspect, the present invention also provides a computer-readable medium, which may be included in the device described in the above embodiment; or may exist independently without being assembled into the device. The above computer-readable medium carries one or more programs, and when the above one or more programs are executed by a device, the device includes: generating a file code of a front-end data flow status file according to a preset code template; generating a configuration file of the front-end data flow status file according to a preset configuration file; and compiling the file code according to the configuration file and a preset registration machine to register the front-end data flow status file.

[0088] According to the technical solution of the embodiment of the present invention, the front-end data flow status file is registered according to the preset code template and configuration file. On the one hand, it can realize the rapid generation of file code and avoid project compilation errors caused by manual code generation errors or missing file registration. On the other hand, it can greatly reduce the size of the code and improve the speed of project packaging and loading.

[0089] The above specific implementations do not constitute a limitation on the protection scope of the present invention. It should be understood by those skilled in the art that various modifications, combinations, sub-combinations and substitutions may occur depending on design requirements and other factors. Any modification, equivalent substitution and improvement made within the spirit and principle of the present invention shall be included in the protection scope of the present invention.

Claims

1. A method for registering a front-end data stream status file, characterized in that: include: Generate the file code of the front-end data flow status file according to the preset code template; Generate a configuration file for the front-end data stream state file according to a preset configuration file; Compiling the file code according to the configuration file and the preset registration machine to register the front-end data stream state file; Among them, the method of generating file code is encapsulated as a node installation package, the module name is input through the command management tool, the project name to be created is selected from the project list through the command management tool, and the front-end project directory is entered and press Enter to register the front-end data flow state file; the front-end data flow state file includes: the actions file, reducers file, and Store file of the react-redux front-end framework; the actions file is abstracted into an actions registration machine using the factory pattern, and the actions file code is generated in batches by using the object registration method and the file that saves the source code mapping relationship; the reducers file is abstracted into a reducers registration machine using the factory pattern, and the Store file is abstracted into a Store registration machine using the factory pattern.

2. The method according to claim 1, characterized in that Generate the file code of the front-end data flow status file according to the preset code template, including: Extract variable parameters from user input information, replace placeholders corresponding to the variable parameters in the preset code file with the variable parameters, and generate file code for the front-end data stream status file; determine the project address according to the user input information, and write the file code into the project address based on the file stream operation.

3. The method according to claim 1, characterized in that The preset registration machine includes a download status attribute.

4. A device for registering a front-end data stream status file, characterized in that: include: A code generation module generates file codes for front-end data flow status files according to preset code templates; A file configuration module, generating a configuration file of the front-end data stream state file according to a preset configuration file; A code compiling module compiles the file code according to the configuration file and a preset registration machine to register the front-end data stream state file; Among them, the method of generating file code is encapsulated as a node installation package, the module name is input through the command management tool, the project name to be created is selected from the project list through the command management tool, and the front-end project directory is entered and press Enter to register the front-end data flow state file; the front-end data flow state file includes: the actions file, reducers file, and Store file of the react-redux front-end framework; the actions file is abstracted into an actions registration machine using the factory pattern, and the actions file code is generated in batches by using the object registration method and the file that saves the source code mapping relationship; the reducers file is abstracted into a reducers registration machine using the factory pattern, and the Store file is abstracted into a Store registration machine using the factory pattern.

5. The device according to claim 4, characterized in that The code generation module generates the file code of the front-end data stream state file according to the preset code template, including: Extract variable parameters from user input information, replace placeholders corresponding to the variable parameters in the preset code file with the variable parameters, and generate file code for the front-end data stream status file; determine the project address according to the user input information, and write the file code into the project address based on the file stream operation.

6. The device according to claim 4, characterized in that The preset registration machine includes a download status attribute.

7. An electronic device for registering a front-end data stream status file, characterized in that: include: one or more processors; a storage device for storing one or more programs, When the one or more programs are executed by the one or more processors, the one or more processors implement the method according to any one of claims 1 to 3.

8. A computer readable medium having a computer program stored thereon, characterized in that: When the program is executed by a processor, the method according to any one of claims 1 to 3 is implemented.

Citation Information

Patent Citations

  • Code generating method and device

    CN106873949A

  • Method for generating micro-service of intelligent equipment

    CN109951564A