栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

AngularJS-每个路由和控制器中的登录和身份验证

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

AngularJS-每个路由和控制器中的登录和身份验证

我的解决方案分为三个部分:用户状态存储在服务中;在运行方法中,您观察路由更改时的运行方式;检查是否允许用户访问请求的页面;在主控制器中,查看是否用户状态更改。

app.run(['$rootScope', '$location', 'Auth', function ($rootScope, $location, Auth) {    $rootScope.$on('$routeChangeStart', function (event) {        if (!Auth.isLoggedIn()) { console.log('DENY'); event.preventDefault(); $location.path('/login');        }        else { console.log('ALLOW'); $location.path('/home');        }    });}]);

您应该创建一个服务(我将其命名为

Auth
),该服务将处理用户对象并具有一种方法来确定用户是否已登录。

服务内容

 .factory('Auth', function(){var user;return{    setUser : function(aUser){        user = aUser;    },    isLoggedIn : function(){        return(user)? user : false;    }  }})

app.run
您应该从中收听
$routeChangeStart
事件。当路由更改时,它将检查用户是否已登录(该
isLoggedIn
方法应进行处理)。如果用户未登录,它将不会加载请求的路由,并将用户重定向到正确的页面(在您的情况下为登录)。

loginController
应该在你的登录页面被用来处理登录。它应该与
Auth
服务进行交互,并设置用户是否已登录。

loginController

.controller('loginCtrl', [ '$scope', 'Auth', function ($scope, Auth) {  //submit  $scope.login = function () {    // Ask to the server, do your job and THEN set the user    Auth.setUser(user); //Update the state of the user in the app  };}])

从主控制器,您可以侦听用户状态是否发生更改并做出重定向。

.controller('mainCtrl', ['$scope', 'Auth', '$location', function ($scope, Auth, $location) {  $scope.$watch(Auth.isLoggedIn, function (value, oldValue) {    if(!value && oldValue) {      console.log("Disconnect");      $location.path('/login');    }    if(value) {      console.log("Connect");      //Do something when the user is connected    }  }, true);


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/411385.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号