CN114237583B - A cross-platform visual code generation device and method - Google Patents

Abstract

The present invention discloses a cross-platform visual code generation device and method, belonging to the field of computer application technology. Visual editing logic is realized through a visual controller editing tool, cross-platform consistent logic editing is realized through functional controller actions, differentiated interface calls of various platforms are realized through system call actions, code generation is realized through sub-platform compilation, and finally the logic visual editing, sub-platform code generation and sub-platform code running functions across three platforms of backend, web page and applet are realized. The present invention can effectively reduce software development costs and improve software development quality.

Description

Cross-platform visualized code generation device and method

Technical Field

The invention relates to a cross-platform visualized code generation device and method, and belongs to the technical field of computer application.

Background

The visualized code generation and operation are one of core technologies of a low-code software development platform, so that the software development threshold can be effectively reduced, a primary developer and even a common user can develop software in a visualized manner, the software development efficiency is further improved, and the software development cost is reduced.

The prior art mainly integrates the code fragments generated by the visualization tool into a system, generates codes by multiplexing front-end components and generates codes by configuring options and interfaces, but most of functional facets cannot support the generation and use of the cross-platform and multi-scene visualization codes in a unified manner.

The existing code generation technology directly generates service-side codes such as Java codes and XML files in a visual mode, can only run on a service side, is limited by a specific program language and a specific platform, and needs a developer to master related back-end knowledge to develop system components or debug problems. The fact that only server code can be generated also means that other front ends are matched to realize complete development of software products. This is a very traditional and one-sided way of generating.

The other is to generate code through front-end code fragments and components, which has the disadvantage that it is difficult to support back-end logic customization, and typically only back-end functionality can be achieved through a fixed interface. And the front-end components are difficult to realize cross-platform support, and huge code libraries and component libraries are required to be maintained for customizing complex functions. Multiplexing of code blocks is very difficult because it is difficult to ensure that the codes are directly combined together without conflict and can interoperate unless enough specifications and constraints are defined, which is a way of comparing the original generation.

Yet another class is to generate codes based on configuration and interface, i.e., by defining some components and interfaces, exposing some configuration options, allowing the user to combine the desired codes and functions through the options. The main drawbacks are the need to maintain very complex configurations, and reduced flexibility, the user being able to combine functions only by limited configurations, which in turn reduce development efficiency. Maintaining a large number of configurations for a platform creates a large number of branching conditions that can have a significant negative impact on maintenance and testing.

The other type is to implement function customization through a form plus trigger or workflow, the method is severely limited by the form and the trigger, only simple operation on a data table can be realized, cross-platform function customization can not be realized, and partial platforms are used for supporting the realization of the function customization through inserting codes in order to make up the defects of the method, but the method is far away from a visual code generation method.

In addition, the existing visual code generation function can only adapt to one or a few platforms such as PC web pages, mobile phone web pages and back ends, and lacks support for special environments such as popular applets. And the platform is not uniformly developed, different tools and components are needed, even different personnel are needed for development, the communication cost and the development cost cannot be effectively reduced, and the functional consistency of the software on each platform cannot be ensured.

The existing part of the visualized code generating function only exists as an auxiliary tool, the generated code needs to be copied and pasted into an existing system code library to operate, or needs to be imported into an existing system as a component, online real-time compiling and operation cannot be realized, and the online real-time compiling and operation is an important basic function for a large-scale SaaS system and a low-code development platform.

Disclosure of Invention

The technical problem to be solved by the invention is to provide a cross-platform visual code generation device and method, which solve the problem that most of functional facets cannot uniformly support cross-platform and multi-scene visual code generation and use in the prior art.

The technical problems to be solved by the invention are realized by adopting the following technical scheme:

The application provides a cross-platform visual code generation device, which comprises a visual controller editing tool, wherein an action option and a compiling button are arranged in a front-end user interface of the visual controller editing tool, each action option in the front-end user interface corresponds to each action, the action option comprises a functional action and a system calling action, a controller is formed through different functional actions and system calling actions, and a compiling function is executed through the compiling button to generate codes which are respectively executable on different platforms by the controller.

The second aspect of the present application provides a cross-platform visualized code generating method, including:

The front-end user interface in the visual controller editing tool is respectively combined into a back-end controller, a webpage controller and a applet controller by adding, deleting and modifying action options and changing the positions of the action options through mouse dragging;

And respectively compiling and generating back-end controller codes executed at the server side by clicking a compiling button, and executing webpage controller codes at the webpage side and applet controller codes at the applet side.

Preferably, the backend controller, the web page controller, and the applet controller each include a functional action and a system call action.

More preferably, the functional actions of the backend controller include cloud function actions.

More preferably, the functional actions of the web page controller and the applet controller each include functional actions for handling initialization status, page lifecycle, user interaction events.

More preferably, the system call action includes calling a system interface, calling a database interface, calling a key value pair database, calling a string operation interface, calling a numeric operation interface, calling an array operation interface, calling a time and date operation interface, calling an applet interface, and calling a web page interface.

The beneficial effects of the invention are as follows:

According to the cross-platform visual code generation device and method, logic visual editing is achieved through the controller, the front-end and back-end coordination problem is solved, the problem of inconsistent team code format and style is eliminated through controller actions and system call, team management difficulty is effectively reduced, the platform adaptation problem of a code generation tool is solved through system call, the function and expansibility problem of the visual code generation tool are solved through designing the controller actions and the system call, and the uniformity problem of different platforms is achieved through the controller actions.

Drawings

FIG. 1 is a flow chart of cross-platform visualization code development steps.

FIG. 2 is a diagram of a visual controller editing tool applied to a web page platform.

FIG. 3 is a system call classification and system call application of a visual controller to a web page platform.

Fig. 4 is a backend controller editing example.

Fig. 5 is an example of web page controller editing.

FIG. 6 is an example of applet controller code folder structure and partial code generated in a visual controller editing tool.

Detailed Description

The invention will be further described with reference to the following detailed drawings, in order to make the technical means, the creation characteristics, the achievement of the purpose and the effect of the invention easy to understand.

Referring to fig. 1-6, the cross-platform visual code generating device provided by the application comprises a visual controller editing tool, wherein an action option and a compiling button are arranged in a front-end user interface of the visual controller editing tool, each action option in the front-end user interface corresponds to each action, the action option comprises a functional action and a system call action, a controller is formed through different functional actions and system call actions, and a compiling function is executed through the compiling button to generate codes which can be executed by the controller on different platforms respectively.

The cross-platform visualized code generation method provided by the application comprises the following steps:

step one, the front end user interface in the visual controller editing tool is respectively combined into a back end controller, a webpage controller and an applet controller by adding, deleting and modifying action options and changing the positions of the action options through mouse dragging.

And secondly, respectively compiling and generating back-end controller codes executed at the server side by clicking a compiling button, and executing webpage controller codes at the webpage side and applet controller codes at the applet side.

The back-end controller, the web page controller and the applet controller all include functional actions and system call actions.

The functional actions of the backend controller include cloud function actions.

The functional actions of the web page controller and the applet controller each include functional actions for handling initialization status, page lifecycle, user interaction events.

The system calling action comprises calling a system interface, calling a database interface, calling a key value pair database, calling a character string operation interface, calling a digital operation interface, calling an array operation interface, calling a time and date operation interface, calling a applet interface and calling a webpage interface.

