Need help with Nuxt.js and Nuxt-Auth
New here? Learn about Bountify and follow @bountify to get notified of new bounties! x

Hi there.

I'd need help with Nuxt.js

I'm learning Nuxt and I've created the authentication with Nuxt-Auth and Laravel.

The authentication works and when I'm logged in, I can see the user name in the menu:

<li v-if="$auth.loggedIn" class="bold">{{ $auth.user.name }}</li>

But once the session expires, If I click on a different link in the menu, the link with the user name remains in the menu, up to when I hit refresh.

I have this getters:

export const getters = {
  authenticated(state) {
    return state.auth.loggedIn
  },

  user(state) {
    return state.auth.user
  },
};

and I tried v-if="authenticated" and v-if="$auth.user" instead of v-if="$auth.loggedIn" but it doesn't change anything.

Help anyone ?

Crowdsource coding tasks.

1 Solution


Possible Solution

Hello,

I don't have a full environment (back-end code) to reproduce the issue, but from what I was able to gather from this thread, you could create custom auth reset functionality in plugins/axios.js. Something like this.

The next step

Create a file middleware/authenticated.js

Put this code in the middleware.

Set

router: {
middleware: [
"authenticated"
]
},

in nuxt.config.js. (router entry already exists, just modify it to include authenticated middleware)

This will make our middleware run before every route and check if the user is still logged in (valid session).

Thank you,
Vladimir

Hi Vladimir. Thanks for the help first and foremost. It almost work. I pushed it to the repo btw. But ya, it works if I click on the profil page since I have the auth middleware and I get an error. But if I click on the Home page or contact page link, since there is no error, the user name remains in the menu.
randomhelprequested 1 month ago
Hello. I've updated my solution to cover your case. Let me know how it worked.
VladimirMikulic 1 month ago
Hi Vladimir. Thanks for the help again. The problem now though, is I can't access the public pages, like the home page. Let me know...
randomhelprequested 1 month ago
No problem. I've updated my answer with the new code (check out the link) which won't block you from accessing pages. It should simply react to session expiration. Thanks.
VladimirMikulic 1 month ago
Hi Vladimir. Thank agains for the help !! Now though we're back to the pointe where if the session has expired, if I click on the Home page or contact page link the user name remains in the menu. Only if I click on the Profile page, does the username disappear from the menu.
randomhelprequested 1 month ago
Hi. Alright, that's because the home/contact page doesn't make a request to the server. The next version includes an option for this, but currently as suggested here by another user, it is a bit inconvenient. A workaround that I can think of would be replicating the functionality of the login page. Check out the new code. Thanks.
VladimirMikulic 1 month ago
I'm awarding it to you. But at the end I replaced all nuxt-link by a href... Thanks for the help though !!!
randomhelprequested 26 days ago
I appreciate this very much. Hopefully, my solution helped you a bit. Great to hear that the issue is solved!
VladimirMikulic 26 days ago