>

angularjs와 angularjs ui-route를 사용하고 있습니다. 로그인 페이지를 만들고 있는데 사용자가 로그인하지 않고 내부 페이지로 이동하지 못하게하고 싶습니다. 비슷한 질문이 있지만 정보가 부족합니다. 또한 로그인에 성공하면 세션을 저장하고 싶습니다.

여기서는 나의 homeroute.js입니다

   'use strict';
var application = angular.module('App', ['ui.router']);
    application.config(['$stateProvider', '$urlRouterProvider',
    function($stateProvider, $urlRouterProvider) {
        // For unmatched routes
        $urlRouterProvider.otherwise('/');
        // Application routes
        $stateProvider
            .state('login', {
                url: '/login',
                templateUrl: './views/login.html',
                controller: 'logincontroller'
            })
            .state('/', {
                url: '/',
                templateUrl: './views/home.html'
            })
             .state('customerHome', {
                url: '/customerHome',
                templateUrl: './views/customerHomepage.html'
            })
            .state('signup', {
                url: '/signup',
                templateUrl: './views/register.html',
                controller: 'registercontroller' 
            });
    }
]);
        application.run(function($rootScope, $location) {
        var customerHome = ['/customerHome'];
        $rootScope.$on('$routeLogin', function() {
            if(customerHome.indexOf($location.path()) != -1 && sessionStorage.getItem('userLogin')) {
                $location.path('/login');
            }
        });
    });
    application.controller('registercontroller', ['$scope', '$http', function($scope, $http) {
                $scope.formData = {};
                $scope.userform = "";
                $scope.register = function() {
                    $http({
                        method: 'POST',
                        url: './services/loginsubmit.php',
                        data: $scope.formData
                    }).then(function(response) {
                        console.log(response);
                        if(response.data.empty == true) {
                            $scope.userform = "Please fill the form.";
                        } else if(response.data.emailError == true) {
                            $scope.userform = "Invalid Email.";
                        } else if(response.data.validation == true) {
                            $scope.userform = "Username already exists.";   
                        } else if(response.data.validateUsername == true) {
                            $scope.userform = "Username must be more than 5 characters.";
                        } else if(response.data.validatePassword == true) {
                            $scope.userform = "Password must be more than 5 characters.";
                        } else if(response.data.registerSuccess == false) {
                            $scope.userform = "Registration Successful.";
                            $scope.formData = {};
                        } else if(response.data.registerSuccess == true) {
                            $scope.userform = "Registration Failed";
                        }
                    });
                }
            }]);
    application.controller('logincontroller', ['$scope', '$http', '$location', '$rootScope', function($scope, $http, $location, $rootScope) {
        $scope.loginData = {};
        $scope.loginUser = "";
        $scope.login = function() {
            $http({
                method: 'POST',
                url: './services/loginservice.php',
                data: $scope.loginData
            }).then(function(response) {
                console.log(response);
                if(response.data.UsernameLogin == true) {
                    $scope.loginUser = "Invalid username or password.";
                } else {
                    sessionStorage.setItem('userLogin', response.data.usernameSession); 
                    $location.path('/customerHome');        
                }
            });
        }
    }]);

Here is my loginservice.php

   <?php 
    include '../connection/connect.php';
    $formLogin = json_decode(file_get_contents("php://input"));
    $data = array();
    $check_UsernameLogin = false;
    $username = $formLogin->username;
    $password = $formLogin->password;
    $login = mysqli_query($conn, "SELECT username FROM customer WHERE username='$username' AND customer_password='$password'");
    $check_username = mysqli_num_rows($login);
    if($check_username == 0) {
        $check_UsernameLogin = true;
    } else {
        $check_UsernameLogin = false;
    }
    $data["UsernameLogin"] = $check_UsernameLogin;
    $data["usernameSession"] = $login;
    echo json_encode($data);
 ?>

내 login.html입니다

   <!-- Navigation Bar -->
    <nav class="navbar navbar-inverse navbar-fixed-top">
      <div class="container-fluid">
        <div class="navbar-header">
          <a class="navbar-brand" href="#!/">Hostelry Service</a>
        </div>
        <ul class="nav navbar-nav">
          <li><a href="#!/">Home</a></li>
          <li><a href="#">Hostelries</a></li>
          <li><a href="#">Compare</a></li>
          <li><a href="#">About Us</a></li>
          <li><a href="#">Contact</a></li>
        </ul>
        <ul class="nav navbar-nav navbar-right">
          <li><a href="#!signup"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
          <li><a href="#!login"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
        </ul>
      </div>
    </nav>
