Question

我一直在关注这篇文章http://www.webdeveasy.com/interceptors-in-angularjs-and-useful-examples/来创建一个拦截器，它可以为我的所有请求添加基于服务器的令牌。我在js文件中制作了以下代码。在下面的文件中，SessionHolder是一个在登录时存储令牌的文件。但目前我正在对文本进行硬编码。

(function (module) {
    module.factory('sessionManager', ['sessionHolder', function (sessionHolder) {
        console.log("Reached sessionManager");
        var sessionManager = {
            request: function (config) {
                //if (sessionHolder.validation_capability) {
                config.headers['x-session-token'] = 'saurabh';
                config.headers['baap'] = 'saurabh';//sessionHolder.AuthorisationToken;
                //}
                return config;
            }
        };
        return sessionManager;


    }]);

}(angular.module("MarketPlan")));

其中＆＃34; MarketPlan＆＃34;是我的ng-app。

现在在app.js文件中，我正在执行以下操作：

    (function (app) {
        app.config(function ($stateProvider, $urlRouterProvider, $mdThemingProvider, datepickerPopupConfig, datepickerConfig, $httpProvider) {

            // override defaults for date picker
            datepickerPopupConfig.showButtonBar = false;
            datepickerConfig.showWeeks = false;

//guiding initial routes
            $urlRouterProvider.otherwise(document.cookie.indexOf('main=1') !== -1 ? '/home' : '/business');

//setting theme configs
            $mdThemingProvider.definePalette('grey', {
                '50': 'eeeeee',
                '100': 'ffffff',
                '200': 'ffffff',
                '300': 'ffffff',
                '400': 'ffffff',
                '500': 'ffffff',
                '600': 'ffffff',
                '700': 'ffffff',
                '800': 'ffffff',
                '900': 'ffffff',
                'A100': 'ffffff',
                'A200': 'ffffff',
                'A400': 'ffffff',
                'A700': 'ffffff',
                'contrastDefaultColor': 'dark', 
                'contrastDarkColors': ['50', '100', '200'],
                'contrastLightColors': undefined 
            });

    // I am trying to push the custom interceptor here, as the article says it needs //to be done in the app config
            $httpProvider.interceptors.push('sessionManager');
        });


    }(angular.module("MarketPlan", ["my dependencies here"])));

使用此代码，我会在应用程序启动后立即收到“未知会话提供程序”错误。

我无法弄清楚为什么会这样。仅供参考，我的理解是拦截器（工厂）应该在你的应用程序中注册。应该将此拦截器的名称推入config中的$ httpProvider拦截器数组（即应用程序引导时）。

这是正确的理解吗？是否存在按时间顺序排列的事情。

请指导我。

Answer 1

嗯，我刚刚意识到我在这里犯了一个大错。实际上我正在遵循我的项目的基于模块的结构，其中所有小模块在主应用程序（app.js文件）中被分组为依赖项。

早些时候，我试图在一个这样的模块中注册拦截器。但是，很明显，它应该在主应用程序（ng-app）中注册。

在主应用程序中声明它们为我解决了这个问题。所以现在我的app.js就像这样：

(function (app) {
    app.config(function ($stateProvider, $urlRouterProvider, $mdThemingProvider, datepickerPopupConfig, datepickerConfig, $httpProvider) {

        //pushing interceptor here
        $httpProvider.interceptors.push('sessionManager');

    });

    //declaring interceptor here
    app.factory('sessionManager', ['sessionHolder', function (sessionHolder) {
        console.log("Reached sessionManager");
        var sessionManager = {
            request: function (config) {
                //if (sessionService.validation_capability) {
                config.headers['x-session-token'] = 'saurabh';
                config.headers['baap'] = 'saurabh';//sessionService.AuthorisationToken;
                //}
                return config;
            }
        };
        return sessionManager;


    }]);

    //declaring service to store token here
    app.service('sessionHolder', function () {
        console.log("Reached sessionHolder");
        var self = this;
        this.validation_capability = false;
        this.saveAuthorisationToken = function (token) {
            self.AuthorisationToken = token;
            self.validation_capability = true;
        }
    });

    //run function of the application
    app.run(function ($rootScope) {
     //runtime changes here  
    });

    app.controller('AppController', function () {
    //controlled define in app, in case needed
    });

}(angular.module("MarketPlan", ["my dependencies"])));

现在工作正常。希望有一天它可以帮助某人

为什么我的AngularJS自定义拦截器不起作用

1 个答案: