加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

AngularJS:将用户重定向到不同的视图,无论他是否登录

发布时间:2020-12-17 18:03:22 所属栏目:安全 来源:网络整理
导读:目前有一个小应用程序 登录视图’/ login’ 主页查看’/ home’ 登录主页视图’/仪表板’ 当用户登录后导航到主页时,我想向他显示登录主页.我尝试将redirectUrl提供给$routeProvider.如果我返回一个空字符串,它会停留在页面上,如果它返回一个像’/ dashboard
目前有一个小应用程序

>登录视图’/ login’
>主页查看’/ home’
>登录主页视图’/仪表板’

当用户登录后导航到主页时,我想向他显示登录主页.我尝试将redirectUrl提供给$routeProvider.如果我返回一个空字符串,它会停留在页面上,如果它返回一个像’/ dashboard’这样的字符串,那么它会重定向到仪表板.

问题是我无法检查用户是否已登录,在配置中的该功能.因为我不能在那里注入我的UserService.

main.js

var myApp = angular.module('myApp',['ngRoute','ngAnimate']);

myApp.config(['$routeProvider','$locationProvider',function AppConfig($routeProvider,$locationProvider) {

    $routeProvider.when(
        // entry point,the main route of the app
        '/',{
            redirectTo: '/home'
        }
    )
    .when(
        // home page,entrypoint when a user is not logged in.
        '/home',{
            redirectTo: function redirectHome() {
                // need to get the loggedInState here... preferably not on the window :p
                return (window.isLoggedIn) ? "/dashboard" : "";
        },action: 'splash.home'
        }
    )
    .when(
        // specific route to the login popup on the homepage
        '/login',{
            action: 'splash.home.login'
        }
    )
    .when(
        // dashboard after being logged in
        '/dashboard',{
            action: 'base.dashboard'
        }
    )
});

保存用户状态的UserService:

myApp.service('UserService',[
        '$http',function UserService($http) {

            // --- Service Variables. ------------------- //

            // url to the service that returns the logged in user details
            var userServiceUrl = '/user/data/me';

            // Store the current user.
            var User = {
                isLogged: false,apps: [],data: {}
            };

            // --- Service Methods. ------------------- //

            // Return whether the user is logged in
            function isLoggedIn() {
                return User.isLogged;
            }

            // Return the current user
            function getUser(fn) {
                fn = fn || function callback() {};

                if (!User.isLogged) {
                    return fetchUser(fn);
                } else {
                    return fn(User);
                }
            }

            // set the current user
            function setUser(user,loggedIn) {
                loggedIn = loggedIn || false;
                User.isLogged = loggedIn;
                User.data = user;
            }

            // get the user from the server
            function fetchUser(fn) {
                $http.get(userServiceUrl).success(function onGetUserSuccess(data,status,headers,config) {
                    if (data.success) {
                        setUser(data.data,data.success);
                    }

                    if (fn !== undefined) {
                        fn(User);
                    }
                })
                .error(function onGetUserError(data,config) {
                    setUser({},false);
                });
            }

            // --- Return Public API. ------------------- //

            return {
                isLoggedIn: isLoggedIn,getUser: getUser,setUser: setUser
            };

        }
    ]
);

有没有办法从配置进入用户状态?没有它是公开的(我不想让窗口对象上的用户可访问…例如…)

或者我应该从cookie或其他系统获取该信息?

解决方法

通过工厂更改服务并将其注入您的运行块而不是作为依赖项在配置中.

事实上,如果您想使用服务提供商而不是facotry,您必须将您的功能附加到此.如果使用return语句,请使用工厂.

它应该是有效的.

另一种方法是使用httpInterceptor来知道用户是否被记录……这是一种常见的模式.如果你想知道问题,我会详细解释你.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读