CN111949261A - High-multiplexing application development configuration method and system - Google Patents

High-multiplexing application development configuration method and system Download PDF

Info

Publication number
CN111949261A
CN111949261A CN202010668495.0A CN202010668495A CN111949261A CN 111949261 A CN111949261 A CN 111949261A CN 202010668495 A CN202010668495 A CN 202010668495A CN 111949261 A CN111949261 A CN 111949261A
Authority
CN
China
Prior art keywords
information
component
native
application
configuration
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN202010668495.0A
Other languages
Chinese (zh)
Other versions
CN111949261B (en
Inventor
刘德建
王若龙
郭玉湖
陈宏�
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Fujian Tianquan Educational Technology Ltd
Original Assignee
Fujian Tianquan Educational Technology Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Fujian Tianquan Educational Technology Ltd filed Critical Fujian Tianquan Educational Technology Ltd
Priority to CN202010668495.0A priority Critical patent/CN111949261B/en
Publication of CN111949261A publication Critical patent/CN111949261A/en
Application granted granted Critical
Publication of CN111949261B publication Critical patent/CN111949261B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/36Software reuse
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/40Transformation of program code
    • G06F8/41Compilation
    • YGENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
    • Y02TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
    • Y02DCLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
    • Y02D10/00Energy efficient computing, e.g. low power processors, power management or thermal management

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Stored Programmes (AREA)

Abstract

The invention provides a high-multiplexing application development configuration method and a system thereof, wherein the method comprises the following steps: storing the component codes of the components to an H5 server; selecting a target component from a component library; assembling the target component in a self-defined manner at a web end, and configuring a driving mode of the target component in a component container to obtain an application project; generating configuration information of the application item; the configuration information comprises page information, driving information and compiling information; selecting an application project to be published at a web end; the H5server side obtains the configuration information of the application item to be issued, and compiles and packages the configuration information according to the compiling information to obtain a compiled file; and storing the compiled file to a web server. The invention can greatly improve the reusability and the application development efficiency of the components in a hybrid development mode and realize the configuration of target application in a user-defined, efficient and convenient manner.

Description

High-multiplexing application development configuration method and system
Technical Field
The invention relates to the field of application development, in particular to a high-multiplexing application development configuration method and a high-multiplexing application development configuration system.
Background
The existing mobile phone App development schemes are generally divided into native development, H5 development and hybrid development.
Native development (Native development) is developed on platforms such as Android and IOS using development languages and development tools provided by the authorities. Because the system is developed based on a platform, the system access capability is strong, but the cross-platform performance is poor.
H5 (HTML 5) is developed using web technologies such as JavaScript, HTML, CSS, and the like in a browser environment. Because the browser can run only in the browser environment, the cross-platform performance is good. But it has a weak ability to access the system because of the intervening layer of browsers.
Hybrid development (Hybrid App development) is a development combining native and H5 technologies. The native part is primarily responsible for invoking system-bottom capabilities, and the H5 part is primarily responsible for exposing specific functions. Therefore, the method has the characteristics of strong system access capability and good cross-platform performance.
However, the traditional hybrid development is generally not configurable, and the functional implementation of the traditional hybrid development is customized and developed according to the requirements. It is also cumbersome if there is another application that wants to reuse some of the similar components, and there is no way for the components to be reused well.
Disclosure of Invention
The technical problem to be solved by the invention is as follows: the high-multiplexing application development configuration method and the system thereof are provided, the configurable problem is solved, and the reusability of the components is greatly improved.
In order to solve the technical problems, the invention adopts the technical scheme that:
the high-multiplexing application development configuration method comprises the following steps:
storing the component codes of the components to an H5 server;
selecting a target component from a component library;
assembling the target component in a self-defined manner at a web end, and configuring a driving mode of the target component in a component container to obtain an application project;
generating configuration information of the application item; the configuration information comprises page information, driving information and compiling information;
selecting an application project to be published at a web end;
the H5server side obtains the configuration information of the application item to be issued, and compiles and packages the configuration information according to the compiling information to obtain a compiled file;
and storing the compiled file to a web server.
The invention provides another technical scheme as follows:
the high-multiplexing application development configuration system comprises:
the first storage module is used for storing the component codes of all the components to an H5 server;
a first selection module for selecting a target component from a component library;
the configuration module is used for assembling the target assembly in a self-defined mode at a web end and configuring a driving mode of the target assembly in an assembly container to obtain an application project;
the generating module is used for generating configuration information of the application item; the configuration information comprises page information, driving information and compiling information;
the second selection module is used for selecting the application items to be published at the web end;
the first compiling module is used for the H5server side to obtain the configuration information of the application item to be issued, and compiling and packaging are carried out according to the compiling information in the configuration information to obtain a compiled file;
and the second storage module is used for storing the compiled file to a web server.
The invention has the beneficial effects that: storing the codes of the components in the H5 server; the method supports the page layout of the custom assembly at the web end and configures a driving mode, and realizes the precompilation of any application project; then extracting the compiling information of the application item from the compiling code as a part of the configuration information for storage; and then any application item can be selected at the web end, and compiling is carried out based on the H5server end to obtain the required application. According to the invention, through interaction among the web side, the H5server side and the web server side, custom configuration and pre-compilation of any application can be realized, the independent development of any application with high efficiency and simplicity is supported, and the configurable problem is solved, so that high multiplexing of components is realized, and the application development efficiency is improved.
Drawings
Fig. 1 is a schematic flowchart of a method for developing and configuring a high-multiplexing application according to an embodiment of the present invention;
FIG. 2 is a flowchart illustrating a first step of managing component resources according to a second embodiment of the present invention;
FIG. 3 is a diagram illustrating a component container during the second step of creating and configuring an application according to a second embodiment of the present invention;
fig. 4 is an example of driving information using a default driving manner in the process of creating and configuring an application in the second step according to the second embodiment of the present invention;
fig. 5 is an example of driving information using a custom driving method in the process of creating and configuring an application in the second step in the second embodiment of the present invention;
fig. 6 is an example of driving information using a system driving manner in the process of creating and configuring an application in the second step in the second embodiment of the present invention;
fig. 7 is an example of configuration information in the process of creating and configuring an application in the second step in the second embodiment of the present invention;
FIG. 8 is a flowchart illustrating a second step of creating and configuring a configuration file according to a second embodiment of the present invention;
fig. 9 is a schematic flowchart of a third step of packaging and publishing the application according to the second embodiment of the present invention;
FIG. 10 is a flowchart illustrating a fourth step of starting an application according to the second embodiment of the present invention;
FIG. 11 is a flowchart illustrating the application in the fourth step according to the second embodiment of the present invention;
FIG. 12 is an example of a page template of a developed application according to a third embodiment of the present invention;
FIG. 13 is a schematic diagram illustrating the components and connections of a high-multiplexing application development configuration system according to an embodiment of the present invention;
fig. 14 is a schematic diagram illustrating the components and connections of a fourth high-multiplexing application development configuration system according to an embodiment of the present invention.
Description of reference numerals:
1. a first storage module; 2. a first selected module; 3. a configuration module; 4. a generation module;
5. a second selected module; 6. a first compiling module; 7. a second storage module;
8. a third storage module; 9. a fourth storage module; 10. a first packing module;
11. a first starting module; 12. a downloading module; 13. a second packing module;
14. a second starting module; 15. and a fifth storage module.
Detailed Description
In order to explain technical contents, achieved objects, and effects of the present invention in detail, the following description is made with reference to the accompanying drawings in combination with the embodiments.
The most key concept of the invention is as follows: through the interaction among the web side, the H5server side and the web server side, the user-defined configuration and the pre-compilation of any application are realized, and the independent development of any application is supported efficiently, simply and conveniently.
The technical terms related to the invention are explained as follows:
Figure BDA0002581342680000041
referring to fig. 1, the present invention provides a method for developing and configuring a high-multiplexing application, including:
storing the component codes of the components to an H5 server;
selecting a target component from a component library;
assembling the target component in a self-defined manner at a web end, and configuring a driving mode of the target component in a component container to obtain an application project;
generating configuration information of the application item; the configuration information comprises page information, driving information and compiling information;
selecting an application project to be published at a web end;
the H5server side obtains the configuration information of the application item to be issued, and compiles and packages the configuration information according to the compiling information to obtain a compiled file;
and storing the compiled file to a web server.
From the above description, the beneficial effects of the present invention are: based on a hybrid development mode, through cooperation of five ends of H5, H5Server, Native, Web and WebServer, respective advantages of the Native and H5 are fully exerted, and boundaries of the Native and H5 are drawn; and the capability of configuration packaging and the like is provided, and the APP can be configured and generated by pre-compiling the packaged components based on the custom configuration. Therefore, the component reuse rate is greatly improved, and the problem that components cannot be reused in a hybrid development mode is solved.
Further, still include:
storing the page information and the driving information of the application project to a web server;
and storing the compiling information of the application item to the H5 server.
As can be seen from the above description, storing the compilation information directly in the H5server enables a downloading process before compilation to be omitted, thereby improving the operation efficiency and avoiding errors in the downloading process.
Further, still include:
the Native terminal packs the configuration information according to the compiled file to obtain a Native installation package matched with the Native installation package; recording the download address of the compiled file in the Native installation package;
and after the client starts the Native installation package, the Native downloads the compiled file to the local according to the download address.
As can be seen from the above description, Native end is also packaged to provide the system capability that the compiled file needs to be called; through the download address of the compiled file in the Native installation package, the application is remotely downloaded to the local, the volume of the installation package can be reduced, and the analysis speed is improved.
Further, still include:
downloading the compiled file from a web server;
a Native terminal packs the configuration information of the compiled file to obtain a Native installation package matched with the Native terminal, and stores the compiled file into the Native installation package;
and the client starts a Native installation package in which the compiled file is stored.
According to the description, the compiled files are downloaded to the installation package in advance, and then the installation package is released and put on the shelf, so that the application can be started in a network-free state only by acquiring the installation package through networking once.
Further, the configuring the driving manner of the target component in the component container comprises:
configuring a specific driving mode of every two target assemblies in the assembly container; the specific driving mode is one of a default driving mode, a user-defined driving mode and a system driving mode.
As can be seen from the above description, compared with the prior art, the components generally communicate in a data flow manner, so that there are problems of poor flexibility and difficult configuration; any two target components can be communicated in any driving mode through the driving engine, so that the flexibility of mutual calling between the components and the simplicity of driving configuration are obviously improved.
Further, still include:
storing the description information of each component to a component library of a web server; the description information includes a component name, a preview, an external call interface, and an internal call event.
As can be seen from the above description, the method supports browsing the relevant information of each component at the web service end, and provides support and convenience for the subsequent template layout configuration of the project application.
Referring to fig. 13, another technical solution provided by the present invention is:
the high-multiplexing application development configuration system comprises:
the first storage module is used for storing the component codes of all the components to an H5 server;
a first selection module for selecting a target component from a component library;
the configuration module is used for assembling the target assembly in a self-defined mode at a web end and configuring a driving mode of the target assembly in an assembly container to obtain an application project;
the generating module is used for generating configuration information of the application item; the configuration information comprises page information, driving information and compiling information;
the second selection module is used for selecting the application items to be published at the web end;
the first compiling module is used for the H5server side to obtain the configuration information of the application item to be issued, and compiling and packaging are carried out according to the compiling information in the configuration information to obtain a compiled file;
and the second storage module is used for storing the compiled file to a web server.
Further, the system further comprises:
the system further comprises:
the third storage module is used for storing the page information and the driving information of the application item to the web server;
and the fourth storage module is used for storing the compiling information of the application item to the H5 server.
Further, the system further comprises:
the first packaging module is used for packaging the Native end according to the configuration information of the compiled file to obtain a Native installation package matched with the Native end; recording the download address of the compiled file in the Native installation package;
and the first starting module is used for downloading the compiling file to the local by the Native according to the downloading address after the client starts the Native installation package.
Further, the system further comprises:
the downloading module is used for downloading the compiled file from a web server;
the second packaging module is used for packaging the Native end according to the configuration information of the compiled file to obtain a Native installation package matched with the Native end, and storing the compiled file into the Native installation package;
and the second starting module is used for starting the Native installation package in which the compiled file is stored by the client.
Further, the configuration module includes:
the configuration unit is used for configuring the specific driving mode of each two target assemblies in the assembly container; the specific driving mode is one of a default driving mode, a user-defined driving mode and a system driving mode.
Further, the system further comprises:
the fifth storage module is used for storing the description information of each component to a component library of the web server; the description information includes a component name, a preview, an external call interface, and an internal call event.
From the above description, it can be understood by those skilled in the art that the foregoing technical solution can be implemented through interaction between virtual functional modules, and the beneficial effects of the corresponding methods can also be achieved.
Example one
The embodiment provides a high-multiplexing application development configuration method, which can flexibly and efficiently develop and acquire target applications based on the high reusability of components.
The method comprises the following steps:
s1: component resources are managed.
The method specifically comprises the following steps: and storing the description information of each component to a component library of the web server, wherein the description information comprises a component name, a preview, an external calling interface and an internal calling event. And storing the component codes of the components to the H5 server.
S2: an application project is created and configured.
The method specifically comprises the following steps:
s21: entering a web end to create an application project, and then selecting a target component from a component library of a web service end; here, the target component may be one or a plurality of components;
s22: assembling the target assembly in a self-defined manner at a web end, and configuring a driving mode of the target assembly in an assembly container; here, the former completes the configuration of the application page; the latter completes the configuration of the component relationships (i.e., drives).
For the situation that the target component is one, the driving relation in the driving mode is set to be that the source component and the target component are the same component, for example, after the source component triggers a certain event, the source component reaches the component container first, and the component container calls the interface exposed by the target component according to the scheduling of the driving information;
configuring specific driving modes and driving relations of every two target assemblies in the assembly container under the condition that the number of the target assemblies is multiple;
the driving modes comprise a default driving mode, a user-defined driving mode and a system driving mode, any component can communicate by using one of the default driving mode, the user-defined driving mode and the system driving mode, and the driving modes comprise driving relations among the components.
S23: after the application items are saved, generating corresponding configuration information; the configuration information includes page information, driving information, and compiling information.
1. The page information describes the display mode of the page, including the page information of the home page and the detail page.
2. The driving information corresponds to a driving mode; component communication is achieved by being used by the driver engine, such as triggering the List component to modify the blue background color when the Tabs component switches; triggering the List component to modify the content when the Tabs component is switched; and triggering a skip routing page when the content of the List component is selected, and displaying news information.
3. The compilation information is used to compile the application, including specific routing addresses and component dependencies that need to be packed in.
S24: storing configuration information of the application item.
In one embodiment, the page information and the driving information of the application item are respectively stored in the web server, and the compiling information of the application item is stored in the H5 server.
Here, the purpose of putting the compilation information and the h5server together is to: the h5server can save the process of downloading the compiling information from other places during compiling, thereby saving the operation time and reducing errors.
S3: and packaging and releasing the application.
Specifically, the method comprises the following steps:
s31: selecting an application project to be published at a web end, and confirming to enter an application publishing step:
s32: the H5server side obtains the configuration information of the application item to be issued, and compiles and packages the configuration information according to the compiling information to obtain a compiled file; the H5server compiles only the components contained in the compilation information according to the compilation information, compiles page information and component relationships to be generated according to the page information and the drive information in the configuration information, and obtains a compiled file, namely Dist, after compilation is completed;
s33: and storing the compiled file to a specified position in a web server according to a path set by the configuration information.
S34: packing according to the configuration information of the compiled file to obtain a Native installation package matched with a Native end; that is, Native terminals matched with Dist are also packaged according to requirements, and capabilities (API) required to be called by Dist are provided through the Native terminals.
S35: and releasing a Native installation package.
In a specific example, the Native installation package records a download address of the compiled file, so that a subsequent client can obtain Dist according to address download.
In another specific example, the Native installation package directly stores the Dist, so that the subsequent client can directly install and start the application according to the Native installation package without downloading the Dist through networking, and the installation can be performed in a non-network environment only through networking once, so that the method is suitable for users with requirements on flow, and is convenient for using various network environments.
S4: the access application is launched.
After the client acquires the Native installation package and starts installation, the Native end automatically searches a download address of the Dist, downloads the download address to the local and runs the download address, and provides the download address to a Dist running environment through built-in webview. Aiming at the condition that Dist is directly stored in a Native installation package, a client side can directly operate the Dist after obtaining the Native installation package.
From the above, the general idea of the present embodiment is as follows:
firstly, managing component resources; and developing the components by developers according to the specifications and uploading the components to the component library.
Secondly, establishing a configuration application; a user enters a Web end to create and configure an application according to requirements, wherein the key is to extract compiling information from compiling, and meanwhile, configuration components are communicated through driving information;
step three, packaging and releasing the application; h5 is distributed by H5Server according to the compiled information package.
And fourthly, starting an access application and starting Native access H5.
Since the compiling information of each application item is extracted from the code and is independently stored as the configuration file, different applications can be compiled according to different compiling information in the compiling process, and thus, the multiplexing of the components is realized. For example, when looking at a certain function in APP1 and wanting to multiplex it, only page information, driver information and compiling information need to be multiplexed, and the functions are automatically brought up when released.
Example two
Referring to fig. 2 to 11, the present embodiment is further defined on the basis of the first embodiment:
the first step is as follows: component resources are managed.
After a developer has finished a component resource, the component resource needs to be stored. The storage content is divided into two parts of information: one part is component description information and the other part is component code. Wherein, the component description information mainly includes: the name, preview, triggered event and exposed interface of the assembly, etc., this part of information is stored in Web Server, namely Web Server; and the component code is the code of the actual implementation of the component, and is stored in the H5Server, namely the H5 Server.
For the component description information, it should be noted here that the components are driven by interfaces, each component provides an externally invoked interface, and the components themselves trigger some events to be thrown outwards.
For example, a simple tab classification component, the corresponding component description information includes:
Figure BDA0002581342680000111
the interface provided by the external calling module is setData, and the external component can call the interface to assign values to tab classes; if a certain classification is clicked, an onSelectdItem event is triggered, and currently selected Tab classification information Tab is transmitted to an external component for calling. Therefore, the component description information is mainly used for describing an interface calling specification of the component resource.
In addition, please refer to FIG. 2, which illustrates how a component resource is maintained. The method specifically comprises the following steps: a developer develops a component and uploads the component through a web end, fills in description information and clicks for storage; the component description information is saved to the Web Server; the component code is stored in the H5 Server; both the Web Server and the H5Server can judge whether the corresponding component id exists, if so, the corresponding component id is updated, and if not, the corresponding component id is newly added.
The second step is that: an application is created and configured.
Referring to fig. 8, first, an application project is created at the Web site, and the information of the current component library is queried from the Web Server.
In one embodiment, the component library is shown in the following table one, which describes the components contained in the current component library. It is assumed to include a Title component Title, a classification component Tabs, a List component List, and a Detail component Detail, etc.
Figure BDA0002581342680000112
Watch 1
Then, the user assembles the component resources in the existing component library according to a desired combination mode and sets the relationship (namely, a driving mode) between the component resources;
here, regarding the component relationship, it should be noted that, as shown in fig. 3, the components are run in the component container, and in this embodiment, the communication between the components is performed by a driver engine (in the prior art, the component communication is generally based on a data stream), and the driver engine is executed according to the driver information. The manner of supporting the driving of the configuration includes: default, custom, and system.
First, default type. The driver information as shown in fig. 4 describes the communication contents of the Tabs component and the List component. Where Tabs is the sort component and List is the List component. The communication process is as follows: when a certain category of Tabs is selected, the background color of the List is changed.
Line 1 of the drive information means that the source component id is Tabs; line 2 means that the id of the target component is List; line 3 and line 4 mean that the setBlueBG method of the target component is called to change the background color of the target component after the onSelectdItem method of the source component is triggered; line 5 means the parameter that the setButeBG method can receive, which is an array, where passing 1 means that the degree of color that can change the background color is 1; line 6 means that this driving scheme is the default type. Thus far, the driving relationship between the two components is explained;
the default type of driving mode only simply communicates from the source component to the target component, the called methods are all the methods already provided by the components, and the parameters are relatively fixed.
Second, custom type. The driver information as shown in fig. 5 describes the communication contents of the Tabs component and the List component. Where Tabs is the sort component and List is the List component. The communication process is as follows: when a certain classification of Tabs is selected, the contents of List are changed.
Line 1 of drive information means that the source component id is Tabs; line 2 means that the id of the target component is List; line 3 and line 4 mean that when the onSelectdItem method of the source component is triggered, the setList method of the target component is called to change the content of the target component; line 5 is a parameter that the setList method can receive, here empty, indicating that no parameter is needed; line 6 means that this driving is of a custom type; line 7 is a function that receives the source component incoming value as a parameter and returns the data incoming to the target component.
The custom type driving mode can process some business logic between the source component and the target component so as to meet specific requirements.
And the third type of system. The driver information of fig. 6 below describes the communication content of the List components and the system. Where List is a news listing component. The communication process is as follows: when a news item of the List is selected, it jumps to another page.
Line 1 of drive information means that the source component id is List; line 2 means that the target component is the routing module of the system, and __ Router is a system reserved word indicating the routing module of the accessed system, and the routing module is used for processing page jump in the system; line 3 and line 4 mean that the onSelectdItem method of the source component triggers and then calls the changePage method of the system routing module to jump to a new page; line 5 is a parameter that the changePage method can receive, indicating the address to jump to; line 6 means that this driving method is of the system type.
And the driving mode of the system type can call the capability of the system.
Based on the three driving modes, the driving mode used between any two components can be flexibly configured.
For example, there are three components, comp a, comp b, and comp c; then it is possible to configure:
one of three driving modes from the source assembly comp A to the target assembly comp A is selected;
one of three driving modes from the source assembly comp B to the target assembly comp B is selected;
one of three driving modes from the source assembly comp C to the target assembly comp C is selected;
one of three driving modes from the source assembly comp A to the target assembly comp B is selected;
one of three driving modes from the source assembly comp A to the target assembly comp C is selected;
one of three driving modes from the source assembly comp B to the target assembly comp C is selected;
one of three driving modes from the source assembly comp B to the target assembly comp A is selected;
one of three driving modes from the source assembly comp C to the target assembly comp A is selected;
one of three driving modes from the source assembly comp C to the target assembly comp B is selected;
continuing to correspond to the step, and then, storing the application project, generating two parts of configuration information: one is page information and drive information; and the other is compilation information. The page information describes the display mode of the page; the compilation information describes the dependencies of the components that the application item is to be packaged.
The js code of the components in the component library is physically in the same project. The compilation command for this project will take effect on all components. The configuration information here is used to specify which components the configuration of the current template will take effect on, and which components will be included if the project is built.
As shown in fig. 7, page information and driving information for driving components, which are a home page and a detail page, respectively, and compiling information for compiling an application.
Then, storing the page information and the driving information to a Web Server; and saving the compiling information to the H5 Server.
The third step: and packaging and releasing the application.
Referring to fig. 9, the Web end is entered, the configured application items are selected, and the configuration information and the compiling information are checked. Click on the publishing application. And the system executes a corresponding compiling task by the H5Server according to the compiling information. All component codes are stored in the H5Server, so that only components needed to be used are compiled during compiling, and other useless components are not included. And after the compiling is finished, storing the compiled file Dist to a specified position in the Web Server according to a path set by the configuration information. And finally, packing the client matched with Dist according to the compiling information and the configuration information, and providing the client with an API (application program interface) required to be called by Dist.
The fourth step: the access application is launched.
Referring to fig. 10 and 11, the installation package generated by Native end compilation includes the web app that needs to be downloaded in the defined path, and what system capabilities, such as location, contacts, storage space, etc., are provided by the current Native shell. Each client may have different capabilities as needed. After the client is started, the compiled file Dist under the corresponding url configuration is automatically searched, and the file is downloaded to the local and started. The child web app is downloaded to the mobile terminal.
In a specific example, the web app (i.e., the compiled file) may be downloaded in advance and placed into the Native app (i.e., the installation package with the Native end packaged), and then released and shelved. The web app configured in this way only needs to be downloaded through networking for the first time, and the installed app can be networked or not. If networking is required, the web app first calls local capabilities to acquire local data. And if the data needs to be updated, initiating a synchronization request to the foreground server to synchronize the local version data with the server. Then, the local data carrying the edition number and the server are synchronously stored. And finally, storing the stored result locally. The data backup is equivalent to only one server side data backup locally. And the synchronization with the server side can be carried out only under a specific scene.
Aiming at the defect that the hybrid development has poor component reusability, the development process of the App is abstracted into components with uniform specifications, the App is configured for developing the components, and then the components can be reused continuously as long as the components are made according to the specifications, so that the component reusability is greatly improved.
EXAMPLE III
This embodiment corresponds to the first and second embodiments, and provides a specific application scenario:
and developing a mobile phone APP for the news notification announcement. Referring to fig. 12, the top page is a news listing, switching the top category can set the background color of the listing, and place the content under the corresponding category into the listing. Clicking on a particular news item in the list may jump to the news details page. The layout of the detail pages is from top to bottom sequentially. The contents of news are classified into a picture type and a video type. The layout of news with content containing pictures in the list items is left-right structure, with title and description on the left, and picture preview on the right. The news, whose content contains video, is structured above and below in the list item, with title and description above and video preview below.
The APP is now configured and developed using the scheme provided in the first embodiment.
First, component resources are managed.
And entering a Web end, and checking whether the resources of the current component library meet the requirements. If not, the user needs to develop the missing component by himself and then upload the component to the component library, and if yes, the user directly enters the second step.
Second, a configuration application is created.
And entering the Web end, and creating a news _ app. Several components are found in the List, a Title component to display the top Title, a Tabs component to display news categories, a List container component to display news listings, a Layout, a Row, a Col component, an image component, and a textarea component.
The APP starts to be configured. A Title is configured to require a Title component, a Tabs component is configured to configure a news type, a List component is configured to configure a news List, and display styles of different contents are defined in a container, a left-right structure is displayed with type 1, and a top-bottom structure is displayed with type 2.
Specifically, the page information includes home page information and detail page information. When the driving information comprises the switching of the Tabs component, the List component is triggered to modify the blue background color; triggering the List component to modify the content when the Tabs component is switched; and triggering a skip routing page when the content of the List component is selected, and displaying news information. The compiled information contains two routing addresses and component dependencies that need to be packed in.
Then, saving the page information and the driving information to a Web Server; and the compiled information is saved in the H5 Server.
And thirdly, packaging and releasing the application.
Selecting application news _ app to be issued, compiling related components and page information to be generated into Dist by the system to the H5Server according to the compiling information; then storing the compiled packets to a Web Server; and the Native end is also packaged out according to the requirement; native should provide the ability that Dist needs to call. And issuing a Native, and recording the address of the client needing to download Dist.
And fourthly, starting the access application.
The Native package is installed on the mobile phone client, and after the Native package is started, the Native can automatically search for the address of the Dist and download the Dist to the local. Dist is run. The Dist runtime environment is provided with a built-in webview.
The user starts to use the application, such as store data, which is provided with API by Native in advance, and then Native will request H5Server and process the returned data and return it to H5.
Example four
In a first embodiment, a high-multiplexing application development configuration system is provided, please refer to fig. 14, which includes:
the first storage module 1 is used for storing the component codes of all the components to the H5 server;
a first selection module 2, for selecting a target component from the component library;
the configuration module 3 is used for assembling the target component in a self-defined manner at a web end, and configuring a driving mode and a driving relation of the target component in a component container to obtain an application project;
the generating module 4 is used for generating configuration information of the application item; the configuration information comprises page information, driving information and compiling information;
the second selection module 5 is used for selecting the application items to be published at the web end;
the first compiling module 6 is used for the H5server to obtain the configuration information of the application to be issued, and to compile and package according to the compiling information therein to obtain a compiled file;
and the second storage module 7 is used for storing the compiled file to a web server.
Further, the system further comprises:
the third storage module 8 is used for storing the page information and the driving information of the application item to the web server;
a fourth storage module 9, configured to store the compiling information of the application item to the H5 server.
Further, the system further comprises:
the first packaging module 10 is used for packaging the Native end according to the configuration information of the compiled file to obtain a Native installation package matched with the Native end; recording the download address of the compiled file in the Native installation package;
and the first starting module 11 is used for downloading the compiling file to the local by the Native according to the downloading address after the client starts the Native installation package.
Further, the system further comprises:
a downloading module 12, configured to download the compiled file from a web server;
the second packaging module 13 is used for a Native end to package according to the configuration information of the compiled file to obtain a Native installation package matched with the Native installation package, and storing the compiled file into the Native installation package;
and the second starting module 14 is used for starting the Native installation package in which the compiled file is stored by the client.
Further, the configuration module includes:
the configuration unit is used for configuring the specific driving mode of each two target assemblies in the assembly container; the specific driving mode is one of a default driving mode, a user-defined driving mode and a system driving mode.
Further, the system further comprises:
a fifth storage module 15, configured to store description information of each component in a component library of the web server; the description information includes a component name, a preview, an external call interface, and an internal call event.
In summary, the high-multiplexing application development configuration method and the system thereof provided by the invention can greatly improve the reusability and the application development efficiency of the components in the hybrid development mode, and realize the configuration of the target application in a customized, efficient and convenient manner; meanwhile, various specific examples are provided, so that the operation efficiency is further improved, and the error probability is reduced; furthermore, the driving mode among the components is flexibly configured according to the requirements, and the flexibility of mutual calling among the components is improved; in addition, the invention has the characteristics of strong practicability, easy realization, simple and convenient operation and the like.
The above description is only an embodiment of the present invention, and not intended to limit the scope of the present invention, and all equivalent changes made by using the contents of the present specification and the drawings, or applied directly or indirectly to the related technical fields, are included in the scope of the present invention.

Claims (10)

1. The high-multiplexing application development configuration method is characterized by comprising the following steps:
storing the component codes of the components to an H5 server;
selecting a target component from a component library;
assembling the target component in a self-defined manner at a web end, and configuring a driving mode of the target component in a component container to obtain an application project;
generating configuration information of the application item; the configuration information comprises page information, driving information and compiling information;
selecting an application project to be published at a web end;
the H5server side obtains the configuration information of the application item to be issued, and compiles and packages the configuration information according to the compiling information to obtain a compiled file;
and storing the compiled file to a web server.
2. The method for high-multiplexing application development configuration according to claim 1, further comprising:
storing the page information and the driving information of the application project to a web server;
and storing the compiling information of the application item to the H5 server.
3. The method for high-multiplexing application development configuration according to claim 1, further comprising:
the Native terminal packs the configuration information according to the compiled file to obtain a Native installation package matched with the Native installation package; recording the download address of the compiled file in the Native installation package;
and after the client starts the Native installation package, the Native downloads the compiled file to the local according to the download address.
4. The method for high-multiplexing application development configuration according to claim 1, further comprising:
downloading the compiled file from a web server;
a Native terminal packs the configuration information of the compiled file to obtain a Native installation package matched with the Native terminal, and stores the compiled file into the Native installation package;
and the client starts a Native installation package in which the compiled file is stored.
5. The method for configuring high-multiplexing application development according to claim 1, wherein the configuring the driving manner and the driving relationship of the target component in the component container comprises:
configuring the specific driving mode and driving relation of every two target assemblies in the assembly container; the specific driving mode is one of a default driving mode, a user-defined driving mode and a system driving mode.
6. The method for high-multiplexing application development configuration according to claim 1, further comprising:
storing the description information of each component to a component library of a web server; the description information includes a component name, a preview, an external call interface, and an internal call event.
7. The high-multiplexing application development configuration system is characterized by comprising:
the first storage module is used for storing the component codes of all the components to an H5 server;
a first selection module for selecting a target component from a component library;
the configuration module is used for assembling the target component in a self-defined manner at a web end and configuring the driving mode and the driving relation of the target component in the component container to obtain an application project;
the generating module is used for generating configuration information of the application item; the configuration information comprises page information, driving information and compiling information;
the second selection module is used for selecting the application items to be published at the web end;
the first compiling module is used for the H5server side to obtain the configuration information of the application item to be issued, and compiling and packaging are carried out according to the compiling information in the configuration information to obtain a compiled file;
and the second storage module is used for storing the compiled file to a web server.
8. The high-multiplex application development configuration system of claim 7, said system further comprising:
the third storage module is used for storing the page information and the driving information of the application item to the web server;
and the fourth storage module is used for storing the compiling information of the application item to the H5 server.
9. The high-multiplex application development configuration system of claim 7, said system further comprising:
the first packaging module is used for packaging the Native end according to the configuration information of the compiled file to obtain a Native installation package matched with the Native end; recording the download address of the compiled file in the Native installation package;
and the first starting module is used for downloading the compiling file to the local by the Native according to the downloading address after the client starts the Native installation package.
10. The high-multiplex application development configuration system of claim 7, said system further comprising:
the downloading module is used for downloading the compiled file from a web server;
the second packaging module is used for packaging the Native end according to the configuration information of the compiled file to obtain a Native installation package matched with the Native end, and storing the compiled file into the Native installation package;
and the second starting module is used for starting the Native installation package in which the compiled file is stored by the client.
CN202010668495.0A 2020-07-13 2020-07-13 High-multiplexing application development configuration method and system thereof Active CN111949261B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202010668495.0A CN111949261B (en) 2020-07-13 2020-07-13 High-multiplexing application development configuration method and system thereof

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202010668495.0A CN111949261B (en) 2020-07-13 2020-07-13 High-multiplexing application development configuration method and system thereof

Publications (2)

Publication Number Publication Date
CN111949261A true CN111949261A (en) 2020-11-17
CN111949261B CN111949261B (en) 2023-07-07

Family

ID=73341735

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202010668495.0A Active CN111949261B (en) 2020-07-13 2020-07-13 High-multiplexing application development configuration method and system thereof

Country Status (1)

Country Link
CN (1) CN111949261B (en)

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN112650487A (en) * 2020-12-31 2021-04-13 南方电网数字电网研究院有限公司 Hybrid application development method, system, computer device and storage medium
CN112860344A (en) * 2021-02-19 2021-05-28 中国工商银行股份有限公司 Component processing method and device, electronic equipment and storage medium
CN113742615A (en) * 2021-09-13 2021-12-03 国泰君安证券股份有限公司 System, method and device for realizing dynamic data component application, processor and computer readable storage medium thereof
CN114764352A (en) * 2021-01-15 2022-07-19 北京猎户星空科技有限公司 Business service providing method, intelligent device and storage medium

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20020065851A1 (en) * 2000-06-02 2002-05-30 Watson Emerson C. System and method for creating a website
CN104539697A (en) * 2014-12-26 2015-04-22 北京新学堂网络科技有限公司 Client end, server and method for making Android mobile application
CN109325203A (en) * 2018-09-10 2019-02-12 北京亚鸿世纪科技发展有限公司 The device of Web system visualization multiplexing is realized in a kind of automation
CN109901838A (en) * 2019-01-17 2019-06-18 平安证券股份有限公司 Front end development approach, device, equipment and storage medium based on modularization

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20020065851A1 (en) * 2000-06-02 2002-05-30 Watson Emerson C. System and method for creating a website
CN104539697A (en) * 2014-12-26 2015-04-22 北京新学堂网络科技有限公司 Client end, server and method for making Android mobile application
CN109325203A (en) * 2018-09-10 2019-02-12 北京亚鸿世纪科技发展有限公司 The device of Web system visualization multiplexing is realized in a kind of automation
CN109901838A (en) * 2019-01-17 2019-06-18 平安证券股份有限公司 Front end development approach, device, equipment and storage medium based on modularization

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
夏德洲等: "Android***软件开发 底层", 中国铁道出版社 *

Cited By (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN112650487A (en) * 2020-12-31 2021-04-13 南方电网数字电网研究院有限公司 Hybrid application development method, system, computer device and storage medium
CN112650487B (en) * 2020-12-31 2024-01-23 南方电网数字平台科技(广东)有限公司 Hybrid application development method, system, computer device and storage medium
CN114764352A (en) * 2021-01-15 2022-07-19 北京猎户星空科技有限公司 Business service providing method, intelligent device and storage medium
CN112860344A (en) * 2021-02-19 2021-05-28 中国工商银行股份有限公司 Component processing method and device, electronic equipment and storage medium
CN113742615A (en) * 2021-09-13 2021-12-03 国泰君安证券股份有限公司 System, method and device for realizing dynamic data component application, processor and computer readable storage medium thereof

Also Published As

Publication number Publication date
CN111949261B (en) 2023-07-07

Similar Documents

Publication Publication Date Title
CN111949261A (en) High-multiplexing application development configuration method and system
US9342613B2 (en) Display and installation of portlets on a client platform
CN103237083B (en) A kind of mobile information service resource paradigmatic system and method
US20090132220A1 (en) Method For Creating A Telecommunications Application
US20060064422A1 (en) Data sharing system, method and software tool
CN110688232B (en) Application program calling method, terminal equipment and computer readable storage medium
US20090129575A1 (en) System And Computer Program Product For Creating A Telecommunications Application
CN109597604B (en) iOS platform based APP modularization development method, device and equipment
CN109144478B (en) Component frame system and method of using the same
WO2007087727A1 (en) System and method for extending a component-based application platform with custom services
CN104750528A (en) Management method and device for components in Android program
CN112286504B (en) Method for realizing development and loading of applet based on REACTNATIVE in mobile APP
CN108804158A (en) Application call method, the control method of terminal device, terminal device and computer readable storage medium
CN114125028A (en) Running method, device, equipment, storage medium and program product of micro application
CN109240697A (en) Calling processing method and device, storage medium
CN108804100B (en) Method and device for creating interface element, storage medium and mobile terminal
Chang et al. Developing mobile applications on the Android platform
CN111679828B (en) Data processing method and device, electronic equipment and storage medium
CN103917951B (en) Application invocation method, operating system and browser
CN104581695A (en) Mobile terminal configuration method and system
CN114217908B (en) Container starting method, system, device and equipment
CN114356520A (en) Running method, device, equipment, storage medium and program product of micro application
CN113010206A (en) Containerization method, system and device for WEB application system
CN112463289A (en) Method, system, equipment and medium for realizing application service based on virtual machine
CN113050962A (en) Mobile service upgrading method, device and terminal

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant