修复角度中的圆形依赖关系

Fix Circular Dependency in Angular

本文关键字:依赖 关系      更新时间:2023-09-26

所以我有两个角度工厂,一个是用户相关的(用户登录了吗?与后端交谈并登录她)

  app.factory('userFactory', function($window, $location, $http) {
        var loggedUser = {}; 
        loggedUser.isLogged = false;
        loggedUser.check = function() {
             if($window.sessionStorage.user) {           
                this.isLogged = true;
            } else {
                this.isLogged = false;               
            }
        }        
        loggedUser.doLogin = function (theData) {                
                var promise = $http({method: 'POST', url: 'http://whatevah/login', data: theData});                
                return promise;            
        } 
        return  loggedUser;
    });             

一个与拦截器相关(发送令牌并获取答案以查看用户是否已登录)。

  app.factory('tokenFactory', function($q, $window, $http) {
    return {
      request: function(config) {
        config.headers = config.headers || {};
        if ($window.sessionStorage.token) {
          $http.defaults.headers.common['mytoken'] = $window.sessionStorage.token;
        }
        return config || $q.when(config);
      },
      response: function(response) {
        return response || $q.when(response);
      }
    };
  });

它们都$http注入,这会导致此错误

Circular dependency found: $http <- tokenFactory<- $http <- userFactory

对我来说很奇怪,两个不同的角度工厂不能有相同的注射,因为这些工厂有不同的名称,做不同的事情

我该如何解决这个问题?

谢谢

正如@mzulch所评论的那样,您不能依赖用作 http 拦截器的工厂中的$http。

在您的情况下,最简单的解决方案是设置请求的标头,而不是全局标头:

app.factory('tokenFactory', function($q, $window) {
  return {
    request: function(config) {
      config.headers = config.headers || {};
      if ($window.sessionStorage.token) {
        config.headers['mytoken'] = $window.sessionStorage.token;
      }
      return config || $q.when(config);
    },
    response: function(response) {
      return response || $q.when(response);
    }
  };
});