How to persist current logged in user details across page reload in EmberJS?

Question

I use ember-simple-auth to manage authentication in my ember app.

The addon provides a session library which apparently stores the response from API server when I login using token authentication. The response contains typical oAuth2 response like access token, refresh token, expiry time etc. The library provides a boolean variable which tells if the user is authenticated or not currently.

I use an instance initializer which uses this boolean variable to fetch and store current user details. The code looks like this:

// app/instance-initializers/current-user.js
import Session from "ember-simple-auth/services/session";
export default {
  name: "current-user",
  before: "ember-simple-auth",
  initialize: function(container) {
    Session.reopen({
      setCurrentUser: function() {
        if (this.get('isAuthenticated')) {
          container.lookup("service:store").find('user', 'me').then((user) => {
            this.set('currentUser', user);
          });
        }
      }.observes('isAuthenticated')
    });
  }
};

This works fine when I login and navigate across different routes in the app. The problem comes when I reload some page. The current user details somehow get erased and this setCurrentUser is also called but it gets called after all the hooks in the current route are called. So in hooks like model, beforeModel, setupController etc. session.currentUser is not set and it is set only after all these hooks are called.

How to avoid this? How to make the current user details available in route hooks on page reload?

Answer 1

New Answer

Completely ignore the below answer for now. Try to change your initializer to only fire after ember-simple-auth, like below:

// app/instance-initializers/current-user.js
import Session from "ember-simple-auth/services/session";
export default {
  name: "current-user",
  after: "ember-simple-auth",

Have a look at this part of the docs, some more information there regarding the initializer, and the let me know if you are using the following route mixin:

import ApplicationRouteMixin from 'ember-simple-auth/mixins/application-route-mixin';

Previous Answer

I recommend you read through the session stores in the readme and try switch between session stores temporarily to see if that fixes your problem. Otherwise implement your own custom session store with local storage to make sure the persist & restore hooks work like expected.

The object you'll extend in that case looks like this(copied from readme):

// app/session-stores/application.js
import Base from 'ember-simple-auth/session-stores/base';

export default Base.extend({
  persist() {
    …
  },

  restore() {
    …
  }
});