AngularJS 中 非同步請求$http 對象的使用

AngularJS 中 非同步請求$http 對象的使用
??

AngularJS 提供了一個類似jquery的$.ajax的對象，用於非同步請求。
在AngularJS中對非同步作業是推崇至極的，所以$http的操作都是非同步不像jquery.ajax裡還提供了async參數。

 

對於官網的$http對象的總結和使用。

 

用法：

$http(config);

參數：

config （常用的參數標紅，翻譯了一下）

config

object

Object describing the request to be made and how it should be processed. The object has following properties: method – {string} – HTTP method (e.g. 'GET', 'POST', etc) ------------------ http互動方法：GET/POST 兩種 url – {string} – Absolute or relative URL of the resource that is being requested. ------------------ URL傳輸地址 params – {Object.} – Map of strings or objects which will be serialized with theparamSerializer and appended as GET parameters. ------------------ Map 類型的參數，傳輸給後台 data – {string|Object} – Data to be sent as the request message data. ------------------ 要求傳入的參數 headers – {Object} – Map of strings or functions which return strings representing HTTP headers to send to the server. If the return value of a function is null, the header will not be sent. Functions accept a config object as an argument. xsrfHeaderName – {string} – Name of HTTP header to populate with the XSRF token. xsrfCookieName – {string} – Name of cookie containing the XSRF token. transformRequest – {function(data, headersGetter)|Array.} – transform function or an array of such functions. The transform function takes the http request body and headers and returns its transformed (typically serialized) version. See Overriding the Default Transformations transformResponse –{function(data, headersGetter, status)|Array.} – transform function or an array of such functions. The transform function takes the http response body, headers and status and returns its transformed (typically deserialized) version. See Overriding the Default TransformationjqLiks paramSerializer - {string|function(Object):string} - A function used to prepare the string representation of request parameters (specified as an object). If specified as string, it is interpreted as function registered with the $injector, which means you can create your own serializer by registering it as a service. The default serializer is the $httpParamSerializer; alternatively, you can use the$httpParamSerializerJQLike cache – {boolean|Cache} – If true, a default $http cache will be used to cache the GET request, otherwise if a cache instance built with $cacheFactory, this cache will be used for caching. ------------------ 緩衝，設為true的時候,預設的$ HTTP緩衝將用於緩衝GET請求，否則，建立Factory緩衝執行個體. timeout – {number|Promise} – timeout in milliseconds, or promise that should abort the request when resolved. withCredentials - {boolean} - whether to set the withCredentials flag on the XHR object. See requests with credentials for more information. responseType - {string} - see XMLHttpRequest.responseType.

 

返回： 一個httpPromise對象(一般只用data和status)

HttpPromise

Returns a promise object with the standard then method and two http specific methods: success and error. Thethen method takes two arguments a success and an error callback which will be called with a response object. Thesuccess and error methods take a single argument - a function that will be called when the request succeeds or fails respectively. The arguments passed into these functions are destructured representation of the response object passed into the then method. The response object has these properties: data – {string|Object} – The response body transformed with the transform functions. ------------------ 返回資料 status – {number} – HTTP status code of the response. ------------------ 返回狀態。等於200時為成功，否則失敗。 headers – {function([headerName])} – Header getter function. config – {Object} – The configuration object that was used to generate the request. ------------------ 用於產生請求的設定物件，原來傳入的參數等。 statusText – {string} – HTTP status text of the response. ------------------ 返回的狀態文本

方法：

get(url, [config]); 快捷的方法來執行GET請求。

post(url, data, [config]); 快捷的方法來執行POST請求。

put(url, data, [config]);

patch(url, data, [config]);

 

jsonp(url, [config]);

head(url, [config]);

delete(url, [config]);

 

 

我自己的使用例子（使用promise解決回調地獄問題）

 

          var deferred = $q.defer();          $http({            cache: false,            method: 'GET',            url: Constants.baseURL + '/loginj',            params: params,            headers: {'X-Auth-Token': $window.token}          }).then(function(res) {            if (200 === res.status && res.data.LoginResponse.success) {              if (!Array.isArray(res.data.LoginResponse.settings.account)) {                res.data.LoginResponse.settings.account = [res.data.LoginResponse.settings.account];              }                            CurrentUser.id = res.data.LoginResponse.settings.id;                            deferred.resolve(res.data.LoginResponse.settings);            } else {              deferred.reject(failed to fetch login data);            }          }, function(error) {              deferred.reject(error.status+ +error.statusText);          });          return deferred.promise;