Discussion on: Secure authentication in Nuxt SPA with Laravel as back-end

[orenlande]

Hey, Small suggestion to update your tutorial:
I've been stumbled upon the following issue (pretty common if we judge by comments) - once you refresh your SPA, you're being kicked out to main page.

After short research online and experimenting myself, I think the most elegant solution keep the login persist upon refresh would be using the nuxt.js plugins option:

1. at nuxt.config.js:
   add to plugins array the following:
   plugins: [
   { ssr: false, src: '~plugins/app-bootstrap' },
   ...
   ]

2. at root/plugins folder, add the file "app-bootstrap.js" and put inside the following:
   import cookies from 'js-cookie';

export default ({ store }) => {

const token = cookies.get('x-access-token');

if(token) {
    store.dispatch('setToken', {token});
}

}

this way, we ensure we are using the same functions and workflow as the rest of the application.

[StefanT123]

I don't think this is the best solution, but it might work in your case. I've already addressed how to handle this in the comments, here's link. I think I'll do part 2 and 3 of this post, where in one I will go through the issue for the token on page reload, and the other will be for authenticating with PKCE (this may be a separate post, I haven't decided yet).

[orenlande]

Imho - if we can resolve this without extra plugins and libs, it would be the best - reduce the overall package size and understand better what's going on.

What would be the advantages of including this plugin? I'm curious if I'm missing something on my solution.

[StefanT123]

It's not a third-party plugin, it's just a custom nuxt plugin that we going to create. Nuxt plugin is just some function that will be called before the instantiation of the root app, nothing more.