CN111506298A - Method for carrying out interface visual configuration based on JSON object - Google Patents
Method for carrying out interface visual configuration based on JSON object Download PDFInfo
- Publication number
- CN111506298A CN111506298A CN202010160468.2A CN202010160468A CN111506298A CN 111506298 A CN111506298 A CN 111506298A CN 202010160468 A CN202010160468 A CN 202010160468A CN 111506298 A CN111506298 A CN 111506298A
- Authority
- CN
- China
- Prior art keywords
- interface
- information
- configuration file
- page
- json object
- 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.)
- Pending
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/20—Software design
- G06F8/24—Object-oriented
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/34—Graphical or visual programming
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/445—Program loading or initiating
- G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
The invention discloses a method for carrying out visual interface configuration based on JSON objects, which comprises the steps of generating a configuration file of an interface, and defining a JSON format of the configuration file of the interface; rendering interface configuration information on an interface management page to realize the visualization of an interface; on the interface management page, the operations of inputting, searching, modifying, deleting and the like are carried out on the interface, so that the unified visual management of the interface is realized; by analyzing the json object field, the json object field is rendered to the interface management page, operations such as adding, deleting, modifying, checking and searching of interfaces are realized in the interface management page, unified visual management of all interfaces of one or more projects is realized, the complexity of codes is reduced, and the coding efficiency is improved.
Description
Technical Field
The invention relates to the field of computer internet research, in particular to a platform front-end and back-end technology characteristic function class, and particularly relates to a method for carrying out interface visual configuration based on JSON objects.
Background
The dynamic data interaction of the front end cannot leave the interface provided by the server, and the request and the response of the interface are indispensable in a middle background project with separated front and back ends. Interface files are generally configured in projects in the prior front-end development, effective interface management and packaging are realized, and the uniformity and maintainability of project interface calling are improved. In the process of implementing the invention, the inventor finds that at least the following problems exist in the prior art: the existing method for locally configuring the interface file is to directly input the interface address, the interface description information and the like defined by the interface document into the local configuration file, the interface configuration file cannot visually display the interface information, and as time goes on, the number of the interfaces increases, a certain interface is searched in a project, a module corresponding to the interface is known, a specific calling mode, information corresponding to a field and a data rule become very inconvenient. When the interface is not developed at the back end, the local simulation data is complicated, and the development efficiency is reduced.
Disclosure of Invention
In order to overcome the defects of the prior art, the embodiment of the present disclosure provides a method for performing interface visualization configuration based on JSON objects, which implements unified visualization management of all interfaces of one or more projects, reduces the complexity of codes, and improves the coding efficiency. The technical scheme is as follows:
generating a configuration file of an interface, and defining a json format of the configuration file of the interface;
rendering interface configuration information on an interface management page to realize interface visualization
On the interface management page, the operations of inputting, searching, modifying, deleting and the like are carried out on the interface, so that the unified visual management of the interface is realized;
preferably, the interface configuration information is rendered on the interface management page to realize visualization of the interface, specifically: adding an interface management page, reading information of an interface configuration file through nodejs, traversing the configuration file, and returning file information to the interface management page according to a json object; in the interface management page, a json object of the interface is obtained, the json object is traversed, and interface information is rendered into a table on the page to realize the visualization of the interface.
Preferably, the operations such as entering, searching, modifying, deleting and the like are performed on the interface, so as to realize unified visual management of the interface, which specifically comprises: in an interface management page, an interface is input according to interface documents defined by a front end and a back end, interface information is input in a page form, a markdown editor is introduced in the edition, so that the MOCK rule edition is simpler and easier to read, the input form information is verified, the input data is ensured to meet the subsequent use requirements, and the data added to the form is written into a configuration file of the interface through nodejs; interface searching is carried out in the page according to parameters such as an interface method, an interface address, interface description and the like, and an interface required to be inquired is quickly positioned; editing the input interface information again, modifying the interface configuration information, and synchronizing the modified interface information to an interface configuration file through nodejs; deleting the interfaces in the page singly or in batches, and deleting the corresponding interfaces in the interface configuration file through nodejs;
and synchronously rendering the interface information in the configuration file to a table on a page when the operation of inputting, modifying and deleting is finished, thereby realizing the unified and visual management of the interface.
Preferably, after the unified visual management of the interfaces is realized, the method further includes the following steps: and uniformly generating a calling method based on the MOCK data and the service logic data according to the configuration information of each interface, judging whether the back-end service logic interface is finished or not, and finishing interface debugging.
Preferably, the method for uniformly generating the call based on the MOCK data and the service logic data specifically includes: in the interface calling method generation module, uniformly generating a calling method of each interface; reading an interface configuration file, generating a calling function of the fun field corresponding to the name according to the fun field of the interface, generating a method for interactively acquiring service logic data with a rear end in the function according to an interface url and a method field, introducing MOCKJS, and generating a method for acquiring MOCK data according to an MOCK rule of the interface.
The judging whether the back-end service logic interface is completed or not is to complete the interface debugging, and specifically includes: calling an interface method in a project, completing a back-end service logic interface, transmitting true in the method, acquiring business logic data by using a param parameter, transmitting false in the method if the back-end interface is not completed, acquiring MOCK data by using the param parameter, and completing interface debugging.
Compared with the prior art, one of the technical schemes has the following beneficial effects: by analyzing the json object field, the json object field is rendered to the interface management page, operations such as adding, deleting, modifying, checking and searching of interfaces are realized in the interface management page, unified visual management of all interfaces of one or more projects is realized, the complexity of codes is reduced, and the coding efficiency is improved. Meanwhile, a unified interface calling method independent of the development progress of the back end is provided, developers do not need to edit the calling method of each interface independently, and only need to pay attention to the logic processing after the data is returned; the MOCKJS front end is introduced, so that the development of a real interface is not required to be finished by a background, and the debugging is more flexible.
Drawings
Fig. 1 is a flowchart of a method for visualizing an interface based on a JSON object according to an embodiment of the present disclosure.
Fig. 2 is a diagram for generating an interface calling method according to an embodiment of the present disclosure.
Detailed Description
In order to clarify the technical solution and the working principle of the present invention, the embodiments of the present disclosure will be described in further detail with reference to the accompanying drawings.
All the above optional technical solutions may be combined arbitrarily to form the optional embodiments of the present disclosure, and are not described herein again.
The terms "step 1," "step 2," "step 3," and the like in the description and claims of this application and the above-described drawings are used for distinguishing between similar elements and not necessarily for describing a particular sequential or chronological order. It should be understood that the data so used may be interchanged under appropriate circumstances such that the embodiments of the application described herein may, for example, be implemented in an order other than those described herein.
The embodiment of the present disclosure provides a method for performing interface visualization configuration based on a JSON object, and fig. 1 is a flowchart of a method for performing interface visualization based on a JSON object provided in the embodiment of the present disclosure, and in combination with the flowchart, the method mainly includes the following steps:
step 1: generating a configuration file of an interface, and defining a json format of the configuration file of the interface; defining a format of a json object according to table 1;
TABLE 1json object Format description
Step 2: rendering interface configuration information on an interface management page to realize interface visualization
Preferably, the specific method of step 2 is as follows: adding an interface management page, reading information of an interface configuration file through nodejs, traversing the configuration file, and returning file information to the interface management page according to a json object;
acquiring a json object of an interface in an interface management page, traversing the json object, rendering interface information into a table on the page, and realizing the visualization of the interface;
step 3, performing operations such as inputting, searching, modifying, deleting and the like on the interface management page to realize unified visual management of the interface
Further, the specific method in step 3 is as follows: in an interface management page, an interface is input according to interface documents defined by a front end and a back end, interface information is input in a page form, a markdown editor is introduced in the edition, so that the MOCK rule edition is simpler and easier to read, the input form information is verified, the input data is ensured to meet the subsequent use requirements, and the data added to the form is written into a configuration file of the interface through nodejs; interface searching is carried out in the page according to parameters such as an interface method, an interface address, interface description and the like, and an interface required to be inquired is quickly positioned; editing the input interface information again, modifying the interface configuration information, and synchronizing the modified interface information to an interface configuration file through nodejs; and carrying out single or batch deletion operation on the interfaces in the page, and deleting the corresponding interfaces in the interface configuration file through nodejs. And synchronously rendering the interface information in the configuration file to a table on a page when the operation of inputting, modifying and deleting is finished, thereby realizing the unified and visual management of the interface.
Preferably, the method further comprises the step 4: uniformly generating a calling method based on MOCK data and service logic data according to the configuration information of each interface;
and in the interface calling method generation module, uniformly generating a calling method of each interface. Reading an interface configuration file, generating a call function with a name corresponding to a fun field according to the fun field of an interface, generating a method for interactively acquiring service logic data with a back end in the function according to an interface url and a method field, introducing a MOCKs, and generating a method for acquiring the MOCK data according to a MOCK rule of the interface, as shown in fig. 2, fig. 2 is a graph generated by an interface call method provided by the embodiment of the present disclosure. In the initial development stage of an interface, a front-end developer and a back-end developer can define an interface document first. The back end develops an interface according to the service logic requirement, after the interface is developed, service logic data are returned to the front end according to a rule format agreed in an interface document, and the front end calls the interface to acquire the service logic data, so that the interactive debugging of the interface is realized. In an embodiment of the invention, a front-end developer can directly define a MOCK rule of an interface according to an agreed interface document, introduce MOCKJS into a project, and generate test data according to the MOCK rule. The front-end developer can directly call the MOCK data corresponding to the interface for debugging and subsequent development without waiting for the interface of the back-end developer, so that the coupling with the back-end development is reduced, and the working efficiency is improved.
And 5: judging whether the back-end service logic interface is finished or not, and finishing the interface debugging
Calling an interface method in a project, completing a back-end service logic interface, transmitting true in the method, acquiring business logic data by using a param parameter, transmitting false in the method if the back-end interface is not completed, acquiring MOCK data by using the param parameter, and completing interface debugging.
The invention has been described above by way of example with reference to the accompanying drawings, it being understood that the invention is not limited to the specific embodiments described above, but is capable of numerous insubstantial modifications when implemented in accordance with the principles and solutions of the present invention; or directly apply the conception and the technical scheme of the invention to other occasions without improvement and equivalent replacement, and the invention is within the protection scope of the invention.
Claims (6)
1. A method for carrying out interface visualization configuration based on JSON objects is characterized by comprising the following steps:
generating a configuration file of an interface, and defining a json format of the configuration file of the interface;
rendering interface configuration information on an interface management page to realize interface visualization
And on the interface management page, the operations of inputting, searching, modifying, deleting and the like are carried out on the interface, so that the unified visual management of the interface is realized.
2. The method for performing interface visualization configuration based on a JSON object according to claim 1, wherein the interface configuration information is rendered on an interface management page to realize interface visualization, and specifically: adding an interface management page, reading information of an interface configuration file through nodejs, traversing the configuration file, and returning file information to the interface management page according to a json object; in the interface management page, a json object of the interface is obtained, the json object is traversed, and interface information is rendered into a table on the page to realize the visualization of the interface.
3. The method for visually configuring the interface based on the JSON object according to claim 2, wherein the operations such as entry, search, modification, deletion and the like are performed on the interface to realize unified visual management of the interface, and specifically, the operations are as follows: in an interface management page, an interface is input according to interface documents defined by a front end and a back end, interface information is input in a page form, a markdown editor is introduced in the edition, so that the MOCK rule edition is simpler and easier to read, the input form information is verified, the input data is ensured to meet the subsequent use requirements, and the data added to the form is written into a configuration file of the interface through nodejs; interface searching is carried out in the page according to parameters such as an interface method, an interface address, interface description and the like, and an interface required to be inquired is quickly positioned; editing the input interface information again, modifying the interface configuration information, and synchronizing the modified interface information to an interface configuration file through nodejs; and carrying out single or batch deletion operation on the interfaces in the page, and deleting the corresponding interfaces in the interface configuration file through nodejs.
4. The method for visually configuring an interface based on a JSON object according to any one of claims 1-3, further comprising the steps of: and uniformly generating a calling method based on the MOCK data and the service logic data according to the configuration information of each interface, judging whether the back-end service logic interface is finished or not, and finishing interface debugging.
5. The method for visually configuring an interface based on a JSON object according to claim 4, wherein the method for uniformly generating the call based on the MOCK data and the service logic data includes: in the interface calling method generation module, uniformly generating a calling method of each interface; reading an interface configuration file, generating a calling function of the fun field corresponding to the name according to the fun field of the interface, generating a method for interactively acquiring service logic data with a rear end in the function according to an interface url and a method field, introducing MOCKJS, and generating a method for acquiring MOCK data according to an MOCK rule of the interface.
6. The method for visually configuring an interface based on a JSON object according to claim 5, wherein the determining whether the backend business logic interface is completed or not is to complete interface debugging, and specifically comprises: calling an interface method in a project, completing a back-end service logic interface, transmitting true in the method, acquiring business logic data by using a param parameter, transmitting false in the method if the back-end interface is not completed, acquiring MOCK data by using the param parameter, and completing interface debugging.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010160468.2A CN111506298A (en) | 2020-03-10 | 2020-03-10 | Method for carrying out interface visual configuration based on JSON object |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202010160468.2A CN111506298A (en) | 2020-03-10 | 2020-03-10 | Method for carrying out interface visual configuration based on JSON object |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN111506298A true CN111506298A (en) | 2020-08-07 |
Family
ID=71869006
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202010160468.2A Pending CN111506298A (en) | 2020-03-10 | 2020-03-10 | Method for carrying out interface visual configuration based on JSON object |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN111506298A (en) |
Cited By (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN111949613A (en) * | 2020-08-11 | 2020-11-17 | 深圳市前海手绘科技文化有限公司 | Method for editing and saving JSON configuration file |
| CN112558945A (en) * | 2020-11-25 | 2021-03-26 | 紫光云技术有限公司 | Novel modular page design method |
| CN113031947A (en) * | 2021-03-05 | 2021-06-25 | 苏州帝博信息技术有限公司 | Configuration data management method and device used in interface design tool |
| CN113254914A (en) * | 2021-04-24 | 2021-08-13 | 中电长城网际系统应用广东有限公司 | Front-end and back-end synchronous management method and system based on visual display |
| CN113590113A (en) * | 2021-07-20 | 2021-11-02 | 远光软件股份有限公司 | Interface generation method, equipment and computer readable storage medium |
Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20160371129A1 (en) * | 2013-07-05 | 2016-12-22 | Zte Corporation | Interface call system and method |
| CN106648556A (en) * | 2015-10-28 | 2017-05-10 | 北京国双科技有限公司 | Front end and back end integrated development testing method and device |
| CN108572823A (en) * | 2018-04-23 | 2018-09-25 | 武汉斗鱼网络科技有限公司 | Front and back end development management method and system based on interface engine |
| CN109726108A (en) * | 2018-06-04 | 2019-05-07 | 平安普惠企业管理有限公司 | Front-end code test method, device, system and medium based on analogue data |
| CN110489101A (en) * | 2019-07-15 | 2019-11-22 | 北京字节跳动网络技术有限公司 | Interface analogy method, system, medium and electronic equipment |
| CN110704030A (en) * | 2019-09-26 | 2020-01-17 | 北京达佳互联信息技术有限公司 | Interface configuration information generation method and device, electronic equipment and storage medium |
-
2020
- 2020-03-10 CN CN202010160468.2A patent/CN111506298A/en active Pending
Patent Citations (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20160371129A1 (en) * | 2013-07-05 | 2016-12-22 | Zte Corporation | Interface call system and method |
| CN106648556A (en) * | 2015-10-28 | 2017-05-10 | 北京国双科技有限公司 | Front end and back end integrated development testing method and device |
| CN108572823A (en) * | 2018-04-23 | 2018-09-25 | 武汉斗鱼网络科技有限公司 | Front and back end development management method and system based on interface engine |
| CN109726108A (en) * | 2018-06-04 | 2019-05-07 | 平安普惠企业管理有限公司 | Front-end code test method, device, system and medium based on analogue data |
| CN110489101A (en) * | 2019-07-15 | 2019-11-22 | 北京字节跳动网络技术有限公司 | Interface analogy method, system, medium and electronic equipment |
| CN110704030A (en) * | 2019-09-26 | 2020-01-17 | 北京达佳互联信息技术有限公司 | Interface configuration information generation method and device, electronic equipment and storage medium |
Cited By (6)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN111949613A (en) * | 2020-08-11 | 2020-11-17 | 深圳市前海手绘科技文化有限公司 | Method for editing and saving JSON configuration file |
| CN112558945A (en) * | 2020-11-25 | 2021-03-26 | 紫光云技术有限公司 | Novel modular page design method |
| CN113031947A (en) * | 2021-03-05 | 2021-06-25 | 苏州帝博信息技术有限公司 | Configuration data management method and device used in interface design tool |
| CN113254914A (en) * | 2021-04-24 | 2021-08-13 | 中电长城网际系统应用广东有限公司 | Front-end and back-end synchronous management method and system based on visual display |
| CN113590113A (en) * | 2021-07-20 | 2021-11-02 | 远光软件股份有限公司 | Interface generation method, equipment and computer readable storage medium |
| CN113590113B (en) * | 2021-07-20 | 2024-06-11 | 远光软件股份有限公司 | Interface generation method, device and computer readable storage medium |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN111506298A (en) | Method for carrying out interface visual configuration based on JSON object | |
| CN108958736B (en) | Page generation method and device, electronic equipment and computer readable medium | |
| US11074067B2 (en) | Auto-generation of application programming interface (API) documentation via implementation-neutral analysis of API traffic | |
| CN110858172A (en) | Automatic test code generation method and device | |
| CN113010827B (en) | Page rendering method and device, electronic equipment and storage medium | |
| CN108460068B (en) | Method, device, storage medium and terminal for importing and exporting report | |
| CN113434396A (en) | Interface test method, device, equipment, storage medium and program product | |
| CN111597110A (en) | Page testing method and device, electronic equipment and storage medium | |
| CN111309317A (en) | Code automation method and device for realizing data visualization | |
| CN201435074Y (en) | Device for generating test case based on member | |
| CN113138927A (en) | Software function testing method and device | |
| CN113377653A (en) | Method and device for generating test case | |
| US20120131543A1 (en) | Method and system for capturing user interface structure in a model based software system | |
| CN113836014A (en) | Interface testing method and device, electronic equipment and storage medium | |
| CN112667517A (en) | Method, device, equipment and storage medium for acquiring automatic test script | |
| CN112346608A (en) | Page display method and device based on business activity result display and electronic equipment | |
| CN111949510B (en) | Test processing method, device, electronic equipment and readable storage medium | |
| CN111400623A (en) | Method and apparatus for searching information | |
| CN112579428A (en) | Interface testing method and device, electronic equipment and storage medium | |
| CN112256567A (en) | Remote calling simulation and test system | |
| CN117873482A (en) | Code verification method, device and equipment of intelligent contract and storage medium | |
| CN115982441A (en) | Data processing method and device | |
| CN115061835A (en) | Method and device for determining method call relation | |
| CN115129305A (en) | Front-end code generation method and device, storage medium and computer equipment | |
| CN113282851A (en) | Application integration system and application integration method |
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 | ||
| RJ01 | Rejection of invention patent application after publication |
Application publication date: 20200807 |
|
| RJ01 | Rejection of invention patent application after publication |