Node. js Obtains request information submitted by front end ajax
- 2021-07-22 08:48:53
- OfStack
Today, see how Node. js obtains request information submitted by ajax
As we all know, ajax can realize partial refresh without refreshing the whole page. This is a very good way to update information dynamically. Today, we will look at how to use node to receive the information submitted by the front-end ajax
Below I post 1 under the front-end code
index. html code I will not post, because there is only one button, to achieve the function is to click the button to submit ajax asynchronous request
Mainly post the code of js page under 1
$("button").on("click",function(){
// Submit ajax Request
$.ajax({
url:"http://localhost:9999",
data:{name:'xiaoming',age:19},
type:"POST",
dataType:"json",
async:true,
timeout:5000,
complete:function(){
console.log("end");
},
success:function(data,textStatus,jqXHR){
console.log(data);
console.log(textStatus);
console.log(jqXHR);
},
error:function(textStatus,jqXHR){
console.log("error");
console.log(textStatus);
console.log(jqXHR);
}
});
});
In this way, we have submitted an ajax request asynchronously to the server.
Because my server is written with node, I post the code of node. js
/**
* New node file
*/
// Load module
var http = require("http");
function onRequest(req,resp){
// Get ajax Information submitted
req.on("data",function(data){
// Print
console.log(decodeURIComponent(data));
});
// Return response
resp.writeHead(200,{"ContentType":"text/html;charset=utf-8"});
// Return the tail of the response
resp.end();
}
// Create a server
http.createServer(onRequest).listen(9999);
The result obtained by the server is as follows:
name=xiaoming&age=19
At first glance, it is very simple to get the request information of ajax. I created a server in node, then added data event to request, and made a callback processing, and then I can get the data submitted by ajax
However, in this case, we still can't use this data flexibly. We must use split to separate name from age, which is quite inconvenient.
So we thought of using querystring to parse the json object, which we only need to modify the code just one time to achieve
/**
* New node file
*/
// Load module
var http = require("http");
var qs = require("querystring");
function onRequest(req,resp){
// Get ajax Information submitted
var currentData = "";
req.on("data",function(data){
// Print
currentData += data;
console.log(qs.parse(currentData));
});
// Return response
resp.writeHead(200,{"ContentType":"text/html;charset=utf-8"});
// Return the tail of the response
resp.end();
}
// Create a server
http.createServer(onRequest).listen(9999);
The following is the result of the run
{ name: 'xiaoming', age: '19' }
We can also load it into a variable and use its various attributes
var temp = qs.parse(data);
console.log(temp.name);
console.log(temp.age);