Allow to add custom stores

[rodrigopedra]

What problem does this feature solve?

I implemented sessions in my nuxt app using express-session adapted from the example in nuxt docs

This let me increase security by allowing to store the acess and refresh tokens in the session as express-session stores session data server side and only send a cookie with a session id.

To make it work with auth-module, I had to write a custom scheme so, on page reload, the mounted hook fetches the token from the session and set the axios header correctly.

With this approach I have the localStorage and cookie stores disabled so the client-side application only stores the access token in memory.

If we had the ability to set custom stores I could add a simple store to read and write the token from the session using an async call and would not need to write a custom scheme.

If the idea is accepted I can try to write a PR adding this functionality.

What does the proposed changes look like?

In the nuxt.config.js add an option to add custom stores:

module.exports = {
  // other config
  auth: {
    // other oprtions...
    stores: [new MyCustomStore()]
  }
};

On lib/core/storage.js we would:

1. Extract state, localStorage and Cookie to dedicated classes with this API:
   • get(key, isJson)
   • set(key, value, options)
2. Add a property initiating the default (state, localStorage and cookies) and custom stores.
3. change the setUniversal and getUniversal to iterate through the default and custom stores.

An added benefit of this approach is if a storage method becomes commonly used it can be added to the core with reduced effort.

EDIT: fix nuxt docs link

_{This feature request is available on Nuxt community (#c281)}

[rodrigopedra]

I made a proof of concept fork in this branch:

https://github.com/rodrigopedra/auth-module/tree/custom-store

It is not ideal because the options are stringified before initializing the plugin, so I cannot pass a constructor as an option...

I tried to use a middleware to load the custom store (SessionStorage, in the example), but it won't work on page load...

I didn't want to dig deeper to find a solution before knowing if the idea would be accepted

[rodrigopedra]

After reading about how webpack handle dynamic requires I updated the branch with the approach I wanted to make.

As I want to use a session based store, which would be asynchronous, some breaking ahcnges would be needed.

But please take a look and see if this idea is something that would be acceptable to the project

[ckcollab]

I think #315 is related

I'll repeat what I said there, regarding having a "remember me" type functionality using localStorage vs sessionStorage:

If the "remember me" box is checked on successful login use localStorage, otherwise use sessionStorage. If on page load a localStorage or sessionStorage token is available, use that -- otherwise redirect to login.

Would love to help work on getting this implemented!