Angular Keep session alive Timeout management

Angular Keep session alive Timeout management

Today, We want to share with you Angular Keep session alive Timeout management.
In this post we will show you keep session alive timeout in angularjs example, hear for Handling session timeout in Angular we will give you demo and example for implement.
In this post, we will learn about Angular session timeout and management with an example.

Welcome to the In website! You will Step By Step learn web programming, easy and very fun. This website allmost provides you with a complete web programming tutorial presented in an easy-to-follow manner. Each web programming tutorial has all the practical examples with web programming script and screenshots available.keep session alive timeout in angularjs example

READ :  Angular Toggle Class using ng class

Generally, I want to learn and teach a good practice for this implementation(keep alive with secure) in my angularjs (application) web application.
here, I want to be able to display some greeting required login and logout button (means exit) for logged users in page,
even after the refresh(load ctrl + f5) the whole page details until they user logout or close the browser(mozila,chrome.etc..) and exit.
And to show in a page a “Sign in/Sign up” (login or registration form) button if the user login is not (login)authenticated yet.
so I need to use the same logic(logically) with some state is “private” states of my web application,

Keep session alive after a page refresh in AngularJS

for example:
if any user is not logged check and he accesses this url(route) account/options or any page route then he is forced (access data information) to log in in order to proceed and display info.

READ :  Vuejs Game Programming - fastest click GAME

keep alive timeout – angularjs ng-idle example



‘use strict’;

//define custome parm
.module(‘saleswebapp’, [
[ ‘$rootScope’, ‘$state’, ‘$stateParams’,
function ($rootScope, $state, $stateParams) {
$rootScope.$state = $state;
$rootScope.$stateParams = $stateParams;
.config([‘$stateProvider’, function ($stateProvider) {

now check authenticated or not in angularJS

.state(‘iniciodata’, {
url: ‘/’,
templateUrl: ‘views/page_main.html’,
controller: ‘SimpleMainCtrl’,
.state(‘paneldata’, {
url: ‘/panelpage’,
title: ‘angularjs session data get -‘,
templateUrl: ‘views/page_panel.html’,
controller: ‘SalesPanelCtrl’
.state(‘logindata’, {
url: ‘/loginpage’,
title: ‘keep angularjs session login page -‘,
templateUrl: ‘views/page_login.html’,
controller: ‘SimpleLoginCtrl’


File name : Auth.js

‘use strict’;

.service(‘Auth’, function($http) {
return {
// call function
isLogged: function(cookieORsomethingElse){
//check condition some magic sessionAlive true or false
if (sessionAlive) {
//session active
return true;
} else {
//destroy Cookie here
return false;
login: function(credencial_data) {
//send request with authenticated
return $‘’, credencial_data);
logout: function() {
//api call logout request
registro: function() {
//api call regeter information send request server side

READ :  Apache Exclude Directory Limit Directive using htaccess


file Name : Login.js


‘use strict’;

.controller(‘SimpleLoginCtrl’, function ($scope, Auth, $rootScope, $state) {

$scope.credencial = {sales_servidor: ‘infinityknow’};

$scope.login = function() {
s_user_id: $scope.credencial.sales_username,
s_password: $scope.credencial.sales_password,
s_server: $scope.credencial.sales_servidor
}).success(function(data, status) {
//retrive data information
console.log(data, status);
}).error(function() {
//generate error log
console.log(‘error: you suck’);

Leave a Reply

Your email address will not be published. Required fields are marked *