AngularJS Remember me functionality using JWT Auth

Question

I have developed an Spring Web application using Angular JS. For the current project the client side authentication is using Cookies. After learning the advantage JWTs, I rewrote the application Authentication using JWTs(Json Web Token).

My concern is How to handle "Rember Me" Functionality using JWT in AngularJS with out using Cookies funtionality or Laravel support.

If anyone of you experts can share me suggestion or Sample code. It would be really helpful. I tried searching internet and failed to get an sample implementation to refer.

Thanks.

if you can share me some sample piece of code. Will be really helpful. — Naresh Raj
– Naresh Raj, Commented Mar 9, 2016 at 11:48

AbdulRahman Ansari · Accepted Answer · 2016-03-09 12:15:48Z

2

One of the option to store JWT at client side could be window.localStorage which stores data with no expiration date. And after that, with each $http request(in Authentication header) you send this token to the server using Interceptor like following,

angular.module('myApp').factory('authInterceptor', ['$q', function ($q) {
        return {
            request: function (config) {
                config.headers = config.headers || {};
                if (config.headers.skipAuthorization === false) {
                    var token = localStorage.getItem('authenticationToken');
                    if (token != null) {

                        config.headers.Authorization = token;
                    }
                }
                return config;
            },
            response: function (response) {
                if (response.headers("Authorization") != undefined || response.headers("Authorization") != '') {
                    localStorage.setItem('authenticationToken', response.headers("Authorization"));
                }
                return response;
            },
            responseError: function (rejection) {
                if (rejection.status === "401") {
                    localStorage.removeItem('authenticationToken');
                }
                return $q.reject(rejection);
            }
        };
    } ]);

    angular.module('myApp').config(['$httpProvider', function ($httpProvider) {
        $httpProvider.interceptors.push('authInterceptor');
    } ]);

And with each request where you want this token to be sent to the server, set skipAuthorization:false in header as,

$http({
....
headers:{skipAuthorization:false}
}).then(....)

answered Mar 9, 2016 at 12:15

AbdulRahman Ansari

3,0571 gold badge24 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Vahid Najafi Over a year ago

But JWT has expiration in itself. We can store the token in localStorage, But when we send to the server, JWT would check the expiration. Any idea?

AbdulRahman Ansari Over a year ago

Yes, on the server, when we decode the JWT and validate it, it will give an error when the token has expired

Collectives™ on Stack Overflow

AngularJS Remember me functionality using JWT Auth

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related