A simple login using node

HTML section

<input type="text" id="user"><br>
    <input type="password" id="pass"><br>
    < button onclick = "login()" > login

JS part (just started to contact node, using the nativeXMLHttpRequestWithout using encapsulated Ajax directly)

function login() {
      Let XmR = new xmlhttprequest(); // create an XMLHttpRequest object
      xmr.open ("get", " http://localhost :8808?user=" +  user.value  + "&pass=" +  pass.value , true); // specifies the request method (get / post), the request address, and whether it is asynchronous
      xmr.send (); // send request
      xmr.onreadystatechange  =Function() {// listen to the status of the request (0: initialization status; 1: open call, send not called; 2: send call, no response has been received; 3: response header has been received, single responder has not been received; 4: response fully accepted)
        if ( xmr.readyState  ==4) {// after the response is accepted, different operations are performed according to the content of the returned response body.
          if ( xmr.responseText  =="Login succeeded"){
            console.log(xmr.responseText);
            document.getElementsByTagName("body")[0].style.background = "green";
          } else {
            document.getElementsByTagName("body")[0].style.background = "red";
          }
        } else {
          console.log ("server error");
        }
      }
    }

Nodejs section

Var HTTP = require ("HTTP"); // import HTTP module
http
  .createServer(function (request, response) {
    //Create a server response
    response.setHeader ("access control allow origin", "*"); // allow cross domain
    var url =  request.url ; // accept the URL parameter part from get
    //The parameters passed by the get method are divided into an object
    var obj = {};
    let arr = url.substring(2).split("&");
    for (let i = 0; i < arr.length; i++) {
      arr[i] = arr[i].split("=");
      obj[arr[i][0]] = arr[i][1];
    }

    //Judge according to the separated object
    if (obj["user"] == "wanglf" && obj["pass"] == "123456") {
      response.write ("login succeeded");
    } else {
      response.write ("login failed");
    }

    //End response
    response.end();
  })
  . listen ("8808"); // listen on port 8808

Interface effect

Login success:

Login failed:

Encapsulate the native XMLHttpRequest as an Ajax method to make the request

//Login method
    function login() {
      let obj = {
        user: user.value,
        pass: pass.value,
        url: 'http://localhost:8808'
      }
      ajax(obj);
    }

    //Native encapsulation of an Ajax
    function ajax(obj) {
      Let XmR = new xmlhttprequest(); // create an XMLHttpRequest object
      xmr.open ("get",  obj.url  + "?user=" +  obj.user  + "&pass=" +  obj.pass , true); // specifies the request method (get / post), the request address, and whether it is asynchronous
      xmr.send (); // send request

      //Corresponding to your own business operation
      xmr.onreadystatechange  =Function() {// listen to the status of the request (0: initialization status; 1: open call, send not called; 2: send call, no response has been received; 3: response header has been received, single responder has not been received; 4: response fully accepted)
        if ( xmr.readyState  ==4) {// after the response is accepted, different operations are performed according to the content of the returned response body.
          if ( xmr.responseText  =="Login succeeded"){
            console.log(xmr.responseText);
            document.getElementsByTagName("body")[0].style.background = "green";
          } else {
            document.getElementsByTagName("body")[0].style.background = "red";
          }
        } else {
          console.log ("server error");
        }
      }
    }

You can also directly use jQuery Ajax to make a request. You can try to write one yourself. It’s very simple