关闭一个emberfire / torii会话并注销会抛出permission_denied错误

Question

I am using EmberFire with the Torii for sessions. I am getting an odd issue when I log a user out, and the following errors are thrown in the console:

firebase.js:186 Error: permission_denied at /folders/-KKvrk3K_JOHxQWgR1km: Client doesn't have permission to access the desired data.(…)(anonymous function) @ firebase.js:186(anonymous function) @ firebase.js:380Tb @ firebase.js:276uc @ firebase.js:263vc @ firebase.js:262(anonymous function) @ firebase.js:449vh @ firebase.js:434g.wd @ firebase.js:425Ye.wd @ firebase.js:328(anonymous function) @ firebase.js:326vd @ firebase.js:279La.onmessage @ firebase.js:278
firebase.js:186 Error: permission_denied at /folders/-KLFp3zh5QUB7KvMF0HZ: Client doesn't have permission to access the desired data.(…)(anonymous function) @ firebase.js:186(anonymous function) @ firebase.js:380Tb @ firebase.js:276uc @ firebase.js:263vc @ firebase.js:262(anonymous function) @ firebase.js:449vh @ firebase.js:434g.wd @ firebase.js:425Ye.wd @ firebase.js:328(anonymous function) @ firebase.js:326vd @ firebase.js:279La.onmessage @ firebase.js:278
firebase.js:186 Error: permission_denied at /externalApps/-KLF_wKXtzm38EHtuQ_C: Client doesn't have permission to access the desired data.(…)(anonymous function) @ firebase.js:186(anonymous function) @ firebase.js:380Tb @ firebase.js:276uc @ firebase.js:263vc @ firebase.js:262(anonymous function) @ firebase.js:449vh @ firebase.js:434g.wd @ firebase.js:425Ye.wd @ firebase.js:328(anonymous function) @ firebase.js:326vd @ firebase.js:279La.onmessage @ firebase.js:278
firebase.js:186 Error: permission_denied at /users/-KLKUOZRBCIeCj44WMe7: Client doesn't have permission to access the desired data.(…)(anonymous function) @ firebase.js:186(anonymous function) @ firebase.js:380Tb @ firebase.js:276uc @ firebase.js:263vc @ firebase.js:262(anonymous function) @ firebase.js:449vh @ firebase.js:434g.wd @ firebase.js:425Ye.wd @ firebase.js:328(anonymous function) @ firebase.js:326vd @ firebase.js:279La.onmessage @ firebase.js:278
firebase.js:186 Error: permission_denied at /externalApps/-KLIyXUwTSrkCIL4rz7U: Client doesn't have permission to access the desired data.

There are two places where I login a user:

At Registration

register(data) {
  return this.get('firebaseApp')
    .auth()
    .createUserWithEmailAndPassword(data.email, data.password)
    .then((registeredUser) => {
      const newUser = this.store.createRecord('user', {
        uid: registeredUser.uid,
        firstName: data.firstName,
        lastName: data.lastName,
        email: registeredUser.email
      })
      return newUser.save();
    })
    .then((savedUser) => {
      return this.get('session').fetch().then(() => {
        return savedUser;
      });
    })
    .then((savedUser) => {
      this.replaceWith('dashboard');
    });
}

For an already registered user

login(email, password) {
  const controller = this.controllerFor('index');
  this.get('session').open('firebase', {
    provider: 'password',
    email: email,
    password: password
  })
  .then((/* response */) => {
    controller.set('loginError', undefined);
    this.replaceWith('dashboard');
  })
  .catch((error) => {
    controller.set('loginError', error);
  });
}

And here is the action that logs the user out:

logout() {
  this.get('session').close().then(() => {
    this.store.unloadAll();
    this.replaceWith('index');
  });
}

Answer 1

I had this very same issue about a week ago. It seems that the way Emberfire implemented there Ember Data extensions do not allow for the use of store.unloadAll()

I opened an issue here but haven't seen any responses from the team.

You can easily work around this issue by unloading the user directly from the store. As long as you use the store.unloadRecord(<specificRecord>) or <specificRecord.unload() then everything works fine.

In your case you could save the user record when logging in or registering a new user and then unload that record on logout. If all of those actions aren't in the same controller, you would probably have to create a service to handle that interaction.

Hope that helps

Answer 2

After 2 years the error still exists :) So really quick and dirty solution to avoid the errors in the console. Regarding to this comment the "emberfire never stops listening to any record after its loaded". So to "disconnect" from the Firebase server we can simply open (I mean full app[=page] reload) the page without any emberdata elements. So my solution (whatever palace in the app):

actions: {
    signOut: function () {            
        window.location.replace('/login');
    }
}

On login route:

beforeModel(){
    if (this.get('session').get('isAuthenticated')) {            
        this.get('session').close()
    }
}

Some information about my setup:

DEBUG: Ember : 3.1.3

DEBUG: Ember Data : 3.1.1

DEBUG: Firebase : 3.9.0

DEBUG: EmberFire : 2.0.10

DEBUG: jQuery : 3.3.1

Hope this will help to avoid errors on the page. Maybe bad idea if app is really big.

Answer 3

The key to @Paul's answer is:

actions: {
  signOut: function () {            
    window.location.replace('/login');
  }
}

If you're using Emberfire and Torii provider, then you'll need to refetch the session to be able to close it. This is what I'm doing in my sign-out route...

export default Route.extend({
  session: inject(),
  redirect() {
    get(this, 'session')
      .fetch()
      .then(async () => {
        await get(this, 'session').close();
        this.transitionTo('/sign-in');
      });
  },
  setupController(controller, model) {
    this._super(controller, model);
  }
});

I setup a controller in this route so that I can show a loading spinner while the app is fetching the session.