原生js使用ajax进行简单的前后端的数据交互|js&node&ajax
2021-05-03 11:28
阅读：569
YPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
标签：post fun end eth func utf8 uri cas 简单的
第一次发布内容，内容简陋请多包含.......
前端html代码：
var data="data=sdd&hf=jkhklh" // 要提交的数据
// 使用ajax提交get方式数据
function ajax(){
var oAjax = new XMLHttpRequest();
oAjax.onreadystatechange = function (){
if(oAjax.readyState == 4&& oAjax.status == 200){
alert(oAjax.responseText);
}
}
oAjax.open(‘GET‘, ‘/ss?‘+data);
oAjax.send();
}
// 使用ajax提交post方式数据
function ajaxP(){
var oAjax = new XMLHttpRequest();
oAjax.onreadystatechange = function (){
if(oAjax.readyState == 4&& oAjax.status == 200){
alert(oAjax.responseText);
}
}
oAjax.open(‘POST‘, ‘/ss‘);
oAjax.send(data);
}
后端node.js代码：
var http = require("http");
var fs = require("fs");
var url=require("url");
var app=(req,res)=>{
var pathname = url.parse(req.url).pathname;
var method = req.method.toLowerCase();
if(pathname=="/favicon.ico")return;
if(pathname=="/"){
fs.readFile("./ajax.html",(err,data)=>{
res.writeHead(200,{‘content-type‘:‘text/html;charset=utf8‘});
res.end(data);
})
}
if(pathname=="/ss"&&method=="get"){
// console.log(url.parse(req.url).query);
res.writeHead(200,{‘content-type‘:‘text/html;charset=utf8‘});
res.end(‘{"data":"这是GET数据"}‘);
}
if(pathname=="/ss"&&method=="post"){
// console.log("sdsd");
req.on("data",function(data){
//打印
// console.log(decodeURIComponent(data));
});
res.writeHead(200,{‘content-type‘:‘text/html;charset=utf8‘});
res.end(‘{"data":"这是POST的数据"}‘);
}
console.log(url.parse(req.url))
}
http.createServer(app).listen(8000);
原生js使用ajax进行简单的前后端的数据交互|js&node&ajax
标签：post fun end eth func utf8 uri cas 简单的
原文地址：https://www.cnblogs.com/moope/p/12121997.html
上一篇：json
文章来自：搜素材网的编程语言模块，转载请注明文章出处。
文章标题：原生js使用ajax进行简单的前后端的数据交互|js&node&ajax
文章链接：http://soscw.com/essay/81782.html
文章标题：原生js使用ajax进行简单的前后端的数据交互|js&node&ajax
文章链接：http://soscw.com/essay/81782.html
评论
亲，登录后才可以留言！