Method and device for implementing front-end request sending processing based on swagger, processor and computer readable storage medium thereof

Abstract

The application relates to a method for realizing front-end request sending processing based on swagger, which comprises the following steps: writing a service end interface according to a REST specification, and generating a swagger file; writing an interface description file template by a front end; writing a swagger analysis script file by the front end, and generating an interface description file; running the swagger analysis script file; writing a sending request instruction based on an interface identifier by the front end; and calling the sending request instruction to send a request to the service end and acquire return data. The application also relates to a device for realizing front-end request sending processing based on swagger, a processor and a computer readable storage medium. The method, the device, the processor and the computer readable storage medium for realizing front-end request sending processing based on swagger reduce the workload of front-end developers, do not need to write a large amount of repeated codes, and can only need to execute a swagger analysis script after a new swagger file is generated by a back end to complete interface updating.

Description

TECHNICAL FIELD

[0001] The present application relates to the field of front-end and back-end separation development mode, especially to the field of front-end request, and particularly to a method and device for realizing front-end request sending processing based on swagger, a processor and a computer readable storage medium thereof. BACKGROUND

[0002] The present application increases annotations when writing rest interfaces on the server side, generates swagger, and describes the url, request type, and parameter format of the method. The front end writes JavaScript scripts for parsing swagger files, and generates interface js files corresponding to the back-end interfaces. The files are used to describe the name, request type, and parameter format of each interface. The front end encapsulates the request sending method for the interface file. The method receives the id of the unique interface and the parameters required for request sending. Then, the corresponding interface configuration is searched in the interface js file according to the id, the parameters are spliced according to the requirements, and a request is sent to the back end. The returned value of the back end is used as the return value of the method. When the front end needs to call the back-end interface, it only needs to call the encapsulated request sending method and pass in the method id and request parameters. This reduces the impact of back-end interface modification on the front end and improves coding efficiency.

[0003] In the front-end and back-end separation development mode, the front end calls the back-end interface by sending a request with a filled url and parameters. The most common method is to import the jQuery library in the project and call the ajax method of jQuery. The method receives parameters related to request sending configuration, such as the url of the interface, the request type, the request parameters, and other configurations, and a success callback method. The front end passes the parameters required by the ajax method into the ajax method, which can send a request to the back end. The success callback method of ajax is implemented to receive the parameters returned by the back end for subsequent processing. The url of the request is consistent with the url of the back-end interface. If query parameters or path parameters need to be spliced, the front end needs to splice the parameters into the interface url in advance before calling the ajax method to send the request. The body parameter is passed into the ajax request as a parameter configuration.

[0004] The method of sending a request to the back end by calling the ajax method is extremely inefficient. Because the back-end interface needs to be called through the corresponding url and the parameters need to be spliced into the url, even if the same interface is called, different parameters need to be written twice to send a request to the back end. During development, the back-end interface is often modified, so the related code for sending requests by the front end needs to be adjusted, and the testing work also needs to be done again. This method leads to a large amount of redundant front-end code. Even if the front-end and back-end separation development mode is adopted, the impact of back-end interface changes on the front end is also great. SUMMARY

[0005] The present application aims to overcome the above-mentioned shortcomings of the prior art, and provide a method, device, processor and computer readable storage medium for sending a front-end request based on swagger, which is simple to operate and has a wide range of applications.

[0006] To achieve the above-mentioned purpose, the method, device, processor and computer readable storage medium for sending a front-end request based on swagger of the present application are as follows:

[0007] The method for sending a front-end request based on swagger mainly comprises the following steps:

[0008] (1) Writing a server interface according to the REST specification and generating a swagger file;

[0009] (2) Writing an interface description file template on the front end;

[0010] (3) Writing a swagger parsing script file on the front end and generating an interface description file;

[0011] (4) Running the swagger parsing script file;

[0012] (5) Writing a request sending instruction based on an interface identifier on the front end;

[0013] (6) Calling the request sending instruction to send a request to the server and obtaining returned data.

[0014] Preferably, the method further comprises the following step:

[0015] (7) Determining whether the back-end interface needs to be adjusted, if yes, then continuing step (1); otherwise, exiting the step.

[0016] Preferably, the step (1) specifically comprises the following steps:

[0017] (1.1) Writing a server interface according to the REST specification;

[0018] (1.2) Generating a swagger file;

[0019] (1.3) Deploying the swagger file to a server.

[0020] Preferably, the step (3) specifically comprises the following steps:

[0021] (3.1) Obtaining the content of the back-end swagger file, parsing the file content and saving it as a swagger variable;

[0022] (3.2) Read the attributes in the swagger file;

[0023] (3.3) Traverse the tags attribute of the swagger variable, extract the value of the name attribute in each item, and generate the controller list of the interface;

[0024] (3.4) According to the controller list, an array is established, and the list attribute saves the interface information list of the current controller;

[0025] (3.5) Traverse the parameters array, extract the information of each parameter into a new array and save it to the variable, encapsulate the interface information into an object, and put the encapsulated object into the list attribute of the object with the same name as the interface tags in the controller array;

[0026] (3.6) Establish a folder to save the controller description file;

[0027] (3.7) Traverse the controller array, parse the elements in the array through the prepared interface description template, establish the description JavaScript file of the controller array, and store it in the established folder.

[0028] Preferably, the step (5) specifically comprises the following steps:

[0029] (5.1) According to the file name, introduce the description file, and assign the content of each file to the variable with the same name;

[0030] (5.2) Find the corresponding controller variable through the id, and obtain the corresponding url, request method type, and parameter format according to the interface name;

[0031] (5.3) According to the parameter name of the parameter, find the corresponding parameter detailed information in the parameter format, and assemble the request parameters according to the requirements;

[0032] (5.4) Declare the body parameter variable, and save the body parameter to the variable;

[0033] (5.5) Assemble the request according to the ajax request format, input the request url, request type, and request parameter, and send the request to the backend;

[0034] (5.6) Receive and return the request return value.

[0035] Preferably, the step (6) specifically comprises the following steps:

[0036] (6.1) encapsulated request sending instruction is registered as a global function;

[0037] (6.2) the identification corresponding to the request sending and the request parameter are taken as parameters to call the global request sending instruction to obtain a return value.

[0038] The device for realizing front-end request sending processing based on swagger has the following main features.

[0039] The processor is configured to execute computer executable instructions.

[0040] The memory stores one or more computer executable instructions, and when the computer executable instructions are executed by the processor, the steps of the method for realizing front-end request sending processing based on swagger are realized.

[0041] The processor for realizing front-end request sending processing based on swagger has the following main features.

[0042] The computer readable storage medium has the following main features.

[0043] The method, device, processor and computer readable storage medium for realizing front-end request sending processing based on swagger have the following main features. BRIEF DESCRIPTION OF DRAWINGS

[0044] Figure 1 The flowchart of the method for realizing front-end request sending processing based on swagger. DETAILED DESCRIPTION

[0045] In order to more clearly describe the technical content of the present application, the following further describes in combination with specific embodiments.

[0046] The method, device, processor and computer readable storage medium of the application for realizing front-end request sending processing based on swagger comprises the following steps:

[0047] (1) writing a server interface according to a REST specification, and generating a swagger file;

[0048] (2) writing an interface description file template by a front end;

[0049] (3) writing a swagger parsing script file by the front end, and generating an interface description file;

[0050] (4) running the swagger parsing script file;

[0051] (5) writing a request sending instruction based on an interface identifier by the front end;

[0052] (6) calling the request sending instruction to send a request to a server and obtaining returned data.

[0053] As a preferred embodiment of the application, the method further comprises the following steps:

[0054] (7) judging whether a back-end interface needs to be adjusted, if yes, continuing step (1); otherwise, exiting the step.

[0055] As a preferred embodiment of the application, the step (1) specifically comprises the following steps:

[0056] (1.1) writing a server interface according to a REST specification;

[0057] (1.2) generating a swagger file;

[0058] (1.3) deploying the swagger file to a server.

