Javascript $http请求的后台处理通知

我正在寻找一种方法来“包装”所有

$http

请求，以便在应用程序进行某些处理时显示

gif

图像。我还想将相同的解决方案用于其他类型的后台处理，而不仅仅是

$http

我问这个问题的原因是，我总是必须将我的

处理指示器

设置为

真

，然后切换回我的

成功

函数，这一点都不优雅

我看到的一个潜在解决方案是使用一个函数作为参数。此函数将

processingIndicator

设置为

true

，调用该函数，然后将

processingIndicator

设置回'false'

function processAjaxRequestSuccessFn(fooFn){
  // display processing indicator
  fooFn();
  // hide processing indicator
}

然后

$http.get(...).then(processAjaxRequestSuccessFn, processAjaxRequestErrorFn)

这个解决方案不是很方便，因为每次我需要通知用户发生了什么事情，我都需要使用这个功能

我正在寻找一种方法来自动化这个过程

还有其他想法吗

以后编辑

---

我的另一个想法是用我自己的

get

、

post

等扩展

$http

，或者创建一个具有类似行为的定制服务。但仍然不是很优雅。

我成功地在http请求挂起时使用显示加载指示器。下载文件并按照说明进行操作，它应该可以工作。

使用拦截器。观察下面的例子

app.factory('HttpInterceptor', ['$q', function ($q) {
    return {
        'request': function (config) {
            /*...*/
            return config || $q.when(config);   // -- start request/show gif
        },
        'requestError': function (rejection) {
            /*...*/
            return $q.reject(rejection);
        },
        'response': function (response) {       // -- end request/hide gif
            /*...*/
            return response || $q.when(response);
        },
        'responseError': function (rejection) {
            /*...*/
            return $q.reject(rejection);
        }
    };
}]);

---

在这里，您可以在http请求生命周期中的不同点注入集中式逻辑，连接到api提供的回调中。制作您可能需要的任何可重用的请求逻辑-只需在此处执行即可。有关更多信息，请查看的拦截器部分

app.config(['$httpProvider', function ($httpProvider) {
    $httpProvider.interceptors.push('HttpInterceptor');
    /*...*/
}]);