<div class="row"  style="padding-top: 100px;">
  <div class="col-md-4 col-md-offset-4">
    <div class="panel panel-primary">
      <div class="panel-heading" style="padding-left: 190px;">Log in</div>
      <div class="panel-body">
        <form method="POST" ng-submit="login()">
          <input class="form-control" type="text" ng-model="loginData.username" placeholder="Username"><br>
          <input class="form-control" type="password" ng-model="loginData.password" placeholder="Password"><br>
          <button type="submit" class="btn btn-primary btn-block">Submit</button><br>
          <p class="alert alert-success" ng-show="loginUser">{{loginUser}}</p>
        </form>
      </div>
  </div>
</div>

내 customerHomepage.html은

   <!-- Navigation Bar -->
    <nav class="navbar navbar-inverse navbar-fixed-top">
      <div class="container-fluid">
        <div class="navbar-header">
          <a class="navbar-brand" href="#!/">Hostelry Service</a>
        </div>
        <ul class="nav navbar-nav">
          <li><a href="#!/">Home</a></li>
          <li><a href="#">Hostelries</a></li>
          <li><a href="#">Compare</a></li>
          <li><a href="#">About Us</a></li>
          <li><a href="#">Contact</a></li>
        </ul>
        <ul class="nav navbar-nav navbar-right">
          <li><a href="#!signup"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
          <li><a href="#!login"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
        </ul>
      </div>
    </nav>
<div class="row"  style="padding-top: 100px;">
  <div class="col-md-4 col-md-offset-4">
    <div class="panel panel-primary">
      <div class="panel-heading" style="padding-left: 190px;">Log in</div>
      <div class="panel-body">
        <form method="POST" ng-submit="login()">
          <input class="form-control" type="text" ng-model="loginData.username" placeholder="Username"><br>
          <input class="form-control" type="password" ng-model="loginData.password" placeholder="Password"><br>
          <button type="submit" class="btn btn-primary btn-block">Submit</button><br>
          <p class="alert alert-success" ng-show="loginUser">{{loginUser}}</p>
        </form>
      </div>
  </div>
</div>

angularjs에서 .run () 및 $rootScope를 처음 사용합니다.

  • 답변 # 1

    application.run ()에서 사용자가 로그인했는지 여부에 따라 상태 변경을 확인하고 상태 변경을 방지하거나 허용해야합니다. 예를 들면 다음과 같습니다.

           $rootScope.$on('$stateChangeStart', function (event, toState){
                if(toState.name === 'login'){
                    return;
                }
                else if (!session.getAccessToken()) {    
                    $state.go('login');
                    event.preventDefault();                 
                }
                else{
                    return;
                }
            });
    
    

    여기서 세션은 서비스입니다. 세션 저장소에 액세스 토큰이 있는지 확인합니다. 찾을 수없는 경우 사용자가 내부 페이지로 이동하지 못하게합니다.

    이제 로그인 페이지에서 로그인 API를 호출 한 후 응답 토큰 형태의 액세스 토큰을 세션 저장소에 저장하고 상태를 원하는 홈 페이지로 변경하십시오.

    참고 : 액세스 토큰을 저장하기 위해 세션 저장소 대신 로컬 저장소를 사용하는 것이 좋습니다.

  • 답변 # 2

    PHP로이를 수행하려면 사용자 자격 증명 (또는 로그인 상태)을 $_SESSION 에 저장해야합니다.  파일을 제공 할 때마다 확인하십시오. 당신은 당신의 파일 php 를 제공해야  호환성을위한 확장 프로그램.

    <올>

    양식 제출시 자신을 호출하도록 index.php를 설정하십시오.

    사용자 이름과 비밀번호로 호출하면 인증하고 $_SESSION['authenticated'] 를 설정하십시오   true 에 변수  정식 로그인의 경우

    지금이 $_SESSION 를 확인하십시오  템플릿을 제공 할 때마다

     <?PHP 
        if ($_SESSION['authenticated'] == false)
            die('Permission denied');
      ?>
    
    

    <시간>

    그러나 작동하지만 jwt와 같은 방법을 통해이를 처리하는 새롭고 안전한 방법이 많이 있습니다.

  • 이전 AppleScript를 사용하여 프로그램 실행 시간을 설정하는 방법
  • 다음 벡터의 요소 별 돌연변이 *는 Matlab의 행렬을 제공합니다