1、$http的普通使用

$http({method: "GET",url: url,headers: {},timeout: 10000
}).then(successCallBack,failCallBack);

这样的使用方式的问题在哪？

第一：如果一个项目的接口有100个，那这样的引用方式会引起大量的冗余代码。

第二：Api不够简洁，无法提供一个忽视底层实现的方式进行服务请求。比如，上传文件的时候要对headers进行额外的设置等。

第三：最重要的是，毫无技术积累，下次同样的项目，你的代码还是无法复用，还是需要一遍遍的写$http。

所以，我们要对 $http 进行封装，形成简洁易用、结构清晰的数据请求 Api。

2、angular服务封装的目标和实现思路。

目标：封装成向顶层提供get、post两种方式的Api，Api的参数配置只和url、data相关。形成类似于 RequestService.get(url,data).then 这样的Api。

封装思路：由于angular的$http本身就是基于Promise的，所以本身不用引入第三方promise库。只需要把相同的部分提取出来即可。当然，angular在这方面还提供了全局的拦截器服务。

3、封装

第一步、定义一个基于服务module模块。

//BaseService.module.js
(function(){
    "use strict";angular.module('BaseService',[]);
})();

第二步、拦截器实现

//BaseService.intercepter.js
(function(){
    "use strict";angular.module('BaseService').factory('requestInterceptor', function ($rootScope, $log){return{request:function(config){return config;},requestError:function(config){return config;},response:function(res){//res返回不正常的处理return res;},responseError:function(res){//res返回错误处理}}}).config(function($httpProvider){$httpProvider.interceptors.push('requestInterceptor');})
})();

第三步、公共提取

//BaseService.comm.js
(function(){
    'use strict';angular.module('BaseService').config(function(){
$httpProvider.defaults.useXDomain = true;   // 发送CORS$httpProvider.defaults.withCredentials = false;  // 请求携带Cookiesdelete $httpProvider.defaults.headers.common['X-Requested-With'];}).provider("RequestService",function(){return {$get: function(){return {get:function(url,data,processor){//coding},post:function(url,data){ //coding},request: request}}}})
})()