如果没有经过身份验证的angularjs

时间:2016-11-25 01:39:49

标签: angularjs laravel-5

我第一次使用angularjs,如果没有经过身份验证,我不知道如何重定向登录页面,如果没有经过身份验证的用户无法访问"用户"页面和" menu_utama"在我的州。

app.js

(function() {

'use strict';

angular
    .module('authApp', ['ui.router', 'satellizer'])
    .config(function($stateProvider, $urlRouterProvider, $authProvider) {

        // function to check the authentication //
        var Auth = ["$q", "authService", function ($q, authService) {
            authService.fillAuthData;
            alert("authasdnaksjdhnk");
            if (authService.authentication.isAuth) {
                return $q.when(authService.authentication);
            } else {
                return $q.reject({ authenticated: false });
            }
        }];
        console.log(Auth);


        alert("aweawe");

        // Satellizer configuration that specifies which API
        // route the JWT should be retrieved from
        $authProvider.loginUrl = '/api/authenticate';

        // Redirect to the auth state if any other states
        // are requested other than users
        $urlRouterProvider.otherwise('/auth');

        $stateProvider
            .state('auth', {
                url: '/auth',
                templateUrl: '../views/authView.html',
                controller: 'AuthController as auth'
            })
            .state('users', {
                url: '/users',
                templateUrl: '../views/userView.html',
                controller: 'UserController as user'
            })
            .state('menu_utama', {
                url: '/menu_utama',
                templateUrl: '../views/menuUtama.html',
                controller: 'UserController as user',
                resolve: {
                    auth: Auth
                }
            });

    });

})();

authController.js

(function() {

'use strict';

angular
    .module('authApp')
    .controller('AuthController', AuthController);


function AuthController($auth, $state) {
    var vm = this;
    //console.log(vm);

    vm.login = function() {

        var credentials = {
            email: vm.email,
            password: vm.password
        }

        // Use Satellizer's $auth service to login
        //console.log(credentials);
        $auth.login(credentials).then(function(data) {
          alert("woe");

            // If login is successful, redirect to the users state di file app.js
            $state.go('users', {});

        }, function(error) {
                vm.loginError = true;
                vm.loginErrorText = error.data.error;
          alert("Login gagal");

            //because we returned the $http.get request in the $auth.login
            //promise, we can chain the next promise to the end here
            });




    }

}

})();

UserController.js

(function() {

'use strict';

angular
    .module('authApp')
    .controller('UserController', UserController);

function UserController($http) {

    var vm = this;
    console.log($http);
    vm.users;
    vm.error;


    vm.getUsers = function() {
        alert("a");
        // This request will hit the index method in the AuthenticateController
        // on the Laravel side and will return the list of users
        $http.get('api/authenticate').success(function(users) {
            vm.users = users;
        }).error(function(error) {
            alert("c");
            vm.error = error;
        });
    };

    vm.getCoba = function() {
        alert("woe");
    }

}

})();

1 个答案:

答案 0 :(得分:0)

我不知道你是否找到了解决方案但是......

你可以改变这个:

var Auth = ["$q", "authService", function ($q, authService) {
        authService.fillAuthData;
        alert("authasdnaksjdhnk");
        if (authService.authentication.isAuth) {
            return $q.when(authService.authentication);
        } else {
            return $q.reject({ authenticated: false });
        }
    }];

为此: (我在else语句中添加了$ state.go(' login')而不是$ q.reject(reason))

var Auth = ['$q','$state','authService', function ($q, $state, authService) {
        var deferred = $q.defer();
        authService.fillAuthData;
        if (authService.authentication.isAuth) {
            deferred.resolve();
        } else {
            $state.go('login');
        }
        return deferred.promise;
    }];

由于您已将Auth功能添加为此路由器的解析,因此它只会将未经过身份验证的每个用户重定向到“登录”。当他们尝试导航到您的受限制的控制器时

编辑:您可以将此添加到您的' / user'路由状态以避免未经身份验证的用户访问

resolve: {
   auth: Auth
}