Trouble loading ember-simple-auth with ember-cli

Question

I am trying to verify that the session object is available in my ember app. I've used ember-cli to generate the app and I've followed the ember-auth installation instructions. The instructions say "add the Ember CLI Addon to your project and Ember Simple Auth will setup itself".

npm install --save-dev ember-cli-simple-auth

Unfortunately when I am in my controller there is no session object.

I have also tried loading the initalizer in my app.js but I have yet to figure out how to access App.session from my controller. I think ember-cli has namespaced things differently.

//app.js
import Ember from 'ember';
import Resolver from 'ember/resolver';
import loadInitializers from 'ember/load-initializers';

Ember.MODEL_FACTORY_INJECTIONS = true;

var App = Ember.Application.extend({
  modulePrefix: 'ember-test', // TODO: loaded via config
  Resolver: Resolver
});

loadInitializers(App, 'ember-test');
loadInitializers(App, 'simple-auth');

export default App;

//about.js
import Ember from 'ember';

export default Ember.Controller.extend({
    derp: 'derpvalue',
    actions: {
        test : function(){
            console.log("In test");
            console.log(session);
            console.log(App.session);
            debugger;
        }
    }
});

You should be able to get the session from the controller just by this.get('session'); — Altrim
Yes this worked once I followed the instructions provided by @jamie-burkart. Thanks! — MikeV

Jamie Burkart Jamie Burkart · Accepted Answer · 2014-07-09T04:08:24

Here are recent ember-cli-simple-auth setup instructions from the author

You shouldn't have to manually set up an initializer. And I can verify that the author's instructions should give you this.session in your controller.

Copying the author's instructions:

Installing Ember Simple Auth in an ember-cli project is really easy now. All you have to do is install the ember-cli addon from npm:

npm install --save-dev ember-cli-simple-auth

This will install Ember Simple Auth’s AMD distribution into the project, register the initializer so Ember Simple Auth automatically sets itself up and add itself as a dependency to the project’s package.json.

You can add a login route and login/logout links to verify it all actually works:

// app/router.js
…
Router.map(function() {
  this.route('login');
});
…

// app/templates/application.hbs
…
{{#if session.isAuthenticated}}
  <a {{ action 'invalidateSession' }}>Logout</a>
{{else}}
  {{#link-to 'login'}}Login{{/link-to}}
{{/if}}
…

Also implement the ApplicationRouteMixin in the project’s application route:

// app/routes/application.js
import Ember from 'ember';
import ApplicationRouteMixin from 'simple-auth/mixins/application-route-mixin';

export default Ember.Route.extend(ApplicationRouteMixin);

Setting up authentication

To actually give the user the option to login, we need to add an authentication package for Ember Simple Auth. Let’s assume you have an OAuth 2.0 compatible server running at http://localhost:3000. To use that, install the OAuth 2.0 extension library which again is as easy as installing the package from npm:

npm install --save-dev ember-cli-simple-auth-oauth2

Like the ember-cli-simple-auth package this will setup itself so that nothing else has to be done in order to use the OAuth 2.0 functionality.

The OAuth 2.0 authentication mechanism needs a login form, so let’s create that:

// app/templates/login.hbs
<form {{action 'authenticate' on='submit'}}>
  <label for="identification">Login</label>
  {{input id='identification' placeholder='Enter Login' value=identification}}
  <label for="password">Password</label>
  {{input id='password' placeholder='Enter Password' type='password' value=password}}
  <button type="submit">Login</button>
</form>

Then implement the LoginControllerMixin in the login controller and make that use the OAuth 2.0 authenticator to perform the actual authentication:

// app/controllers/login.js
import Ember from 'ember';
import LoginControllerMixin from 'simple-auth/mixins/login-controller-mixin';

export default Ember.Controller.extend(LoginControllerMixin, {
  authenticator: 'simple-auth-authenticator:oauth2-password-grant'
});

As the OAuth 2.0 authenticator would by default use the same domain and port to send the authentication requests to that the Ember.js is loaded from you need to configure it to use http://localhost:3000 instead:

// config/environment.js
if (environment === 'development') {
  …
  ENV['simple-auth-oauth2'] = {
    serverTokenEndpoint: 'http://localhost:3000/token'
  }
  …

As ember-cli adds all configuration to the global ENV variable (e.g. in this case MyAuthAppENV) which Ember Simple Auth cannot use as it doesn’t know it’s name, you need to copy that to window.ENV so Ember Simple Auth can use it:

// app/initializers/simple-auth-config.js
export default {
  name:       'simple-auth-config',
  before:     'simple-auth',
  initialize: function() {
    window.ENV = MyAuthAppENV;
  }
};

Ember Simple Auth is awesome!

Trouble loading ember-simple-auth with ember-cli

1 Answers