使用axios提交数据到node本地服务,本地获取不到数据

3 篇文章 0 订阅
1 篇文章 0 订阅

首先,提交数据后,打开控制台,显示状态为200,点击数据也发送过去了,express服务怎么获取不到数据呢?

原来是axios在内部自动帮我们转换json格式数据, 也就是说,我们的 Content-Type 变成了 application/json;charset=utf-8
然后,因为我们的参数是 JSON 对象,axios 帮我们做了一个 stringify 的处理。 而axios 使用 post 发送数据时,默认是直接把 json 放到请求体中提交到后端的。
那么,这就与我们服务端要求的 ‘Content-Type’: ‘application/x-www-form-urlencoded’ 不符合。

因此要做出改变,使用qs插件来过滤下数据。

先在项目中安装qs插件,使用npm install qs --save

然后过滤传输数据,对数据里边数组也要进行JSON.stringify处理,否则后端娶不到该值。

var data=qs.stringify({
          title:this.blog.title,
          content:this.blog.content,
          categarits:JSON.stringify(this.blog.categarits),
          author:this.blog.author
        });
axios.post("/api/upData",data).then(res=>console.log("数据传输成功"))

node后端处理语句,将数据传给mongdb数据库。

pp.post('/upData', function(req, res) {
    console.log("数据成功提交");
    User.create({
        title:req.body.title,
        content:req.body.content,
        author:req.body.author,
        categarits:req.body.categarits
    },function(err,doc){
        if(!err){
            console.log(doc);
        }else{
            console.log(err);
        }
    });
    console.log(req.body,6666666);
    res.send("axios,发送数据,您好吗?")
})

重新运行npm run serve  ,就能在server服务中看到提交的数据,

然后再对服务进行改进,将数据提交到数据库,就可以实现前后端联调。

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值