SPA's w/ Angular and cookie based authentication

Question

The web framework I am using has cookie (or token) based authentication. When a user registers a postback occurs and the server places an authentication token inside of a cookie that attaches itself to the users browser. All subsequent requests include this token and are therefore secure in that sense.

My question: Do I have to do a full-page postback refresh after a user registers to get the auth-token placed on the users browser? Or could I simply have the server return an auth token (via ajax) on successful user registration (done via ajax as well)? I'd prefer the latter if possible.

thanks.

you answered yourself. Just return the auth token on successful registration and create an interceptor which change the user state on the client side. — Ilan Frumer
– Ilan Frumer, Commented Feb 17, 2014 at 11:03

Valerio · Accepted Answer · 2014-02-18 09:43:24Z

1

If your framework gives back a token, you just have to add it to the headers for all subsequent requests.

Making this permanent requires additional code (ex: writing it in localStorage)

I don't know the Header that your framework wants :) but i can assume your login controller might look like this:

angular.module('coolModule', [])
.controller('CoolController', function ($scope, $http) {

  $scope.loginButton = function () {

    // assuming username and password are in the scope
    $http.post('/api/login', { $scope.username, $scope.password })
    .success(function (data, status, headers, config) {
      $http.defaults.headers.common['X-My-Token'] = data.token;
    });

  }
})

Subsequent requests will have a X-My-Token header, that usually works for identification

EDIT: Yes, setting a cookie (in javascript or from a server response) will make it get sent at every request (like all the cookies in this internet world)
If you are developing also the backend would be much more elegant make the backend send a cookie to the client, and not writing it manually as you commented ^_^

A cookie has some pros: like an expiration date, and some cons: reading it from javascript is not really elegant (usually requires a wrapper lib, angular-cookie, for browser compatibility).

In both cases when a cookie expires or the token is invalid (so you will receive a 40x response) you will have to handle the failure using some angular.js code

edited Feb 18, 2014 at 9:43

answered Feb 17, 2014 at 21:41

Valerio

2,6004 gold badges26 silver badges34 bronze badges

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

2 Comments

The Internet Over a year ago

Coltre, if I set it as a cookie won't it be included in every request? Couldn't I just use the setCookie('sess', token) function, after retrieving it via post? $.post('/register?user=' + user + '&pass=' + pass, function(token) { setCookie('sess', token); });

The Internet Over a year ago

Would the session timeout's then work the same? Or would I have to catch 404's when the session expires and then logout the user via javascript? I guess, how do you detect an expired token?

Collectives™ on Stack Overflow

SPA's w/ Angular and cookie based authentication

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