[0059] Preferably, the step (3) specifically comprises the following steps:

[0060] (3.1) obtaining back-end swagger file content, parsing the file content and saving as a swagger variable;

[0061] (3.2) reading an attribute in the swagger file;

[0062] (3.3) traversing a tags attribute of the swagger variable, extracting a value of a name attribute in each item, and generating a controller list of interfaces;

[0063] (3.4) establishing an array according to the controller list, and saving a list of all interface information of a current controller in a list attribute;

[0064] (3.5) Traverse the parameters array, extract the information of each parameter into a new array and save it to a variable, encapsulate the information of the interface into an object, and put the encapsulated object into the list property of the object with the name attribute matching the interface tags in the controller array;

[0065] (3.6) Establish a folder to save the controller description file;

[0066] (3.7) Traverse the controller array, parse the elements in the array through the prepared interface description template, establish a description JavaScript file of the controller array, and store it in the established folder.

[0067] As a preferred embodiment of the application, the step (5) specifically comprises the following steps:

[0068] (5.1) Import the description file according to the file name, and assign the content of each file to a variable with the same name as the file;

[0069] (5.2) Find the corresponding controller variable through the identification id, and obtain the corresponding url, request method type and parameter format according to the interface name;

[0070] (5.3) Find the corresponding parameter detailed information in the parameter format according to the parameter name of the parameter, and assemble the request parameters according to the requirements;

[0071] (5.4) Declare the body parameter variable, and save the body parameter to the variable;

[0072] (5.5) Assemble the request according to the ajax request format, input the url, request type and request parameter of the request, and send the request to the backend;

[0073] (5.6) Receive and return the request return value.

[0074] As a preferred embodiment of the application, the step (6) specifically comprises the following steps:

[0075] (6.1) Register the encapsulated request sending instruction as a global function;

[0076] (6.2) Call the global request sending instruction with the identification and request parameter corresponding to the request as parameters, and obtain the return value.

[0077] The device for realizing front-end request sending processing based on swagger of the application, wherein the device comprises:

[0078] a processor configured to execute computer executable instructions;

[0079] a memory storing one or more computer executable instructions that, when executed by the processor, implement the steps of the method for sending a front-end request based on swagger.

[0080] The processor for sending a front-end request based on swagger of the present application, wherein the processor is configured to execute computer executable instructions that, when executed by the processor, implement the steps of the method for sending a front-end request based on swagger.

[0081] The computer readable storage medium of the present application, on which a computer program is stored, the computer program can be executed by a processor to implement the steps of the method for sending a front-end request based on swagger.

[0082] The present application is a method for sending a request from a front-end based on swagger to a server in a front-end and back-end separation development mode.

[0083] The present application aims to abstract the mechanical and consistent code of calling a back-end interface from a front-end in a front-end and back-end separation development mode, encapsulate the interface calling logic, and let front-end developers free from writing a large amount of repetitive and consistent code, and reduce the impact of back-end interface changes on the front-end.

[0084] The present application, under the premise that a back-end service interface is written according to REST specification, generates an interface description JavaScript file available for a front-end by parsing a swagger file through a JavaScript script, the interface description file records the id of the interface, the required parameters, the parameter types and the request types; finally, the front-end implements a set of request sending methods for parsing the interface description file and generating a corresponding ajax request, the method accepts the interface id and the parameters to be passed to the calling interface as parameters, finds the complete interface description in the interface description file through the interface id and sends a request according to the description to return a request result; the front-end calls the request sending method by inputting the interface id and the parameters when sending a request, and can complete the request sending and obtain the request return value. In this way, the front-end is no longer limited by the specific url of the back-end interface, as long as the interface id is not modified, the adjustment of the url and the parameter format of the back-end will not affect the front-end, and the front-end does not need to modify and adjust the business code related to the interface, and only needs to generate a new swagger file by the back-end and execute the swagger parsing script by the front-end to complete the update of the interface.

[0085] The present application mainly includes the following steps:

[0086] I. Write service-side interface according to REST specification and generate swagger file

[0087] (1.1) Write service-side interface according to REST specification

