依賴:$httpBackend $cacheFactory $rootScope $q $injector
使用:$http(config);
參數:
method:字符串,請求方法。
url:字符串,請求地址。
params:字符串或者對象,將使用paramserializer序列化並且作為GET請求的參數。
data:字符串或者對象,作為請求信息數據的數據。
headers:對象,字符串或者函數返回表示發送到服務器的HTTP請求頭。如果函數的返回值為空,則headers則不發送。函數接受一個配置對象作為參數。
xsrfHeaderName:字符串,填充XSRF令牌的HTTP請求頭名稱。
xsrfCookieName:字符串,含有XSRF令牌cookie的名字。
transformRequest:函數/函數的數組。轉換函數或者一個包含轉換函數的數組。轉換函數獲取http請求體和請求頭,並且返回他們的轉換版(通常是序列化)。
transformResponse:函數/函數的數組。轉換函數或者一個包含轉換函數的數組。轉換函數獲取http響應體和響應頭,並且返回他們的轉換版(通常是序列化)。
paramSerializer:字符串或者返回字符串的函數。用於編寫請求參數(指定為對象)的字符串表示形式的函數。如果指令是字符串,那么將被解釋為通過$injector注冊的函數,這意味着你能通過注冊服務方式創建你自己的序列化程序。默認的序列化是$httpParamSerializer;或者你可以使用$httpParamSerializerJQLike。
cache:boolean,如果為true,一個默認的$http緩存將被作為請求的緩存,否則如果存在一個用$cacheFactory創建的緩存實例,則將用於緩存。
timeout:數值,毫秒,超時則讓請求中止。
withCredentials:boolean,是否設置withcredentials flag的XHR對象。查看更多信息的憑據。
responseType:字符串,響應頭類型。
返回:
data:字符串或對象。變換函數變換后的響應體。
status:數值,響應的http狀態碼。
headers:函數,響應頭的getter函數。
config:對象,用於生成請求的配置對象。
statusText:字符串,響應的HTTP狀態文本。
方法:
get(url,[config]);
url:請求地址。
config:請求配置對象。
delete(url,[donfig]);
url:請求地址。
config:請求配置對象。
head(url,[config]);
url:請求地址。
config:請求配置對象。
jsonp(url,[config]);
url:請求地址。
config:請求配置對象。
post(url,data,[config]);
url:請求地址。
data:請求內容。
config:請求配置對象。
put(url,data,[config]);
url:請求地址。
data:請求內容。
config:請求配置對象。
patch(url,data,[config]);
url:請求地址。
data:請求內容。
config:請求配置對象。
屬性:
pendingRequests
當前正在等待的請求的配置對象數組。主要是為了用於調試目的。
defaults
請求頭配置默認屬性。
$httpParamSerializerJQLike
Http參數序列化程序。序列化程序也將按字母順序排序的參數。
使用代碼:
(function () {
angular.module("Demo", [])
.controller("testCtrl",["$http", "$httpParamSerializerJQLike",testCtrl]);
function testCtrl($http, $httpParamSerializerJQLike){
var data = { id: 1, value: "hello" };//
$http({
method: "post",
data: data,//Form Data = {"id":1,"value":"hello"}
url: "/url",
headers: { "Content-Type": "application/x-www-form-urlencoded" }
}).success(function (d) { console.log(d); }).error(function(error){console.log(error);});
$http({
method: "post",
data: $httpParamSerializerJQLike(data),//Form Data 變成 id:1 value:hello url: "/url",
headers: { "Content-Type": "application/x-www-form-urlencoded" }
}).success(function(d){ console.log(d);}).error(function(error){ console.log(error);});
};
}());
當然,這種鏈式寫法相比於jq的$ajax有更好的體驗。但是,這仍然不是終極版。
在ES6中,我們有了確定的規則——promise,回調函數。
so,我們可以:
var promise = $http({ //..... }); promise.then().catch();
OK,就這樣。
最后補充一點,之前我嘗試進行代碼復用,然后發現很扯淡,$http默認是異步的,那么data就無法取出,除非你的所有數據使用方式是一樣的。
當然也可以搞個函數參數傳進去,不過我想如果不是閑的蛋疼就別了。
--------------------------------------------------------------------------------------2017.4.6 9:57:00-----------------------------------------------------------------
1。 angular1.6版本之后采用es6的回調寫法,使用起來更方便。
2. 關於$http post參數上傳后台接受不到的情況,需要配置config,代碼如下:
.config(['$httpProvider', function($httpProvider) { $httpProvider.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded"; $httpProvider.defaults. transformRequest.unshift(function(data, headersGetter) { var key, result = []; for (key in data) { if (data.hasOwnProperty(key)) { result.push(encodeURIComponent(key) + "=" + encodeURIComponent(data[key])); } } return result.join("&"); }); }])