The visual controller editing tool realizes the editing function through the front-end component, the user interface is shown in fig. 2, and the user can edit complex logic in the interface through visual operation modes such as mouse dragging, clicking operation and the like without manually writing codes. The controller consists of a plurality of actions, part of the actions can be nested with sub-actions, the visual controller editing tool can enable a user to add, delete and modify actions in the interface, and move the positions of the actions through mouse dragging, one controller is realized through combining the plurality of actions, and codes of different platforms are generated through clicking and compiling. Each action has attributes of type, name, unique KEY, parameters of the corresponding type of action, remarks, etc. After adding an action, the developer may modify the parameters and remarks of the action, as well as adjust the position of the action.

The specific action list designed is shown in table 1, a compiling function is written for each action, and a variation function is used for generating codes of corresponding platforms. The action types include functions of defining functions (func), defining variables (let), judging conditions (if), loop processing (map), and the like, and concurrently executing high-level functions of (concurrent), decorator (decorator), and the like.

TABLE 1 controller action type

The basic user interface of the controller and the drop down menu functions of the add actions are shown in fig. 2. The added action type is selected through a drop-down option during editing, and the options of actions, the deletion actions, the remarks addition and the positions of the dragging and moving actions can be set after the addition. For other platform-specific interfaces, implementation is by system calls.

The system call action is a special action, and is mainly classified into a system interface (such as a printing log and a delay execution), a database interface (for performing an adding and deleting operation on the database), a key value pair database (for operating the key value pair database), a character string operation interface, a digital operation interface, an array operation interface, a time and date operation interface, an applet interface and a webpage interface, wherein a plurality of hundreds of different interfaces exist under each classification, after the user adds the system call action, the user can select different system call interfaces, the system can automatically display documents of required parameters, the user fills out corresponding parameters according to the documents in a visual form mode, supports various input modes such as text, number, selection and the like, and also can select the declared variables in the context. After adding the system call action, a user can screen out different system call types according to the system call classification and the belonged platform to select, after selecting different system call types, the system can automatically display the required parameters and the document, the user fills out corresponding options according to the document, the options are filled out in a visual form mode, and the variables of the statement in the context can also be selected. Each system call needs to realize a corresponding compiling function, the compiling function receives the platform type and options filled by a user, and corresponding codes are obtained through compiling during compiling. A large number of system calls need to be designed for different platforms such as back-ends, web pages and applets to realize detailed functions of the corresponding platforms, and part of the system calls can also be adapted to a plurality of platforms.

FIG. 3 illustrates a partial system call classification and partial system call name for a web page platform. The system call actions in the web page platform will only display the system call that has been adapted to the web page platform.

The back-end controller core is also composed of function actions, and in order to distinguish functions of the front-end controller from the front-end controller, the front-end controller comprises a web page controller and a small program controller, and the specific actions are called cloud function (ccode _func) actions, but share the same visual controller editing tool with the front-end controller. The server side of the modern application mainly provides an API interface (returning JSON/XML/TXT and other format data), and also supports view functions (returning HTML/picture/video and other contents), events (triggering execution functions through specific scenes) and planning tasks (timing execution functions) so as to meet the requirements of different scenes. The above-mentioned common requirements can be supported by the back-end controller. A back-end cloud function can be declared by declaring a cloud function (ccode _func) action, the parameters of which support selecting a function type, which can be a common cloud function or set as a view function, event or planning task, and different types and different options.

The embodiment realizes all types of cloud functions, the common type cloud function can be used as an API interface to return JSON/XML/TXT/CSV and other format data to provide a data interface for a front end or a third party, the function parameters are parameters transferred by the front end or the third party, and the event type cloud function is supported to be triggered and executed in a specific scene. For example, typical third party payment needs to be notified and triggered by a third party payment platform, after the triggering, the system finds a corresponding event function according to the route to execute, and parameters of the event function are parameters of the corresponding event, such as payment data package, and no value is generally returned but a print log can be called through the system. Event type cloud functions are also important tools for system decoupling, and can be triggered in common cloud functions to realize asynchronous execution. The common cloud function can also set a time delay execution (timeout) through an option, and is used for realizing service logic of the time delay execution, such as logic of automatically canceling orders without payment after a designated time, and a planning task can support setting to be executed at a certain time point of a day, wherein the planning task option is a time array (time), and the planning task has no parameters and returns no value, but can be printed to a log system through an internal system call.

