AngularJS内置的一些服务之$http

$http服务提供了对浏览器的XMLHttpRequest对象的底层访问功能，可以通过$http的API同XMLHttpRequest进行交互。

一、入参

$http可以当做函数来使用，需要传入一个对象来说明如何构造XHR对象：

1. method ：get, post, delete, head, put, jsonp（不区分大小写）
2. url ：相对或绝对路径
3. params ：请求url的入参，后会被追加到url的后面（例如params:{'name':'kris'}最后会变为：？name=kris）
4. data ：发送给服务器的数据(通常在发送post请求的时候使用，在1.3版本之后，支持post发送二进制数据，此时用blob对象)
5. headers ：请求发送的http头
6. xsrfHeaderName ：保存xsrf令牌的http头的名称
7. xsrfCookieName ：保存xsrf令牌的cookie的名称
8. transformRequest ：对http请求参数进行转化，主要是在发送到服务器前对其进行序列化
9. transformResponse ：对HTTP响应的数据进行转化，对其进行反序列化；
10. cache ：会对请求进行缓存，第二次发送请求时，$http会从缓存中取得请求结果，而不是真正的再发送一个$http请求
11. timeout ：数字，超时时间；
12. withCredential ：为true时，会发送目标域的cookie；
13. responseType：设置HTTP请求类型，类型可以是：“”,arraybuffer,blob,json,document,text,moz-blob,moz-chunked-text,moz-chunked-arraybuffer

二、响应对象

服务器响应对象包含了下面四个属性：

1. data ：转换过后的响应体（如果有定义transformResponse的话，此时的data是为转换过了的）
2. headers ：头信息的getter函数，可以接受一个参数来获取对应的值,如：headers('X-Auth-ID')
3. config ：这个对象用来生成原始请求的完整设置对象
4. status ：响应的HTTP状态码，如200
5. statusText：响应的HTTP状态文本，如‘ok’

三、快捷方法

1. get(url,[config]) ：用于读取服务器数据
2. delete(url,[config])
3. head(url,[config])
4. jsonp(url,[config])
5. post(url,data,[config])
6. put(url,data,[config])
7. patch(url,data,[config])

url：请求地址 config：请求配置对象 data请求内容    ，参数用[ ]括起来表示不必须参数，使用方式就是$http.方法名，例如：$http,get();

下面是一个简单的例子：

$http({    url:'data.json',    method:'GET'}).success(function(data,header,config,status){    //响应成功}).error(function(data,header,config,status){    //处理响应失败});

调用$http服务会返回一个promise对象，所以可以使用then方法来处理回调，不了解promise的建议了解一下$q：

$http({    url:'data.json',    method:'GET'}).then(function(resq){    //响应成功，resp是后台返回的结果},function(resq){    //处理响应失败，resq是带有错误信息的返回结果});

注意：then方法和上面的两个方法不同的是，then返回的是一个完整的对象，回调方法的入参只有一个，而success和error方法会对返回对象进行析构，所有回调的方法的入参有四个

下面的代码是自己写的一个类似于JQuery的ajax的服务，这个稍微特殊一点的是请求的是xml格式的数据，服务器响应的也是xml格式的数据：

(function(){var commonService = angular.module('services.$AjaxPost',[]);commonService.factory('ajaxRequest',['$http','$q',function($http,$q){var factory = {};//组装请求，转化为xml格式var parseAjaxParamToBexXml = function(oParam){var sXmlString = "<?xml version='1.0' encoding='UTF-8'?><listbex>";var nLength = oParam.length;for (var i = 0; i < nLength; i++) {if (oParam[i].returntype)sXmlString += "<bex func='" + oParam[i].bexId + "' returntype='" + oParam[i].returntype + "'>";elsesXmlString += "<bex func='" + oParam[i].bexId + "' returntype='defaultData'>";var sParam = '';for (var par in oParam[i].param) {var sValue = oParam[i].param[par];if (typeof sValue == 'undefined') {alert('参数：' + par + '值为undefined');return;}var sVal = sValue.toString();sParam += "<" + par + ">" + sVal.replace(/\&/g, '&').replace(/\</g, '<').replace(/\>/g, '>') + "</" + par + ">";}sXmlString += sParam + "</bex>";}sXmlString += '</listbex>';return sXmlString;};factory.post = function (ajaxParam){if(ajaxParam.requestSource && "0" === ajaxParam.requestSource) {ajaxParam.url = ajaxParam.url ? ajaxParam.url : 'CusServlet.ka';}else if (top.userCls === "1") {ajaxParam.url = ajaxParam.url ? ajaxParam.url : 'CusServlet.ka';} else {ajaxParam.url = ajaxParam.url ? ajaxParam.url :'AjaxServlet.ka';}ajaxParam.method = 'post';ajaxParam.timeout = 10000;ajaxParam.headers = {'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'};ajaxParam.responseType = 'document';ajaxParam.transformResponse = function (cnv) {      var x2js = new X2JS();      var aftCnv = x2js.xml2json(cnv);      return aftCnv;    };var ajaxParamArray = ajaxParam.data;var isCheckResult = true;if (ajaxParam.hasOwnProperty("checkResult")) {isCheckResult = ajaxParam.checkResult;delete ajaxParam.checkResult;}var dataTamp;var alertResultMap = {};if(ajaxParam.data){dataTamp = ajaxParam.data;ajaxParam.data = parseAjaxParamToBexXml(ajaxParam.data,alertResultMap);}return $http(ajaxParam);};return factory;}]);})();

使用方法是：在模块注入模块（services.$AjaxPost）的依赖，在需要用该该服务的控制器里添加我自己命名的ajaxRequest的服务，然后调用服务的post方法请求数据：

angular.module('controllers.LoginController',['ui.bootstrap','services.$AjaxPost,'myRoute']).controller('LoginController',['$scope','ajaxRequest','$location','$timeout',function($scope,ajaxRequest,$location,$timeout){$scope.startBorrow = function(){var userId= $scope.user.userId;var pass= $scope.user.userPwd;var safe_code= $scope.user.safeCode;var ajaxParam = {USER_ID:userId,USER_PWD:pass, SAFE_CODE:safe_code};ajaxRequest.post({checkResult:false,data:[{bexId:'userlogin',param:ajaxParam}]}).success( function(result) {if(result.response.micrologin.result.flag == "1" && !result.response.micrologin.result.errMsg){$location.path('/home');}else{$scope.errorFlag = true;$scope.errorMsg = result.response.micrologin.result.prompt;     });   };}]);

’