Authentication using Angularjs

Question

I am fairly new to AngularJS

I have a resource that I use for user management which is part of a service following this article.

Once sending the login request to the server I am getting a response with a set-cookie as part of the header.

What is the best practice to add this cookie to every request I am sending to the server?

myApp.factory('UserService', ['$resource', function ($resource) {
    var userRes = $resource('http://<MyDomain>/api/v1/user/:param',
        {param: '@param'},
        {
            login: {
                method: 'POST'
            },
            logout: {
                method: 'DELETE'
            }
        });

    var user;
    return {
        signIn: function () {
            user = userRes.login({param: 'login'}, {"email": "SomeName@MyDomain.com", "password": "test1"});
            userRes.get({param: '1'});
        },

userRes.login has set-cookie header in on the response userRes.get does not send the cookie that was just received.

Cheers

@Stewie - I would think so but it does not. I have updated my question and added a code snippet. — special0ne, Dec 26 '13 at 20:06
@Stewie No, I am working on this code from my localhost and making calls to a our Server API. Does it mean that I have to deploy it to see if it actually works? — special0ne, Dec 26 '13 at 21:17
Well, you got yourself a problem of sharing a cookie across different domains. Cookies are, by default, bound to the issuer domain. The bottom line is that Angular does not care and does not need to know about your cookies. Cookies are sent automatically, by the agent (browser), if domains are matching. — Stewie, Dec 26 '13 at 21:25
@Stewie Thanks and it makes sense. So back to my question: The only way I can work develop and use this mechanism is to host Angular on my domain? — special0ne, Dec 26 '13 at 21:42
I think there are some other ways, but they're not easy. So I advise hosting your client app the same top level domain as your API. You can get there quite easily by playing a bit with `hosts` and maybe some nginx. So if your server is hosted at server.com, you can serve your client app locally from client.server.com and your cookies will play along. — Stewie, Dec 26 '13 at 22:01
Not really an answer to your question, but I would recommend checking out this thread about user authentication in AngularJS: http://stackoverflow.com/questions/18325324/angularjs-authentication-restful-api — Timothy E. Johansson, Dec 27 '13 at 01:41

score 1 · Answer 1 · answered Dec 27 '13 at 17:41

Since your API is in a different domain you can't use cookies in this case. We've tried and we failed to put it simple there is no way, not only it doesn't work with CORS but also it doesn't work if you embed an iframe. The iframe trick fails on safaris mostly but it is not reliable.

What we usually do is to return a JWT (Json Web Token) from the API and attach a header then to every API request as Authorization: Bearer JWT.

This JWT can be decoded using a public key from the front end (and it will contain the user profile) and validad with a private key in the backend.

JWT is simple and there are plenty of libraries for every language/technology.

Auth0 is an authentication broker that can validate with any identity provider or custom databases, and it returns JWTs using standars. It provides a clientID that can be used to decode the profile in the front end and a secret to validate the tokens in the backend as well as client side library to do this.

Disclaimer: I work for auth0.

Authentication using Angularjs

1 Answers1