[0088] (1.2) Generate swagger file

[0089] (1.3) Deploy swagger file to server

[0090] II. Front-end interface description file template

[0091] (2.1) Template format as follows:

[0092]

[0093] (2.2) Mainly identified by the name of each interface controller and the name of the specific interface, which is also the unique identifier for finding detailed configuration of the interface when sending requests later. Assign the request type, description, URL, and parameters of the interface to the attribute name with this interface identifier, and export all contents;

[0094] III. Front-end swagger parsing script to generate interface description js file

[0095] (3.1) Get the content of the backend swagger file, parse the file content using the JSON.parse() method of JavaScript and save it as a swagger variable;

[0096] (3.2) Read the attributes in swagger;

[0097] (3.3) The swagger object has a tags attribute, which is an array type, each item saves a controller name and description, named name and description respectively. Traverse the tags attribute of the swagger variable, extract the value of the name attribute in each item to generate the controller list of the interface;

[0098] (3.4) According to the controller list, establish an array composed of objects, each object contains name and list attributes, saving the controller name, and list saves all interface information list belonging to the current controller;

[0099] (3.5)swagger variable paths attribute is a list containing all interfaces, each item saves all information of an interface, tags in interface information mark the interface belongs to the controller name, which is a string array, by comparing the controller list can know the current interface belongs to which controller, interface information parameters is an array that saves the specific parameters and detailed information of the interface, traverse parameters, extract the name, type, description of each parameter to become a new array saved in a variable, and then encapsulate the interface introduction, description, url, request type, interface unique identifier, controller information into an object, and put the encapsulated object into the list attribute of the object whose name matches the interface tags in the controller array using the push method of the JavaScript Array type variable;

[0100] (3.6) Establish a folder for a controller description file;

[0101] (3.7) Traverse the controller array, parse each element in the array with the prepared interface description template, and create a controller description JavaScript file with the name of each element's name in the newly created folder in step 6, the file content is the template parsing result;

[0102] Four, run the swagger parsing script file generated in step three

[0103] Five, front-end programming sends an ajax request sending method through interface identification

[0104] (5.1) Implement the request sending method, which accepts two parameters, the identification of the request method and the request parameter object;

[0105] (5.2) According to the file name, import all method description files, and assign the content of each file to a variable with the same name as the file name;

[0106] (5.3) Find the corresponding controller variable through the id, and then get the url, request method type, and parameter format of the corresponding method according to the specific interface name;

[0107] (5.4) For each parameter, find the corresponding parameter detailed information in the parameter format according to its parameter name, and assemble the request parameters according to the requirements found;

[0108] (5.5) For the path parameter, replace the part marked as a parameter in the url by the replace method of the String type in JavaScript, and the replacement target value is the value corresponding to the attribute with the same name in the request parameter;

[0109] (5.6) For the query parameter, splice the parameter name and the parameter value with '='; connect all spliced query parameters with '&' to form a query parameter string, and splice the query parameter string to the url after adding a '?' at the end of the request url;

[0110] (5.7) Declare a body parameter variable to save the body parameter to the variable;

[0111] (5.8) Assemble the request according to the ajax request format, pass in the request url, request type and request parameter according to the requirements, and send a request to the backend;

[0112] (5.9) Receive the request return value as the method return value;

[0113] Six, call the request sending method to send a request to the server and obtain the returned data

[0114] (6.1) Register the encapsulated request sending method as a global function;

[0115] (6.2) When a request needs to be sent, call the global request sending method with the request corresponding identifier and request parameter as parameters to obtain the return value;

[0116] Seven, when the backend interface is adjusted, steps one and four can be re-executed.

[0117] In the specific embodiment of the present application, the above step (3.1) is specifically:

[0118] Name the file as buildApi.js, obtain the backend swagger file content through the http interface in Nodejs, parse the file content using the JSON.parse() method of JavaScript and save it as a swagger variable.

[0119] The specific code of step (3.1) in the embodiment is as follows:

[0120]

[0121] The codes of steps (3.2) to (3.7) are as follows:

[0122]

[0123]

