1

我的Web应用程序登录过程如下，

一个。用户点击登录按钮，链接将他们带到http://localhost:3030/login/facebook

湾。NodeJS 后端接收请求，并使用 passport-facebook 将浏览器定向到 Facebook 登录页面。

C。然后，Facebook 使用一些用户数据将用户引导回回调。（回调：http://localhost:3030/login/facebook/callback）

d。使用用户数据，帐户要么存在，要么将被创建，并且将创建属于该帐户的令牌（使用 JWT）

e. 该令牌将通过重定向到http://localhost:3030/#/got_token/the_actual_jwt_string发送给用户

F。AngularJS 应用程序将使用 ngRoute 进行路由，并将令牌保存在 localStorage 中。

NodeJS 中的令牌发行代码，

server.get('/auth/facebook', passport.authenticate('facebook', {session: false}));
server.get('/auth/facebook/callback', passport.authenticate('facebook', {session: false}), function(req, res) {
  var token = jwt.sign(/* issue a token */);
  // put the token into database
  res.header('Location', 'http://localhost:3030/#/got_token/' + token);
  res.send(302);
});

AngularJS 中的路由代码，

.when('/got_token/:token*', {
   redirectTo: function(parameters, path, search) {
     localStorage.setItem('ngStorage-token', JSON.stringify({
       token: parameters.token
      }));
     return '/';
    }
 })

这很好用，直到我的视图层次结构看起来像这样，

<body ng-controller="NavigationViewController">
  <div ng-view>
  </div>
</body>

和控制器代码，

controllers.controller('NavigationViewController', ['$scope', '$route', 'token', function($scope, $route, token) {
    var _token = token.retrieve();
    $scope.token = _token;
    $scope.authenticated = (_token != '');
    if ($scope.authenticated) {
      var payload_string = b64utos(_token.split('.')[1]);
      var payload = KJUR.jws.JWS.readSafeJSONString(payload_string);
      $scope.displayName = payload.facebookDisplayName;
    } else {
      $scope.displayName = 'no';
    }
    $scope.logout = function() {
      token.clear();
    };
}]);

完成的路由ngRoute不会重新创建 my NavigationViewController，而是将_token变量设置为先前的状态。

我需要一种方法来NavigationViewController知道令牌已更改，因为它不参与路由。

4

3 回答 3

1

想建议你两个想法。这里是这两个。(1.) 您可以将 $watch 添加到令牌中，以便无论何时更改它都会自动反映。(2.) 将令牌分配到 rootscope 并在令牌更改时更新它。

如果你需要的话，我也想给你例子。

问候， 马亨德拉

于 2015-08-07T12:03:56.300 回答
1

看起来您需要在控制器之间传递数据。这是您可以做到的一种方法。NavigationViewController在你的for中监听一个事件，changed并emit在它发生变化时监听它。绑定它rootScope。

angular.module('app', [])

.controller('LoginCtrl', function ($scope, $rootScope) {
    $scope.changeToken = function () {
        $rootScope.$emit('changed', +new Date());
    }
})

.controller('NavigationViewController', function ($scope, $rootScope) {
    $scope.token = null;

    $rootScope.$on('changed', function(event, token) {
        $scope.token = token;
    });
})
于 2015-08-07T12:35:51.860 回答
0

最后，使用了一个简单的解决方案——事件。

正如我的问题的标题所示，我想在路由更改时重新加载嵌套的父视图控制器。由于嵌套层次结构的父级不是由 管理的ngRoute，因此它不会自动执行此操作。但是，ngRoute有一个服务 ( $route) 会发出事件，这是最简单的答案。

基本上，我将所有初始化代码放入一个函数中，并在事件中调用该函数。

controllers.controller('NavigationViewController', ['$scope', '$route', '$location', 'token', function($scope, $route, $location, token) {
    var updateNavigationBar = function() {
      var _token = token.retrieve();
      $scope.token = _token;
      $scope.authenticated = (_token != '');
      if ($scope.authenticated) {
        var payload_string = b64utos(_token.split('.')[1]);
        var payload = KJUR.jws.JWS.readSafeJSONString(payload_string);
        $scope.displayName = payload.facebookDisplayName;
      } else {
        $scope.displayName = 'no';
      }
    };

    $scope.$on('$routeChangeSuccess', function(event, current, previous) {
      if ($location.path() == '/events') {
        updateNavigationBar();
      }
    });

    updateNavigationBar();
}]);
于 2015-08-08T16:40:00.580 回答