The cloud function, the event and the planning task in the embodiment are determined to be unique through the unique names, the cloud function with the corresponding name is called by a platform in a system through a URL routing mode, the cloud function with the corresponding name is directly selected in a front-end controller to be called, the cloud function with the specific name is triggered through the event in a specific scene, and the planning task is automatically and regularly executed by a system scheduler (bean) according to time.

In order to effectively and visually manage cloud functions, cloud functions can be managed in a grouping mode through a cloud function grouping action (ccode _func_group), and cloud function sub-nodes can be added below the cloud function grouping action.

And in the cloud function, common back-end logic can be realized by acquiring function parameters (part of types are empty when no parameters exist), then by claiming actions such as variable, condition judgment, circulation and the like, and system call such as database addition, deletion, modification and the like, and finally, JSON data structures or formats such as HTML/XML/TXT and the like are directly returned (part of types do not need to be returned). The back-end controller developed in the third step can be directly called by the webpage controller and the applet controller after being generated and operated in the sixth step.

One controller may contain multiple cloud functions of different types, cloud function groupings, and one large application may create multiple controllers to achieve different portions of business needs, as long as the cloud function names do not conflict. A large application may consist of tens of controllers, hundreds of cloud function groupings, thousands of cloud functions, and tens of thousands of actions.

Fig. 4 shows an editing interface of a cloud function controller in this embodiment, wherein the actions of the outermost layer are cloud function groups, a plurality of cloud functions are nested inside, the cloud functions can set information such as names, parameters, remarks and the like, service logic is realized in each cloud function, and a part of functions have return values.

The webpage controller is used for controlling data displayed on a webpage interface and processing user interaction events, the components of the webpage controller are functions, one webpage controller can be added with a plurality of functions, and different functions can process initialization states, page life cycles and user interaction events, so that all functions of the front-end webpage are realized.

In this embodiment, the page state is defined by an initialization state function action (func) of a special name (onCreateState), and the initialization state of the component can be declared by a declaration state action (set) in the initialization state function, where the initialized state is used for initial rendering of the page, and the return value of the initialization state function is used as the initial state of the page. Further, the display time operation is controlled by a function action (func) control component named onShow, the uninstall time operation is controlled by a function action (func) control component of onHide, and other types of page lifecycle events are controlled by other names. For a user interaction event, such as a user clicking a button in a page, a user-defined event function (func) can be added, and then the user clicking the button can be implemented to execute the user-defined event by binding a corresponding function of the controller at the corresponding component. The front-end interface state may be modified in all functions (except onCreateState) by a modify state (commit) action, thus enabling dynamic updating of the web page interface.

Parameters of the functions can be obtained and a plurality of actions can be added in each function, logic control is realized through functions such as variable definition, assignment, condition judgment, circulation and the like, and business logic is realized through calling a webpage interface, a database interface and a back-end cloud function interface.

Fig. 5 shows an example of an editing interface of the web page controller in this embodiment, in the example, a state value state/count is initialized through onCreateState function actions, a function 1 is called by a function in a onShow life cycle, a state value state/count of 1 bit is added with 1, a UI interface display count is 2 in initializing rendering, when a user clicks a button to associate and execute the function 1, the state value state/count is added with 1, and the UI interface display count is 3.

The small program controller is used for controlling the logic of small program components and pages in small programs, the visual controller is used for developing the procedure of the small program controller to be similar to that of the webpage controller, the small program controller is composed of functions, one small program controller can be added with a plurality of functions, and different functions can process initialization states, page life cycles and user interaction events, so that all functions of the small program controller are realized. According to the embodiment, the problem of editing consistency of the two platforms is solved through the controller, and finally different codes are generated according to different platforms.

