express中无法在axios.post请求中通过req.body获取请求传递的数据的解决办法

关于用express搭建服务器不能从req.body里获取数据的问题解析

最开始的情况，根本不能通过req.body拿出数据，req.body返回的是一个空对象，
经过多次上网搜索，才发现需要在express中引入bodyParser这个插件
bodyparser有4种常用的解析方式，对应数据格式可以在官网上看文档，本人前端小白只能谈谈自己的理解和解决的办法

const express = require('express');
var bodyParser=require('body-parser');
app.use(bodyParser.urlencoded({extended:true}));

之后才能用req.body中拿出数据

但后续情况出现

服务器定义路由

app.post("/login",(req,res)=>{
	console.log("这是query",req.query);
    console.log("这是body",req.body);})

客户端发请求的代码为

      login(){
            this.$axios({
                method:'post',
                headers: {'Content-Type': 'application/x-www-form-urlencoded'}, 
                url:"http://localhost:8000/login",
                // 只有params是可以传递参数的
                data:this.loginForm
            }).then(res=>{
                console.log("这是成功了");
                this.$store.commit('setToken',res.data.token)
                this.$router.push({name:"home"})
            }).catch(error=>{
                // 错误的时候提醒错误状态
                console.log("这是失败了",error);
                alert("账号密码错误")
            })
        }

服务器端返回的是
这是query {}
这是body { ‘{“username”:“admin”,“password”:“464456465”}’: ‘’ }

这个body里的数据我不知道怎么去拿，希望有大佬能够答疑解惑

最后还是采用了通过params传递数据，服务器端通过req.query获取数据来进行数据的判断

前端发请求

  login(){
            this.$axios({
                method:'post',
                headers: {'Content-Type': 'application/x-www-form-urlencoded'}, 
                url:"http://localhost:8000/login",
                // 只有params是可以传递参数的,未在express中引入bodyParser之前
                params:this.loginForm
            }).then(res=>{
                console.log("这是成功了");
                this.$store.commit('setToken',res.data.token)
                this.$router.push({name:"home"})
            }).catch(error=>{
                // 错误的时候提醒错误状态
                console.log("这是失败了",error);
                alert("账号密码错误")
            })
        }
        

服务器端路由设置最终为

app.post("/login",(req,res)=>{
    // res.setHeader('Access-Control-Allow-Origin','*')
    // res.header("Access-Control-Allow-Headers","content-type");
    // 跨域允许的请求方式
    // res.header("Access-Control-Allow-Methods","DELETE,PUT,POST,GET,OPTIONS");
    console.log("这是query",req.query);
    console.log("这是body",req.body);
    const user=req.query
    if(user.username==="admin"&&user.password==="1357924680")
    {
        const  data={
            username:user.username,
            password:user.password,
            token:"this is Token",
        }
         res.send(data)
    }else{
        //账号密码错误返回401
        res.sendStatus(401)
        console.log("错了啊");
    }
    // 下面拿不到
    // console.log("这是params",req.params);
    // console.log("这是body",res.body);
    // res.send("post我被调用了")
}),

这样才能够拿到传到服务器端数据

这是query { username: '465446513', password: '13213232' }
这是body {}
错了啊
这是params {}

！！！内容修改，最近在学node.js, 现在body-parser已经弃用，因为express框架已经实现对post参数的解析

通过使用

app.use(express.json())
app.use(express.urlencoded({extended:false}))

来解析前端传递的post参数,

通过req.body来获取参数，我的测试是通过jquery的ajax请求测试的

 $("#btn3").click(function(){
            let data={
                id:"16",
                name:"hehe",
                password:"6sdsd55s"
            }
            $.ajax({
                url:"http://localhost:8080/update",
                method:"POST",
                dataType:'json',    
                data:data,
                success:function(res){
                    console.log(res);
                }
            })
        })

后端代码，其中db.query是数据库操作

app.post("/update",(req,res)=>{
    res.header('Access-Control-Allow-Origin', '*')
    let info = req.body
    //更新的简单方式
    db.query(update2,[info,info.id],(err,results)=>{
        if(err) console.log(err.message);
        if(results.affectedRows===1)
        {
            console.log("更新成功");
        }
    })
    // db.query(update,[info.name,info.password,info.id],(err,results)=>{
    //     if(err) console.log(err.message);
    //     if(results.affectedRows===1)
    //     {
    //         console.log("更新成功");
    //     }
    // })
    res.send({
        status:200,
        data:"更新"
    })  
})