axios 发 post 请求,后端接收不到参数的解决方案

一、问题发现

 前后端分离使用vue开发,结合axios进行前后端交互数据,一开始使用 get 请求,获取数据,没有发现任何问题,当使用 post请求 传参时,发现,数据明明已经提交,在打开F12 开发者工具,点击 network 里面的确有数据已经传过去,只是后台那里 打印日志确实没有获取到传过去的参数。

二、解决方案

 1. 原因: 传参方式是request payload,参数格式是json,而并非用的是form传参,所以在后台用接收form数据的方式接收参数就接收不到了。

POST表单请求提交时,使用的Content-Type是application/x-www-form-urlencoded,而使用原生AJAX的POST请求如果不指

定请求头RequestHeader,默认使用的Content-Type是text/plain;charset=UTF-8,而此处的Content-Type是:

 2. 解决方法:

安装 qs   : npm install qs --save    在页面中引用 qs :   var qs = require('qs'); 同时 需要将 请求头headers改为: 'Content-Type': 'application/x-www-form-urlencoded', 
           const obj={
                    username:this.ruleForm.user,
                    password:this.ruleForm.password
                }
                console.log(this.ruleForm)
               this.axios.post(this.$Api.globalUrl+'/sys/loginuser',Qs.stringify(obj),{
                   headers: {
                       'deviceCode': 'A95ZEF1-47B5-AC90BF3'
                   },
               })
                    .then(function(res){
                        console.log(res.data);
                    })
                    .catch(function(error){
                        console.log(error);
                    });
            }
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值