In the embodiment, the state of the applet page is defined by an initialization state function action (func) with a special name (onCreateState), the life cycle of the page is controlled by the life cycle function names such as onShow/onHide, and the logic control of the user interaction event is realized by binding the user interaction event to the components in the page. Parameters of the applet event are inconsistent with the web page controller, and parameters of the function can be obtained through event variables at the corresponding event.

The state update actions of the applet are consistent with the web page, both using a modified state (commit) interface, but the code generated at the end of the compilation will call the setData interface modification interface of the applet platform.

The back-end controller is generated and operated, the controller is required to be developed by using a visual controller editing tool, and finally the server-end code is required to be generated for execution. The embodiment realizes a compiler of a back-end controller and supports compiling the controller into a code character string of a JavaScript (node. Js) of a server side, and the code generation and compiling steps are that a global variable actions is set before compiling, all actions are circulated, different codes are generated according to different action types, sub-actions are repeatedly circulated and compiled to be embedded into the sub-actions if nested actions such as function statements are encountered, corresponding codes are generated according to the system call actions if different types of system call actions are encountered, the function statements are copied into attributes of actions if the function statements are encountered, such as the function name ccode _func1, the actions. Ccode_func1 is set as a function body, and finally a sentence export default actions is added to the generated codes to derive the global variable actions. Finally, a node. Js code string of ESM specification is obtained and stored in a field of database TEXT type.

When a web page controller, an applet controller or a third party directly requests a cloud function, the system finds out a function with a corresponding name of the corresponding controller according to the route, takes out a corresponding controller code from a database, obtains a controller return value (actions) through a safe execution code of a vm2 module of a node. Js in a sandbox, obtains a function object actions. Code_func1 according to a function name such as ccode _func1, and returns a function caller after the function is executed to obtain a result. The hot-spot caching technology (lru cache) ensures that the operation of fetching codes does not need to be repeatedly executed when the same function is repeatedly called so as to optimize the performance of the system, and all cloud functions of the same controller share the same controller without repeatedly fetching codes. The function execution has no side effect, and the same function call can not conflict with each other for a plurality of times. Js servers can be deployed in clusters to support large-scale concurrent access.

The embodiment realizes compiling and generating the actions of the visual controller to node.js (ESM) codes and realizing dynamic execution from a server side, but in practice, compiling to other languages can be realized only by realizing compiling functions of different languages for different actions because of the abstract nature of the visual controller and the actions.

The compiling and generating step of the webpage controller is that after a user clicks a compiling button of the controller, a compiling function is executed, the compiling function loops all actions (the primary action is a function func), different codes are generated according to different action types, if a nested action such as a function statement is encountered, sub-actions are embedded after repeated loop compiling, if different types of system call actions are encountered, corresponding codes are generated according to the system call actions, and for a state modifying operation (set) which is mapped into a state modifying operation of a front end frame, such as a $set method of Vue or a setState method of React, the compiling and generating step is carried out. The final generated target is JavaScript (ES 2015) code file. Some actions may produce different code depending on the compilation objective. Some system calls may also generate different code from platform to platform.

When a user accesses a webpage, all controller codes are extracted according to all components in the webpage, the controller codes are combined into a JavaScript file, the JavaScript file is automatically uploaded to a CDN and cached, the fact that the combining operation is required only when the user accesses the webpage for the first time to optimize performance is ensured, and the webpage loads the JavaScript code through a script tag.

When the webpage is loaded, all components execute JavaScript codes, all controllers are circulated, for each controller, an initialization state (onCreateState) function is firstly executed, a rendering state is initialized according to a return value of each controller, then onShow functions execute actions when the webpage is loaded, a back-end cloud function can be called in onShow functions to acquire data, or the state of the webpage is directly modified, and after the state is modified, a system automatically updates an interface according to state change. After the page can be interacted, a user operates a corresponding component in the webpage and triggers a corresponding event action, for example, the user clicks a certain button, a corresponding function name is found according to the event name bound by the button component, the found function is called by using a corresponding event parameter, and the action in the function can pop up a prompt and can also continuously modify the state. The visual controller completely realizes the operation and control of page rendering and interaction on the webpage.

