I'm playing around with writing a pure Ember.js app on top of Rails 4 and I'm puzzled how user management is handled. My original idea was to use pure server-rendered templates (ERB) to do the user registration and login via Devise, and then the rest of the app would use the Ember framework.
The problem with that is that Ember wants to take over the <body> tag and control the entire viewport. In this way I can't pick and choose which aspects of the app should use server-rendered Erb templates and which should live in the Ember logic.
I see plenty of examples of how to deal with a user that's already logged-in and ember-auth looks interesting to facilitate authentication-aware controllers, but I've seen no tutorials or suggestions on allowing the full user signup experience to take place in the Ember app.
Am I missing something, either from a technical perspective where I just haven't found the right code or from a architectural perspective where I shouldn't be doing it this way?
This is with ember-rails (0.12.0 w/1.0.0.rc3.3 ember-source), Rails 4.0.0.rc1, and Devise (rails4 branch).
ember-auth
dev here.
You don't actually need any special treatment for user sign up. Treat user sign up as you would for another model, in the sense that creating a user
model will not require authentication. (Editing it or deleting it should require authentication though.)
Your implementation might look like:
App.User = DS.Model.extend
email: DS.attr 'string'
password: DS.attr 'string'
App.UsersNewRoute = Em.Route.extend
model: ->
App.User.createRecord()
App.UsersNewController = Em.ObjectController.extend
create: ->
@store.commit()
Error-checking, template code, etc, skipped for brevity.
This is here for reference to what worked based off of @heartsentwined's answer since pasting in comments doesn't work very well. See the comments for more info. Since my api returns the user json I just pass in the format its expecting.
didCreate: function() {
var user = App.Auth.get('_response').response.user;
var auth = {auth_token: user.auth_token, id: user.id};
App.Auth.get('_response').canonicalize(auth);
App.Auth.trigger('signInSuccess');
}
UPDATE:
I switched to ember-model and now do this in the same place that I call model.save()
(the submit
action of SignupController).
var model = this.get('model');
model.on('didCreateRecord', function() {
var user = this.data;
var auth = {auth_token: user.auth_token, user_id: user.id, remember_token: user.remember_token};
App.Auth.get('_response').canonicalize(auth);
App.Auth.trigger('signInSuccess');
});
model.save();
The solutions above ALMOST but not quite worked for me. Here is what did work:
didCreate: function() {
var user = App.Auth.get('_response').response.user;
App.Auth.signIn({
data: {
'email': user.email,
'password': this.get('password'),
'remember': true
}
});
}
App.Auth.signIn is used in the documentation explicitly: http://ember-auth.herokuapp.com/docs
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With