Ember.js authentication

Question

I would like to implement authentication using ember.js. So, when the application starts before the router processes the requested URL, I want to check the status of the user. If the user is not authenticated, I want to save the requested URL and redirect to a specific URL (/ login). I tried to implement this Ember.Route overload, but I don't think this is good practice. For example, if I do:

var AuthRoute = Ember.Route.extend({ redirect: function() { var controller = App.userController; if (!controller.get("userAuth")) { controller.set("lastFilter", this.routeName); this.transitionTo("index"); } } } }); 

If the URL is "/ admin / foobar", the admin route will be redirected instead of foobar.

Is it possible to transfer the redirection before starting the router?

Answer 1

I'm using something like this

 Ember.SecureRoute = Ember.Route.extend({ role: null, redirect: function (model) { if (!this.controllerFor('login').get('authenticated')) { this._routeToLogin(); } var role = this.get('role'); if (!Ember.isEmpty(role) && !this.controllerFor('login').hasRole(role)) { this._routeToLogin(); } }, _routeToLogin: function () { var infos = this.get('router.router.currentHandlerInfos'); this.router.router.didTransition(infos); var routeName = !this.router.router.hasRoute(this.routeName) ? this.routeName + '.index' : this.routeName; var params = infos.filter(function (item, index, enumerable) { return item.context !== undefined; }).map(function (item) { return item.context; }) var url = Ember.Router.prototype.generate.apply(this.router, params.insertAt(0, routeName)) this.router.location.setURL(url); this.transitionTo("login"); } }); 

in your loginController you can use your browser history to return to the original route

 APP.LoginController = Ember.Controller.extend({ //other stuff authenticate: function (username, password) { //do the authentication history.go(-1); } }); 

Answer 2

As I do this, I pass an authenticated user with my data. and I have an initConfiguration function inside my main application

so inside the index file (in this case I'm showing you jade) I have this:

 // initialize ember settings script(type='text/javascript') App.initConfiguration('!{currentUser}') 

and inside my application file I have (coffeescript here)

 window.App = Ember.Application.create currentUser: null initConfiguration: (currentUser) -> if currentUser? and currentUser.length > 0 @set 'currentUser', currentUser 

If you are using ember data, you need to change the application file to

 window.App = Ember.Application.create currentUser: null tempCurrentUser: null initConfiguration: (currentUser) -> ## # set the tempCurrentUser to the currentUser passed in, this is then # set in the ApplicationRoute to the App.currentUser # and destroyed (this is necessary as the ember store is not initialzed yet # and just setting it here will result in an error) if currentUser? and currentUser.length > 0 @set 'tempCurrentUser', currentUser 

and then inside your application route do the following

 App.ApplicationRoute = Ember.Route.extend setupController: (controller) -> if App.tempCurrentUser? App.setCurrentUser(App.tempCurrentUser) 

Answer 3

Ember has a fantastic prevention and reauthentication guide: http://emberjs.com/guides/routing/preventing-and-retrying-transitions/

A simple way to make transitions based on whether the user is registered:

 App.ApplicationRoute = Ember.Route.extend({ willTransition: function () { var session = this.controllerFor('session'); if (!session.get('authed')) { this.transitionTo('login'); } } }); 

The above example assumes that you have some kind of session controller or object that manages active sessions. This works because ApplicationRoute is the very first route that gets in every time you enter your application (from any URL).