In this embodiment, the front end frame Vue of the MVVM type is used to implement dynamic binding of the page status and the interface, and in fact, similar frames such as exact can also implement the same effect. Because the visual controller is framework independent, the visual controller uses a modify status action (commit) to implement the update interface, which can be compiled as either the $set method of Vue or the setState method of React.

The compiling and generating step of the small program controller is that a compiling button is clicked on a controller editing interface to execute a compiling function, the compiling function firstly declares an actions null object, the compiling function loops all actions (the first-level action is a function func), different codes are generated according to different action types, sub-actions are embedded after repeated loop compiling if nested actions such as function declarations are encountered, the function is copied to the actions object as attributes if the function declarations are encountered, corresponding codes are generated according to the system calling actions if different types of system calling actions are encountered, and the compiling function in part of actions generates small program specific codes according to a small program platform. The difference from the other two platforms is that the generation target has two, one is JavaScript (ES 5) format and the other is WXS format of applet. After compiling, the applet code strings of the controller are obtained and saved in the database TEXT type field.

When the applet is generated, all applet pages are traversed firstly, then all controller codes of each page are traversed, all controllers in one page are combined into an index. Js file, and the index. Js file is output to the page corresponding to the applet (WXS format needs to be output to the WXML file). Fig. 6 shows a file structure of a finally generated applet and a part of controller codes, which clearly shows that the controller compiled codes are in index. Js files under each page folder, and there are a plurality of controller codes in each file, and each controller takes actions= { } as an initial variable, and then assigns functions stepwise, such as onCreateStete and onShow, to form an operation object of the applet. There is also part of the common framework code at each index. Js for proxy applet functions and scheduling execution of the controller code.

After the applet is started, the function onShow is executed first, the parameters are the current page query parameters, the internal actions are run in sequence, and if some actions modify the interface state (commit), the setData call mapped to the applet realizes the update of the interface. Clicking the corresponding component in the applet by the user triggers the execution of the corresponding event function, the parameters are clicking event objects, the actions in the function are sequentially executed, and the UI interface is updated if the actions modify the interface state (commit). So far, the running and interaction of the small program is realized through the code generated by the visual controller.

The invention realizes the visual editing of logic through the visual dragging editing controller. Compared with manual code writing, the visual drag has obvious advantages, the positions of functions and actions can be intuitively adjusted through the visual drag, and a large number of actions can be quickly copied through operations such as click adding, copy pasting, cloning and the like without worrying about format problems or logic disorder.

The method eliminates the problem of inconsistent team code format and style through standard actions and system call, and effectively reduces team management difficulty. Meanwhile, only the core team is required to maintain the controller editing tool, action and system call, so that the system quality can be effectively improved, and other developers can develop high-quality software only by using standard action and system call.

The invention solves the platform adaptation problem of the code generation tool through the system call function, and is only suitable for specific scenes, and the invention compiles codes of different platforms through the action compiling function and the system call compiling function under the unified controller action matched with different platforms, thereby skillfully solving the adaptation problem of a plurality of platforms.

The invention solves the problems of functions and expansibility of the visual code generating tool through action design and system call design, can expand the functions of the visual code generating tool through newly added actions or newly added system calls, and can expand the cross-platform capability of the visual code generating tool through newly added system calls or newly added platforms.

The invention realizes the uniformity problem of different platforms through the action of the controller, and by extracting common logic actions such as functions, declarations and assignments, condition judgment and circulation statement and system call (such as a rear end interface, an applet interface and a webpage interface) special for each platform, a developer can develop the cross-platform function by using the consistent visual action, and can realize the special function of each platform through the system call, thereby greatly reducing the labor cost of software development.

