What is the best method for user authentication within an AngularJS project

[Marcus]

Hi,

I've been hoping to find some good examples and source code for an environment that allows us to keep a database of users and permissions, authenticate a session, and then allow the user who is logged in to perform various transactions -- all from a CRUD with AngularJS.

I expect this would be primarily a server-side solution with either a token or cookie based session authenticator, having an expiration by inactivity if the user does not log off.  Our application needs to be accessed from any point worldwide, having clients with access to their spaces and account data (mainly logistics and order tracking), while internally we would have 2 or 3 levels of access, read/write limits, reports-only, admin, etc.

Could you all indicate ideas of what would be the best approach, what back-ends could do this, and if there are some generic frameworks that we could integrate to a front-end based on AngularJS ?

All ideas and discussions welcomed :-)

Marcus

[Peter Bacon Darwin]

We put some basic authentication into our demo app: https://github.com/angular-app/angular-app.  It is basic for the demo but could easily be extended.

It uses resolves and responseTransforms on the client side and 403 errors on the server side to lock down the data.  We have a simple NodeJS backend.  Take a look at the following:

Server

https://github.com/angular-app/angular-app/blob/master/server/lib/security.js

and

https://github.com/angular-app/angular-app/blob/master/server/server.js#L39

Client

https://github.com/angular-app/angular-app/tree/master/client/src/common/services/authentication

and

https://github.com/angular-app/angular-app/blob/master/client/src/app/admin/projects/admin-projects.js#L16

Pete

Marcus

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en-US.
 
 

[bsr]

Pete,

great demo. Wish I saw bit early as I could model my app based on it.

I am trying to avoid flicker effect (shows curly braces when page loads), and saw a good post by Misko.

http://stackoverflow.com/questions/11972026/delaying-angularjs-route-change-until-model-loaded-to-prevent-flicker/11972028#11972028

I think you are using resolve for the same effect as I see here

https://github.com/angular-app/angular-app/blob/master/client/src/app/projects/projects.js#L7

But I am not sure how you show/hide spinner during the request.

Can you please point out where can I look.

thanks.

[Pawel Kozlowski]

Hi bsr!

So, we've got a dedicated service for this effect:
https://github.com/angular-app/angular-app/blob/master/client/src/common/services/httpRequestTracker.js

and in the template:
https://github.com/angular-app/angular-app/blob/master/client/src/app/header.tpl.html#L18

Currently it has a very simple impl based on $http.pendingRequests
This works OK and is really simple but it is now really fine-grained
and it reacts to _all_ $http calls. This is OK in our case since all
the templates are preloaded but in a longer run a solution based on
$http interceptors would be probably better. But currently request
interceptors are not supported so no luck here.. This is something
we've discussed with the core team and maybe it will get added in the
future.

Anyway, I think it is still better as compared to manually showing /
hiding a spinner on each and every $http call.

Cheers,
Pawel

--
Question? Send a fiddle
(http://jsfiddle.net/pkozlowski_opensource/Q2NpJ/) or a plunk
(http://plnkr.co/)
Need help with jsFiddle? Check this:
http://pkozlowskios.wordpress.com/2012/08/12/using-jsfiddle-with-angularjs/

Looking for UI widget library for AngularJS? Here you go:
http://angular-ui.github.com/

[bsr]

You guys are great help! Thank you.

[Paul B. Hartzog]

That's a handy little learning tool there.  thx!

-Paul