关于angularjs中$http POST请求参数的问题

本人angularjs小白,今天遇到这样一个问题。

在angularjs中发出这样一个POST请求

$http({
            method: "POST",
            url: "",
            params: id
        }).success();

在调试中发现,参数在url上出现了,就是以?id=123124的形式出现,跟GET请求变成一样的了,然后查了一下发现参数的写法『用GET的时候就是params,用POST/PUT/PATCH/DELETE就是data』,修改后

$http({
            method: "POST",
            url: "",
            data: id
        }).success();

发现发送的参数出现在了request payload里,后端会认为参数非法无法获取(前一种是序列化的参数a=bbb&c=ddd,后者是参数为一个对象)


于是查询了POST表单请求提交时,使用的Content-Type是application/x-www-form-urlencoded,而使用原生AJAX的POST请求如果不指定请求头RequestHeader,默认使用的Content-Type是text/plain;charset=UTF-8,在html中form的Content-type默认值:Content-type:application/x-www-form-urlencoded修改为

$http({
            method: "POST",
            url: "",
            data: id,
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
        }).success();

然后确实就转成form data了,但是参数如果是对象还是不行


于是再查资料发现,如果参数是对象,还需要加上transformRequest

$http({  
            method: "POST",  
            url: "",  
            data: id,  
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' },  
            transformRequest: function(obj) {  
                var str = [];  
                for (var p in obj) {  
                    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));  
                }  
                return str.join("&");  
            }
        }).success();  

这样终于可以了

其实仔细看transformRequest,也就是把参数转成序列化的形式,所以以后如果使用的话,干脆就写成序列化的形式就好了,省的还要再转一道。jquery中有$.param()方法可以实现,angularjs里面不知道有没有。

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值