首页 > 代码库 > ANGULAR JS POST 数据解析

ANGULAR JS POST 数据解析

ANGULAR js POST 数据的时候,默认是发送JSON数据到服务端的。

var params={defId:"1234"};

$http.post(url,params).success(function(data, status, headers, config){
                                            
});

我们在服务端获取数据数据时,使用 request.getParmeter("defId");
这种方法我们是获取不到数据的。

解决这个问题有两个办法:

1.在服务端解决

在服务端使用方法:

String json=FileUtil.inputStream2String( request.getInputStream());

在服务端使用流的方式获取数据,将流转成字符串,我们在解析此字符串。

2.在浏览器端解决

将数据序列化成表单提交的方式,使用application/x-www-form-urlencoded编码方式提交。

我们编写一个通用的转换代码。
var baseServices = angular.module( "baseServices", [] );
baseServices.factory("$jsonToFormData",function() {
        function transformRequest( data, getHeaders ) {
                var headers = getHeaders();
                headers["Content-Type"] = "application/x-www-form-urlencoded; charset=utf-8";
                return $.param(data);
        }
        return( transformRequest );
});

在编写发送请求代码如下:

$http.post(url,params,{transformRequest:$jsonToFormData}).success(function(data, status, headers, config){
                                    
});

这样就将数据使用表单编码的方式发送到服务端,服务端可以使用 reuqest.getParameter("defId");的方式获取数据了。


注意:
var headers = getHeaders();
headers["Content-Type"] = "application/x-www-form-urlencoded; charset=utf-8";

这句,我之前写的是headers["Content-type"],发现一个奇怪的问题,就是在FIREFOX下能将数据传地服务端。

在chrome 下,使用同样的代码却不行,服务端接收为空,经过浏览器抓包分析,发现有两个header,一个是Content-type,
一个是Content-Type ,我把Content-type 修改成Content-Type覆盖默认的application/json方式,数据能正确传递了。