Using AJAX to interact with the background interface API (as an example of login functionality)

First, before we do this, we have to look at the background interface documentation to see which parameters to submit when using the login interface, and the interface to use the returned data.
Here I use a login interface that returns JSON format data as an example of how to use Ajax to interact with a background interface.

Development documentation

By the development documentation, we can clearly know that to use this login interface, we only need to submit account AdminName and password pwd two parameters.

Second, write JavaScript (Ajax) Implementation Login

var xmlhttp;if (Window. XMLHttpRequest) {ie7+, Firefox, Chrome, Opera, Safari xmlhttp=New XMLHttpRequest ();}else{IE6, IE5 xmlhttp=New ActiveXObject ("Microsoft.XMLHTTP");}The above HTTP request object is generated by a browser-compatible processingvar adminname =document.getElementById (' AdminName '). Value;Gets the value of the AdminName input Field object in the HTML form, both the accountvar PSW =document.getElementById (' PSW '). Value;Gets the value of the PWD input domain object in the HTML form, both the password xmlhttp.onreadystatechange=function){Callback this method when a response is acceptedif (xmlhttp.readystate==4 && (xmlhttp.status==200| | xmlhttp.status==0)) {var tip =document.getElementById (' Tip ');Gets the HTML Tip node, which is used primarily for output login resultsvar text = Xmlhttp.responsetext;Use interface to return content, response contentvar Resultjson =Eval"(" +text+")");Turn the response content object into a JavaScript objectvar result = Resultjson.result;Gets the value corresponding to the result key in the JSONvar code = Resultjson.code;Gets the value corresponding to the code key in the JSONif (result=="Fail") {Logon failureif (code==101) {tip.innerhtml ="Bad password!"}Elseif (Code==102) {tip.innerhtml =  " User does not exist! "} }else //login Successful if (result== "Success" &&code==100) { Span class= "hljs-built_in" >window.location.href= "center.html";  "POST",  "Control1/login" , true); //post to request the interface Xmlhttp.setrequestheader ( "Content-type", Span class= "hljs-string" > "application/x-www-form-urlencoded"); //add Content-type xmlhttp.send ( "adminname=" +adminName+ "&psw=" +PSW); //send request between Parameters & split            

The above code in the main implementation of the request background login interface, if the login successfully jump to the user center, if the login failed, according to the return code prompt user logon failure reasons.

Xuanyonghao
Links: https://www.jianshu.com/p/dd5b136aed73
Source: Pinterest
The copyright of the book is owned by the author, and any form of reprint should be contacted by the author for authorization and attribution. Phase Break Fu

Using AJAX to interact with the background interface API (as an example of login functionality)