AngularJS封裝$http.post()實例詳解

用了不是很長的時間跟了一個移動APP項目，用的是ionic + AngularJS + cordova框架，其間遇到過挺多問題，其中一個就是對Ajax的封裝問題。

其實針對封裝問題一直以來就沒停止過談論，不同的項目也有不同的需求，舉個典型的例子，我在做這個項目的時候因為一開始沒有考慮封裝問題所以被批評了，而我的一個朋友卻因為封裝了受到了批評……很尷尬不是么。

那么對于是否要封裝這個問題，究竟該怎么界定？其實這不是一個很復雜的問題，歸根到底就是一個收益比率的問題，如果項目規模不是很大，那么過多考慮封裝問題本身就沒什么意義，對于項目的收益極低；而對于規模大的項目來說，如果不封裝，那么潛在的風險就高得多，所以前期的投入也是值得的。

當然這個問題并不是我這樣一個小白能掰扯清楚的事情，今天就來說說如果考慮封裝的話，那么我會怎么處理。

angularjs中提供了一個服務http，它用來處理Ajax請求，這里我假設讀者是了解angularjs的，所以直奔主題：對于post請求該如何處理封裝。首先我需要確定一個事情，我能否排除所有使用者（項目團隊成員）的個性化需求（需特殊處理的情況）。如果我不能，那么我該如果開放接口才能將post請求還原，所以我需要一個出口返回http.post()。

第二點，我需要考慮每一個使用者在應答到來時如何處理結果，針對success和error兩種情況，我需要為他們提供一個處理邏輯的入口。

綜合上面兩點，我大概有了思路，我需要定義一個服務（公共服務），并且提供一個myPost方法，其中我允許使用者定義響應的回調，并且我允許他們取得更自由的處理方式，給他們一個原原本本的post()。好在js足夠靈活，所以我可以這樣來寫：

service('myHttpService', ['$http', function ($http) {  var myHttpPost = function (url, data, successFn, errorFn) {  }  return {    myHttp: function (url, data, successFn, errorFn) {      return myHttpPost(url, data, successFn, errorFn);  }  }}]);

如上，我會return內部定義的方法，這個方法允許使用者定義successFn和errorFn，即相應成功和失敗的回調，如此一來使用者大可放心的預先編寫數據的處理邏輯，而無需關心其他細節。

另外，我允許使用者拿到更加靈活的post()，那么我是這樣實現的：

var httpPromise = $http.post(url, data, {timeout: 30000});if (!angular.isDefined(successFn)) {  return httpPromise;}

如果使用者并沒有定義成功回調，好吧，這層封裝就當是不存在，我會把post()丟出去，由調用者自行處理。而如果調用者想預先定義的話，我應當在封裝中處理好他們的邏輯：