如何结合护照和angular-ui路由

Posted 2023-03-07

【中文标题】如何结合护照和angular-ui路由

【英文标题】：How to combine passport and angular-ui routing

【发布时间】：2015-02-13 14:24:14

【问题描述】：

我想知道如何将 angular-ui-routing 与护照相结合。 我找到的所有示例都使用了 node.js 路由。

var routerApp = angular.module('routerApp', ['ui.router']);

routerApp.config(function($stateProvider, $urlRouterProvider) 

$urlRouterProvider.otherwise('/home');

$stateProvider

    .state('home', 
        url: '/home',
        templateUrl: 'partial-home.html'
    )

    .state('about', 
        // for example just show if is loggedIn       
    );

在上面的 sn-p 中我该如何实现这个功能？

function isLoggedIn(req, res, next) 

    // if user is authenticated in the session, carry on 
    if (req.isAuthenticated())
        return next();

    // if they aren't redirect them to the home page
    res.redirect('/');

感谢您的每一个提示

【问题讨论】：

有人知道它是否可以在没有太多开销的情况下工作吗？

如果您不介意，请尝试查看此Q & Q 以了解如何解决类似问题。

vickev.com/#!/article/… 这更有帮助。它来自谷歌 Angular 开发人员。

【参考方案1】：

开始的一种方法是在 Angular 中创建一个服务，该服务使用 $http 在 Express 中访问您的端点。 $http 返回一个带有成功和错误方法的承诺，您可以使用它来更改状态。如果您正在构建单页应用程序 (SPA)，这可能就是您需要知道的全部内容。例如：

// An Angular service that talks to Express
UserService.$inject = ['$http', '$state']; 

function UserService($http, $state) 

    this.loginUser = function (user) 
      $http.post("/api/login", user)
        .success(function (data, status) 
          console.log('Successful login.');
          console.log('data = ' + data); 
          console.log('status = ' + status); 
          $state.go('welcome'); // 
      )
        .error(function (data) 
          console.log('Error: ' + data);
          $state.go('somewhereelse'); 
      );
  ; 

$state.go 是一种 UI Router 便捷方法，它将呈现您定义的状态。

在 Express 中，您需要为 Passport 编写自己的回调函数来控制返回的内容。例如：

 // Express Route with passport authentication and custom callback
  app.post('/api/login', function(req, res, next) 
      passport.authenticate('local-login', function(err, user, info) 
        if (err) 
        return next(err); 
      
      if (user === false) 
        res.status(401).send(info.message);  
       else 
        res.status(200).send(info.message); 
      
    )(req, res, next); 
  );

在此示例中，我使用了“本地登录”护照策略，该策略在后台发挥了神奇的作用。如果用户通过了身份验证，它将向 Angular 发送 200，这反过来又会触发 .success。否则它将发送 401 Unauthorized 并触发 .error。

【讨论】：

感谢您的回答，但我找到了一个完整的解决方案，可以帮助我更多地了解我的问题。 github.com/DaftMonk/angular-passport