I am experiencing a problem with the logout page. When the logout option is clicked from a page, the login page should be loaded and even if the user attempts to click the back arrow in the browser, only the login page should be shown. I have attempted using $window.location.reload(); and sessionStorage.clear();, but these solutions did not work.
Currently, my logout page displays the login page, however, when the back button is clicked, all the details of the previously logged-in user are still visible. Here is the code:
index.html:
<body ng-app="app">
<div class=" ">
<div ui-view></div>
</div>
</body>
login.html:
<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 loads the login page, but the previous logged-in details remain if the back arrow is clicked//
});
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 });
})
}
});
In summary, what I require is that after logging out, the login page should be displayed and if the user tries to navigate back, only the login page should be visible. Any assistance would be greatly appreciated.