The invention requires front-end personnel and back-end personnel to fully communicate the requirements and the butt joint interfaces through the traditional software development of the unified controller editing tool, and the same person can realize the development of the back-end controller by himself through the unified back-end controller, the webpage controller and the applet controller and then directly call the webpage controller or the applet controller, thereby greatly reducing the communication cost and improving the software production efficiency.

The invention solves the problem of logic writing of the applet end through cross-platform compiling, the applet has differences relative to the webpage, the invention realizes seamless adaptation of the same action to two platforms by compiling the same action or system call into different codes in the webpage and the applet, and greatly reduces development cost and maintenance cost. For example, in a system call pop-up hint, an alert () function call of a browser is compiled in a web page platform, and a showModal () function call of a corresponding platform is compiled in an applet, and a modification state (commit) in the web page is mapped to a setData interface of the applet.

The method and the device have the advantages that the codes generated by the back end are run in the sandbox in real time, the problem of real-time compiling and real-time integrated running of the codes is effectively solved, and compared with the codes generated by some visual code generating tools, the method and the device still need to be manually integrated into the system, so that the advantage is obvious. For the SaaS platform and the low-code development platform, the real-time editing operation of codes improves the demand response capability and accelerates the problem processing speed.

The foregoing has shown and described the basic principles, principal features and advantages of the invention. It will be understood by those skilled in the art that the present invention is not limited to the embodiments described above, but is capable of various changes and modifications without departing from the spirit and scope of the invention. The scope of the invention is defined by the appended claims and equivalents thereof.

Claims (5)

1. A method for cross-platform visualization code generation, comprising:

The front-end user interface in the visual controller editing tool is respectively combined into a back-end controller, a webpage controller and a applet controller by adding, deleting and modifying action options and changing the positions of the action options through mouse dragging;

respectively compiling and generating back-end controller codes executed at a server side by clicking a compiling button, web page controller codes executed at a web page side, and applet controller codes executed at an applet side;

The code generation and compiling steps comprise setting a global variable action before compiling, cycling all actions, generating different codes according to different action types, embedding the sub-actions after repeated cycling compiling if nested actions are encountered, generating corresponding codes according to the system calling actions if different types of system calling actions are encountered, copying function declarations into the attributes of the actions if function declarations are encountered, wherein the steps comprise setting actions. Ccode_func1 as a function body if the function name is ccode _func1, and finally adding a sentence export default actions into the generated codes to derive the global variable actions;

Finally, a node. Js code character string of ESM specification is obtained and is stored in a field of a database TEXT type;

When a user accesses a webpage, all controller codes are extracted according to all components in the webpage, the controller codes are combined into a JavaScript file, the JavaScript file is automatically uploaded to a CDN and cached, and the combined operation is carried out when the user accesses the webpage for the first time;

When the applet is generated, all applet pages are traversed firstly, then all controller codes of each page are traversed, all controllers in one page are combined into an index. Js file, and the index. Js file is output to the page corresponding to the applet, wherein the WXS format is required to be output to the WXML file.

2. The method for generating cross-platform visual code according to claim 1, wherein said back-end controller, web page controller and applet controller each comprise a functional action and a system call action.

3. The method for generating cross-platform visual code according to claim 2, wherein the functional actions of the backend controller comprise cloud function actions.

4. The method for generating cross-platform visual code according to claim 2, wherein the functional actions of the web page controller and the applet controller each comprise a functional action for handling initialization status, page lifecycle, user interaction events.

5. The cross-platform visualization code generation method of claim 2, wherein the system call actions comprise calling a system interface, calling a database interface, calling a key-value pair database, calling a string operation interface, calling a numeric operation interface, calling an array operation interface, calling a time-date operation interface, calling an applet interface, and calling a web page interface.