How do I handle Token Authentication with AngularJS and Restangular? How do I handle Token Authentication with AngularJS and Restangular? angularjs angularjs

How do I handle Token Authentication with AngularJS and Restangular?


  1. You could put it in localStorage (always kept) or sessionStorage (cleared when browser is closed). Cookies are technically also a possibility, but don't fit your use case that well (your back end checks a separate header and not a cookie)

  2. I guess there are many ways to skin a cat.

  3. Always depend on server-side checks. Client-side checks might offer some increased usability, but you can never depend on them. If you have a lot of buttons that result in going to a login screen, it will be faster if you keep the client-side check. If this is more the exception than the rule, you could instead redirect to the login page when you get a 401 Unauthorized when calling your back end.


Here is an example of how you can manage your token:

/* global angular */

'use strict';(function() {    angular.module('app').factory('authToken', ['$window', function($window) {        var storage = $window.localStorage;        var cachedToken;        var userToken = 'userToken';        var authToken = {            setToken: function(token) {                cachedToken = token;                storage.setItem(userToken, token);            },            getToken: function() {                if (!cachedToken) {                    cachedToken = storage.getItem(userToken);                }                return cachedToken;            },            isAuthenticated: function() {                return !!authToken.getToken();            },            removeToken: function() {                cachedToken = null;                storage.removeItem(userToken);            }        };        return authToken;    }]);})();

As you can see I use "$window.localStorage" to store my token. Like "Peter Herroelen" said in hist post.