AngularJS 学习笔记 - $http.post 跟后台交互

在使用$http.post 向后台post数据时，采用$http.post(url, data) 的方式，后台无法接收到数据

代码：

var url = "myUrl";
var data = {"param1": param1, "param2": param2};
	
$http.post(url, data).success(function(data) {
    //some code deal with data
});

导致这个问题的原因：AngularJS 在跟后台交互数据时采用的头信息是： Content-Type: application/json ，数据发送到后台时被序列化为JSON，而我们普通的后台应用无法反序列化这数据，故接收不到。

像JQuery 的 ajax 方法，在跟后台交互数据时采用的头信息是：Content-Type: x-www-form-urlencoded 数据发送到后台时被序列化为 param1=param1&param2=param2。

知道以上原因后，我们也好理解为啥出现这种情况了。当然，AngularJS设计者也考虑到了这个问题，于是就有以下的方案供解决这个问题。

问题解决：

angular.module('MyModule', [], function($httpProvider)
{
  // Use x-www-form-urlencoded Content-Type
  $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
 
  // Override $http service's default transformRequest
  $httpProvider.defaults.transformRequest = [function(data)
  {
    /**
     * The workhorse; converts an object to x-www-form-urlencoded serialization.
     * @param {Object} obj
     * @return {String}
     */ 
    var param = function(obj)
    {
      var query = '';
      var name, value, fullSubName, subName, subValue, innerObj, i;
      
      for(name in obj)
      {
        value = obj[name];
        
        if(value instanceof Array)
        {
          for(i=0; i<value.length; ++i)
          {
            subValue = value[i];
            fullSubName = name + '[' + i + ']';
            innerObj = {};
            innerObj[fullSubName] = subValue;
            query += param(innerObj) + '&';
          }
        }
        else if(value instanceof Object)
        {
          for(subName in value)
          {
            subValue = value[subName];
            fullSubName = name + '[' + subName + ']';
            innerObj = {};
            innerObj[fullSubName] = subValue;
            query += param(innerObj) + '&';
          }
        }
        else if(value !== undefined && value !== null)
        {
          query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&';
        }
      }
      
      return query.length ? query.substr(0, query.length - 1) : query;
    };
    
    return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data;
  }];
});

参考地址：$http.post 类似 JQuery Ajax 提交