注$路由到一个HTTP拦截 [英] inject $route into a http interceptor

问题描述

我试图注入自定义标题到每个API请求。当我提供它的工作原理一些硬codeD文本。

工作code

  myApp.config（['$ httpProvider'，函数（$ httpProvider）{
    VAR requestInterceptor = ['$ Q'，'$ rootScope'，
        功能（$ Q $ rootScope）{
            VAR interceptorInstance = {
                要求：功能（配置）{
                    config.headers ['X-MyApp的-CustomHeader'] =foobar的;
                    返回配置|| $ q.when（配置）;
                }
            };
            返回interceptorInstance;
        }];    $ httpProvider.interceptors.push（requestInterceptor）;
}]）;
 

不工作code

  myApp.config（['$ httpProvider'，函数（$ httpProvider）{
    VAR requestInterceptor = ['$ Q'，'$ rootScope'，'$路线'，
        功能（$ Q $ rootScope，$路线）{
            VAR interceptorInstance = {
                要求：功能（配置）{
                    config.headers ['X-MyApp的-CustomHeader'] = $ route.current.params.CustomParameter;
                    返回配置|| $ q.when（配置）;
                }
            };
            返回interceptorInstance;
        }];    $ httpProvider.interceptors.push（requestInterceptor）;
}]）;
 

错误：：当试图注入 $路线

  

未捕获的错误：[$喷油器：CDEP]循环依赖发现：$路线＆LT; - $ HTTP
   http://errors.angularjs.org/1.2.3/ $喷油器/ CDEP？P0 =％24route％20％3 C-％20％24http

解决方案

这是一个已知的问题

看看我的答案是：<一href=\"http://stackoverflow.com/questions/21119016/is-there-a-way-to-request-http-for-an-interceptor/21119959#21119959\">Is有没有办法要求的$ HTTP进行拦截？

$路线取决于 $ HTTP 这又依赖于拦截器：

  myApp.config（['$ httpProvider'，函数（$ httpProvider）{
    VAR requestInterceptor = ['$ Q'，'$ rootScope'，'$喷油器'，
        功能（$ Q $ rootScope，$喷油器）{
            VAR interceptorInstance = {
                要求：功能（配置）{
                    变量$路径= $ injector.get（'$路线'）;
                    config.headers ['X-MyApp的-CustomHeader'] = $ route.current.params.CustomParameter;
                    返回配置|| $ q.when（配置）;
                }
            };
            返回interceptorInstance;
        }];    $ httpProvider.interceptors.push（requestInterceptor）;
}]）;
 

什么是$喷油器？

• 您必须阅读的文档


• 而看到这伟大的教程

  

$注射器用于检索对象实例由提供者定义的，实例的类型，调用方法，和加载模块

在内部，angular.js将使用$注射器注射的所有依赖调用你的方法（配置/运行块）。所以你很少需要担心这会自动发生。
在$喷油器未能解决您的依赖情况下，你可以做手工。

I am trying to inject custom header to every API request. When I am providing some hard coded text it works.

Working code

myApp.config(['$httpProvider', function ($httpProvider) {
    var requestInterceptor = ['$q', '$rootScope', 
        function ($q, $rootScope) {
            var interceptorInstance = {
                request: function (config) {
                    config.headers['X-MyApp-CustomHeader'] = "foobar"; 
                    return config || $q.when(config);
                }
            };
            return interceptorInstance;
        }];

    $httpProvider.interceptors.push(requestInterceptor);
}]);

Not working code

myApp.config(['$httpProvider', function ($httpProvider) {
    var requestInterceptor = ['$q', '$rootScope', '$route',
        function ($q, $rootScope, $route ) {
            var interceptorInstance = {
                request: function (config) {
                    config.headers['X-MyApp-CustomHeader'] = $route.current.params.CustomParameter; 
                    return config || $q.when(config);
                }
            };
            return interceptorInstance;
        }];

    $httpProvider.interceptors.push(requestInterceptor);
}]);

Error: When trying to inject $route

Uncaught Error: [$injector:cdep] Circular dependency found: $route <- $http http://errors.angularjs.org/1.2.3/$injector/cdep?p0=%24route%20%3C-%20%24http

解决方案

This is a known issue.

Check out my answer: Is there a way to request $http for an interceptor?

$route depends on $http which in turn depends on the interceptors:

myApp.config(['$httpProvider', function ($httpProvider) {
    var requestInterceptor = ['$q', '$rootScope', '$injector',
        function ( $q, $rootScope, $injector ) {
            var interceptorInstance = {
                request: function (config) {
                    var $route = $injector.get('$route');
                    config.headers['X-MyApp-CustomHeader'] = $route.current.params.CustomParameter; 
                    return config || $q.when(config);
                }
            };
            return interceptorInstance;
        }];

    $httpProvider.interceptors.push(requestInterceptor);
}]);

what is $injector?

• You must read the docs
• And see this great tutorial

$injector is used to retrieve object instances as defined by provider , instantiate types, invoke methods, and load modules.

Internally, angular.js would use $injector to invoke your methods ( config / run blocks ) with all the dependencies injected. This happens automatically so you rarely need to worry about it. In cases where $injector fails to resolve your dependencies you can do it manually.

这篇关于注$路由到一个HTTP拦截的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！