[0124] The running script generates an example controller file as follows:

[0125]

[0126]

[0127] In this embodiment, step (4) is specifically:

[0128] Run the swagger parsing script file written in step three under the node environment, and execute node buildApi.js.

[0129] In this embodiment, steps (5.1) to (5.3) are specifically:

[0130] (5.1) First, reference the axios third-party library;

[0131] (5.2) Implement the request sending method code named ajax, which accepts two parameters, namely the identification of the request method named action and the request parameter object named payload;

[0132] (5.3) Find the corresponding controller file through action, and then obtain the url, request method type, and parameter format of the corresponding method according to the specific interface name.

[0133] The specific code of step (5) in this embodiment is as follows:

[0134] Process parameters and assemble the ajax request method:

[0135]

[0136]

[0137]

[0138] Send a request method according to the id

[0139]

[0140] The specific code of step (6) in this embodiment is as follows:

[0141]

[0142] The specific implementation scheme of this embodiment can be referred to the related description in the above embodiments, which will not be described here again.

[0143] It can be understood that the same or similar parts in the above embodiments can be mutually referenced, and the content not described in detail in some embodiments can refer to the same or similar content in other embodiments.

[0144] It should be noted that, in the description of the present application, the terms "first", "second" and the like are used only for descriptive purposes, and cannot be construed as indicating or implying relative importance. In addition, in the description of the present application, unless otherwise specified, the meaning of "a plurality of" is at least two.

[0145] Any process or method descriptions in flow charts or described herein otherwise can be understood as representing code modules, segments, or portions of code that include one or more executable instructions for performing specific logic functions or steps in the process, and the various embodiments of the present application include additional implementations in which the functions described with reference to a given code module, segment, or portion of code are combined with functions described with reference to one or more other code modules, segments, or portions of code. The order in which a process is described is not necessarily the order in which the processes can be performed.

[0146] It should be understood that parts of the present application can be implemented in hardware, software, firmware or a combination thereof. In the above embodiments, a plurality of steps or methods can be implemented by software or firmware stored in a memory and executed by a suitable instruction execution device. For example, if implemented in hardware, as in another embodiment, it can be implemented by any one or a combination of the following technologies known in the art: discrete logic circuit with logic gate circuit for implementing logic functions on data signals, application specific integrated circuit with suitable combination logic gate circuit, programmable gate array (PGA), field programmable gate array (FPGA) and the like.

[0147] Those skilled in the art of the present technology can understand that all or part of the steps carried out by the above-mentioned embodiment method can be completed by a program instructing the relevant hardware, and the corresponding program can be stored in a computer readable storage medium, which includes one or a combination of the steps of the method embodiment when executed.

[0148] In addition, each functional unit in each embodiment of the present application can be integrated in one processing module, or each unit can exist physically separately, or two or more units can be integrated in one module. The integrated module can be realized in the form of hardware or in the form of a software function module. If the integrated module is realized in the form of a software function module and sold or used as an independent product, it can also be stored in a computer readable storage medium.

[0149] The storage medium mentioned above can be a read-only memory, a magnetic disk or an optical disk, etc.

[0150] In the description of the specification, the description of the terms "one embodiment", "some embodiments", "an example", "a specific example", or "some examples" and the like means that the specific features, structures, materials or characteristics described in connection with the embodiment or example are included in at least one embodiment or example of the present application. In the specification, the illustrative description of the above terms does not necessarily refer to the same embodiment or example. Moreover, the specific features, structures, materials or characteristics described can be combined in any appropriate manner in any one or more embodiments or examples.

[0151] The conventional front-end and back-end separation development mode has a serious dependence of the front-end on the back-end interface, and if the back-end interface URL, parameter and request type change during development, the front-end needs to adjust the related code, which is laborious. The method reduces the influence of changes of the URL, parameter format and request method on the front-end, and can complete the service interface update by executing a swagger parsing script, thereby improving the project development efficiency.

[0152] The method, device, processor and computer readable storage medium for implementing the front-end request sending processing based on swagger adopt the present application, the web front-end framework automatically generates a request file by a swagger parsing script and sends a request by calling an interface in the form of id calling, thereby reducing the workload of the front-end developer and not needing to write a large amount of repetitive code. Meanwhile, when the back-end reconstructs the code to modify the URL or parameter format of the interface, the front-end does not need to modify any code using the related interface, and only needs to execute the swagger parsing script after the back-end generates a new swagger file to complete the interface update.

[0153] In this specification, the present application has been described with reference to its specific embodiments. However, it is obvious that various modifications and changes can be made without departing from the spirit and scope of the present application. Therefore, the specification and drawings should be considered as illustrative rather than limiting.

Claims

1. A method for implementing a front-end request sending process based on swagger, characterized in that, The method comprises the following steps: (1) writing a service interface according to the REST specification, and generating a swagger file; (2) writing an interface description file template on the front end; (3) writing a swagger parsing script file on the front end, and generating an interface description file; (4) running the swagger parsing script file; (5) writing a request sending instruction based on an interface identifier on the front end; (6) calling the request sending instruction to send a request to the server and obtaining returned data; The step (3) specifically comprises the following steps: (3.1) obtaining the content of the backend swagger file, parsing the file content and saving it as a swagger variable; (3.2) reading the attributes in the swagger file; (3.3) traversing the tags attribute of the swagger variable, extracting the value of the name attribute in each item, and generating a controller list of the interface; (3.4) establishing an array according to the controller list, and saving the interface information list of the current controller in the list attribute; (3.5) traversing the parameters array, extracting the information of each parameter into a new array and saving it to a variable, encapsulating the interface information into an object, and placing the encapsulated object into the list attribute of the object corresponding to the name attribute in the controller array; (3.6) establishing a folder for saving the controller description file; (3.7) traversing the controller array, parsing the elements in the array through the written interface description template, establishing a description JavaScript file of the controller array, and storing it in the established folder.

2. The method of claim 1, wherein, The method further comprises the following steps: (7) judging whether the backend interface needs to be adjusted, if yes, continuing step (1); otherwise, exiting step. 3.The method for implementing front-end request sending processing based on swagger according to claim 1, characterized in that, The step (1) specifically comprises the following steps: (1.1) writing a service interface according to the REST specification; (1.2) generating a swagger file; (1.3) deploying the swagger file to a server.

4. The method of claim 1, wherein the swagger-based implementation of a front-end request sending process is characterized by, The step (5) specifically comprises the following steps: (5.1) importing the description file according to the file name, and assigning the content of each file to a variable with the same name as the file; (5.2) finding the corresponding controller variable through the identifier id, and obtaining the corresponding url, request method type and parameter format according to the interface name; (5.3) finding the corresponding parameter detailed information in the parameter format according to the parameter name, and assembling the request parameters according to the requirements; (5.4) declaring a body parameter variable, and saving the body parameter to the variable; (5.5) assembling the request according to the ajax request format, inputting the url, request type and request parameter of the request, and sending a request to the backend; (5.6) receiving and returning the request return value. 5.The method for implementing a front request sending process based on swagger according to claim 1, wherein, The step (6) specifically comprises the following steps: (6.1) registering the encapsulated request sending instruction as a global function; (6.2) calling a global request sending instruction with the identity corresponding to the sending request and the request parameter as parameters, and obtaining a return value.

6. An apparatus for implementing a front-end request sending process based on swagger, characterized by, The device comprises: a processor configured to execute computer executable instructions; a memory storing one or more computer executable instructions which, when executed by the processor, implement the steps of the method for implementing a front-end request sending process based on swagger according to any one of claims 1 to 5.

7. A processor that implements a front-end request sending process based on swagger, characterized by, The processor is configured to execute computer executable instructions which, when executed by the processor, implement the steps of the method for implementing a front-end request sending process based on swagger according to any one of claims 1 to 5.

8. A computer-readable storage medium, characterized in that, A computer program is stored thereon, and the computer program can be executed by the processor to implement the steps of the method for implementing a front-end request sending process based on swagger according to any one of claims 1 to 5.

Images