로그 아웃 페이지 AngularJS

로그 아웃 페이지에 문제가 있습니다. 로그 아웃 옵션이 페이지에서 클릭되었을 때 로그인 페이지가로드되어야하고 사용자가 브라우저에서 이전 페이지 화살표를 클릭하려고해도 로그인 페이지 만 표시해야합니다. 나는 해결책을주지 않은 $window.location.reload();과 sessionStorage.clear();을 사용해 보았습니다.로그 아웃 페이지 AngularJS

지금 로그인 페이지를 표시하는 로그 아웃 페이지가 있지만, 다시 페이지를 클릭하면 이전에 로그인 한 사용자의 모든 세부 정보를 볼 수 있습니다.

index.html을 :

<body ng-app="app"> 
<div class=" "> 
    <div ui-view></div> 
</div> 
</body>

<form ng-submit=submit()> 
    <input type="text" name="username" placeholder="Username" ng-model="person.firstName" required /> 
    <input type="password" name="pswd" placeholder="Password" ng-model="person.pswd" required /> 
     <div class="submit"> 
      <input type="submit" value="LOGIN"> 
     </div> 
    </form>

page.html :

<ul> 
<li><a ui-sref="logout">Logout</a></li> 
</ul>

app.js :

var app = angular.module('app', ['ui.bootstrap', 'LocalStorageModule']); 
app.config(function ($stateProvider, $urlRouterProvider) { 
$urlRouterProvider.otherwise('/login'); 
$stateProvider 
      .state('page', { 
      url: '/page/:id', 
      templateUrl: 'page.html' 
       }) 
     .state('login', { 
      url: '/login', 
      templateUrl: 'login.html', 
      controller: 'LoginCtrl' 
     }) 
     .state('tab', { 
      url: '/tab/:id', 
     templateUrl: 'views/tab.html' 
      }) 
    .state('logout', { 
     url: '/logout', 
     templateUrl: 'logout.html', 
     controller: 'LogoutCtrl' 
    }); 
    }); 
app.controller('LogoutCtrl', function ($scope, $http, $location, $state) { 
sessionStorage.clear(); 
$location.path('/login'); 
//this is loading login page, but if back arrow is clicked previous logged in details are present// 
}); 
app.controller('LoginCtrl', function ($scope, $http, $location, $state) { 
    $scope.submit = function() { 
     $http.get("url" + $scope.Name + "&Password=" + $scope.pswd) 
     .success(function (data, status, headers, config) { 
      debugger 
      $scope.tableData = data; 
      console.log(data) 
      if (data == 'Exception') { 
       window.alert('You have entered wrong username or password'); 

      } 
      else $state.go('tab', { id: data.Table[0].UserId }); 
     }) 

} 
});

아래는 코드입니다

간단히 요약하면 : 로그 아웃 후 로그인 페이지가 표시되어야하고 사용자가 뒤 페이지로 이동하려고하면 로그인 페이지 만 표시되어야합니다.

누구든지 도움을 주시면 감사하겠습니다.

출처

2016-07-22 Deborah

에서

를 지우려면? 어떻게 userDetails를 저장하고 있습니까? 쿠키 또는 로컬/세션 저장소에 있습니까? 로그 아웃시 이러한 세부 사항을 어떻게 지우시겠습니까? 경로 (또는 귀하의 경우, 주) 변경 사항을 확인 하시겠습니까? –

@MridulKashyap : page.html은 사용자 기반이며 다른 사용자에 따라 다릅니다. page.html을 표시하기 위해 로그인 세부 정보를 사용하고 사용자 세부 정보를 저장하는 데 아무 것도 사용하지 않았습니다. – Deborah

쿠키 또는 localStorage 또는 SessionStorage라고 가정 해 봅시다. 로그인 정보를 저장해야합니다. 액세스하기 위해 로그인해야하는 페이지에 로그인 세부 정보가 있는지 확인하십시오. loggedIn과 같은 플래그를 설정하거나 단순히 loginId/UserName을 사용할 수도 있습니다. 로그인 페이지가있는 경우 로그인 페이지를 표시합니다. 그렇지 않은 경우 사용자를 로그인 페이지로 리디렉션합니다. 사용자가 로그인했는지 여부를 어떻게 확인할 수 있습니까? 각도의 stateChangeStart 이벤트를 사용할 수 있습니다. loginId/UserName 또는 설정 한 플래그가 있는지 확인하십시오. 그렇다면 계속하십시오. 그렇지 않은 경우 로그인으로 리디렉션하십시오.

로그 아웃하면 저장소에서 이러한 세부 정보를 삭제합니다.

로컬 저장 장치에 사용자 세부 정보를 저장하는 데 도움이되는 Link을 참조하십시오.

출처

2016-07-22 10:52:40

<script src="bower_components/js/angular-local-storage.min.js"></script> 
... 
<script> 
    var myApp = angular.module('myApp', ['LocalStorageModule']);

를 주입 localsotrage 모듈은 로컬 스토리지를 생성하고 메인 컨트롤러의 상태가 로컬 스토리지가있는 경우 다음 페이지를 로그인 돌아가 다른 메인 페이지쪽으로 이동하거나 있는지 확인 할 수 있습니다. 그리고 로그 아웃하면 사용할 수 있습니다

localStorageService.remove (key); 모든 것을 당신이`LogoutCtrl`의 코드를 게시하시기 바랍니다 수 컨트롤러

myApp.controller('MainCtrl', function($scope, localStorageService) { 
var lsKeys = localStorageService.keys();//to show all values 
function submit(key, val) { 
return localStorageService.set(key, val); } 
function removeItem(key) { 
    return localStorageService.remove(key); } 
    });

출처

2016-07-22 10:54:46

늦게 답장을 드려 죄송합니다. 귀하의 제안을 시도했지만 작동하지 않았습니다. 내 로그인 컨트롤러에서 로컬 스토리지 존재를 확인하려면 어떻게해야합니까? 질문에 로그인 컨트롤러가 업데이트되었습니다.한 번 확인하고 여기에 로컬 저장소를 구현하는 방법을 알려주십시오. – Deborah

'MainCtrl'이란 무엇을 의미합니까? LoginCtrl입니까? 또는 내가 tab.html에 가지고있는 컨트롤러 ?? – Deborah

LoginCtrl –

로그 아웃 페이지 AngularJS

답변

관련 문제