$http

AngularJS提供了$http服務來同服務端進行通信，$http服務隊瀏覽器的XMLHttpRequest對象進行了封裝，讓我們可以以ajax的方式來從服務器請求數據。

在AngularJS中與遠程HTTP服務器交互時會用一個非常關鍵的服務-$http。

      1、$http是angular中的一個核心服務，利用瀏覽器的xmlhttprequest或者via JSONP對象與遠程HTTP服務器進行交互。

      2、$http的使用方式和jquery提供的$.ajax操作比較相同，均支持多種method的請求，get、post、put、delete等。

      3、$http的各種方式的請求更趨近于rest風格。

      4、在controller中可通過與$scope同樣的方式獲取$http對象,e.g. function controller($scope,$http){}

下面進行$http服務的使用說明，調用如下：

$http(config).success(function(data,status,headers,config){}).error(function(data,status,headers,config){});

$http服務是一個接受一個參數的函數，參數的類型是對象，用來配置生成的http的請求，該函數返回一個promise對象

var promise = $http({ method:'GET', url:'/api/user.json'});promise.then(function(resp){}, function(resp){})

$http請求的配置對象

$http()接受的配置對象可以包含以下屬性:

     method:http請求方式，可以為GET,DELETE,HEAD,JSONP,POST,PUT

     url:字符串，請求的目標

     params:字符串或者對象，會被轉換成為查詢字符串追加的url后面

     data:在發送post請求時使用，作為消息體發送到服務器

     headers:一個列表，每個元素都是一個函數，返回http頭

     xsrfHeaderName(字符串)：保存XSFR令牌的http頭的名稱

     xsrfCookieName:保存XSFR令牌的cookie名稱

     transformRequest:函數或者函數數組，用來對http請求的請求體和頭信息進行轉換，并返回轉換后的結果。

     transformResponse:函數或者函數數組，用來對http響應的響應體和頭信息進行轉換，并返回轉換后的結果。

     cache:布爾類型或者緩存對象，設置之后angular會緩存get請求。

     timeout:數值，延遲請求

     responseType：字符串，響應類型。可以為arraybuffer, blob,document,json, text, moz-blob, moz-chunked-text, moz-chunked-

     arraybuffer

$http請求的響應對象

     angular傳遞給then方法的響應對象包括以下幾個屬性

     data:轉換之后的響應體

     status:http響應狀態碼

     headers:頭信息

     config:生成原始請求的設置對象

     statusText:http響應狀態的文本

攔截器

angular中通過攔截器我們可以從全局層面對請求以及響應進行攔截。

使用攔截器之前，我們通過factory()聲明一個服務，然后通過$httpProvider注冊攔截器。攔截器分為四種，兩種成功攔截器，兩種失敗攔截器。

angular.module('test', []).factory('testInterceptor', function($q){ var interceptor = { 'request':function(config){ return config; }, 'response':function(resp){ return response; }, 'requestError':function(rejection){ return $q.reject(rejection); }, 'responseError':function(rejection){ return rejection } } return interceptor;})angular.module('test', []).config(function($httpProvider){ $httpProvider.interceptors.push('testInterceptor');})

總結

以上就是這篇文章的全部內容，希望能對大家的學習或者工作帶來一定的幫助，如果有疑問大家可以留言交流。