初学ajax踩坑
req是客户端的请求 res是服务端的响应!!!理解清楚不要搞混了
服务端
const express = require('express');
const path = require('path');
const app = express();
app.use(express.static(path.join(__dirname, 'public')));
// app.use((req, res) => {
// res.writeHead(200, {
// 'content-type': 'text/html;charset=utf8'
// });
// res.end('asdasdsada阿萨德撒大sdsadas')
// })
//新版express已经内置body-parser
app.use(express.urlencoded())
app.use(express.json()) //解析json对象数据 未知
app.get('/first', (req, res) => {
res.send('<a>00hello</a>');
})
//03操作
app.get('/get', (req, res) => {
res.send(req.query);
});
//04
app.post('/post', (req, res) => {
res.send(req.query);
});
//05
app.post('/json', (req, res) => {
console.log(req.body);
// res.send(req.query); //这里注意返回是body 不是query!!!!!!!!!!!get才是!!!!!!!!!!11111
res.send(req.body)
});
app.listen(3000);
console.log('服务器启动成功');
//html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div></div>
<script type="text/javascript">
// XMLHttpRequest ajax对象
var xhr = new XMLHttpRequest();
//告诉ajax对象向哪里发送请求,以什么方式
//open第一个方法是请求方式 第二个是请求地址
xhr.open('post', 'http://localhost:3000/json');
//请求头告诉客户端向服务器传递的格式
xhr.setRequestHeader('Content-Type', 'application/json');
var aaa = {
name: 'lisi',
age: 1
}
//发送请求;
xhr.send(JSON.stringify(aaa));
//获取服务器端响应到客户端的数据’
xhr.onload = function() {
console.log(xhr.responseText);
}
</script>
</body>
</html>