AngularJS拦截所有$ http请求 [英] AngularJS intercept all $http requests

问题描述

我似乎无法得到$ httpProvider.interceptors实际拦截。我创建时的拦截器运行，当$ HTTP响应成功，登录的jsfiddle样本。后的反应已经成功返回的请求拦截运行。这似乎有点倒退。

因为我需要改变的配置的PARAMS我不能使用transformRequest。这些部分不会在样品中示出

我用AngularJS 1.1.5

http://jsfiddle.net/skeemer/K7DCN/1/

的JavaScript

  VAR对myApp = angular.module（'对myApp'，[]）;myApp.factory（'httpInterceptor'，函数（$ Q）{
    返回{
        要求：功能（配置）{
            Logit模型（' - 修改请求'）;
            返回配置|| $ q.when（配置）;
        }
    };
}）;myApp.config（函数（$ httpProvider）{
    $ httpProvider.interceptors.push（'httpInterceptor'）;
}）;功能MyCtrl（$范围，$ HTTP）{
    //打一服务器，它允许跨域XHR
    $http.get('http://server.cors-api.appspot.com/server?id=8057313&enable=true&status=200&credentials=false')
    .success（功能（数据）{
        //logIt(data[0].request.url）;
        Logit模型（' - 获得成功）;
    }）;    $ scope.name ='超级英雄';
}
//只是记录
VAR日志=的document.getElementById（'原木'）;功能Logit模型（MSG）{
    变种E =使用document.createElement（'DIV'）;
    e.innerHTML =味精;
    logs.insertBefore（即logs.firstChild）;
}
 

HTML

 ＆LT; D​​IV NG控制器=MyCtrl＆GT;您好，{{名称}}＆LT;！/ DIV＆GT;
＆LT; BR /＆GT;
＆LT; D​​IV ID =日志＆GT;＆LT; / DIV＆GT;
 

解决方案

请求拦截器不返回数据后运行。它的运行前。您的Logit函数插入顶部的最新消息。如果您改变code使用$日志服务，你会看到拦截器首次运行。

I can't seem to get the $httpProvider.interceptors to actually intercept. I created a sample on JSFiddle that logs when the interceptor is run and when the $http response is successful. The request interceptor is run after the response is already returned as successful. This seems a bit backwards.

I can't use transformRequest because I need to alter the params in the config. That part isn't shown in the sample.

I'm using AngularJS 1.1.5

http://jsfiddle.net/skeemer/K7DCN/1/

Javascript

var myApp = angular.module('myApp', []);

myApp.factory('httpInterceptor', function ($q) {
    return {
        request: function (config) {
            logIt('- Modify request');
            return config || $q.when(config);
        }
    };
});

myApp.config(function ($httpProvider) {
    $httpProvider.interceptors.push('httpInterceptor');
});

function MyCtrl($scope, $http) {
    // Hit a server that allows cross domain XHR
    $http.get('http://server.cors-api.appspot.com/server?id=8057313&enable=true&status=200&credentials=false')
    .success(function (data) {
        //logIt(data[0].request.url);
        logIt('- GET Successful');
    });

    $scope.name = 'Superhero';
}


// Just the logging
var logs = document.getElementById('logs');

function logIt(msg) {
    var e = document.createElement('div');
    e.innerHTML = msg;
    logs.insertBefore(e, logs.firstChild);
}

HTML

<div ng-controller="MyCtrl">Hello, {{name}}!</div>
<br/>
<div id="logs"></div>

解决方案

The request interceptor isn't running after the data is returned. It's running before. Your logIt function inserts the newest message at the top. If you change your code to use the $log service, you'll see that the interceptor runs first.

这篇关于AngularJS拦截所有$ http请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！