第7篇：ui-router登录检查实现权限控制

来源：互联网发布：淘宝左轮吉他怎么样编辑：程序博客网时间：2024/06/14 04:17

做项目时用到了前端登录检查实现用户权限控制，在angularJS插件中用到了ui-router，可以利用本地存储实现对登录状态的监听，实现如下：

1）登录成功，将登录信息写入本地存储：

$.ajax({                type: 'POST',                url: api.login_url,                data: data,                dataType: "json",                success: function(res) {                        sessionStorage.setItem("id", res.data.name_id);                }})

2）路由跳转实现对登录状态的监听：

从sessionStorage中获取登录信息判断是否登录

angular.module('app', ['ui.router']).run(['$rootScope', '$state','$location', function($rootScope, $state,$location,$scope,$http) {    $rootScope.$on('$stateChangeStart',        function(event, toState, toParams, unfoundState, fromState, fromParams) {            if(!sessionStorage.getItem("id")){                event.preventDefault(); //阻止路由跳转                $state.go("login");            };        }    );}]);

3）登出清除本地存储：

$http.get(api.logout_url).success(function(res){            if(res.code == 0){                sessionStorage.clear();                $state.go('login');            }});

阅读全文

0 0