前言:本章我们说一下服务器怎么接收post发送的数据。
const express = require('express');
const postRouter = express.Router();
const dir = __dirname.replace('\\router','');
postRouter.post('/',(req,res)=>{
console.log(req.body);
res.sendFile(dir+'/public/html/index.html');
});
postRouter.post('/home',(req,res)=>{
console.log(req.body);
res.sendFile(dir+'/public/html/home.html');
});
postRouter.post('/shopping',(req,res)=>{
console.log(req.body);
res.sendFile(dir+'/public/html/shopping.html');
});
module.exports = postRouter;
post请求携带的数据可以通过 req.body 获取,但是获取出来是个空字符串,这是因为我们没有配置服务器接收post数据的中间件,代码如下:
const express = require('express');
const app = express();
const getRouter = require('./router/getRouter');
const postRouter = require('./router/postRouter');
const PORT = 8080;
app.use(express.json({limit:'1024mb'}));
app.use(getRouter);
app.use(postRouter);
app.use(express.static(__dirname+'/public'));
app.listen(PORT,()=>{
console.log(`http://127.0.0.1:${PORT}/`);
});
这里我们添加了这行代码:
app.use(express.json({limit:'1024mb'}));
express.json接收一个对象为参数,limit字段是用来设置接收数据大小上限的。
现在我们就可以接收post请求发送的数据了,让我们来看一下效果
在index.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>
<h1>这里是首页</h1>
</body>
<script src="/webjs/axios.min.js"></script>
<script>
window.onload = function(){
axios.post('/',{
msg:'Hello,Node.js!',
date:Date.now()
}).then( res => {
console.log(res);
}, error => {
console.log(error);
})
}
</script>
</html>
这里向服务器发送了一个对象:{msg:'Hello,Node.js!',date:Date.now()}
我们来看一下服务器代码:
postRouter.post('/',(req,res)=>{
console.log(req.body);
res.send({msg:'Hello,JavaScript!',date:Date.now()});
});
这里打印了客户端发送的数据,并且做出响应,发送了Hello,JavaScript!和当前时间。
现在打开页面,可以看到控制台打印了服务器响应的数据
再来看一下服务器的控制台:
本章就讲到这里,如果你也对node.js感兴趣的话欢迎和我交流~