Nuxt.js: Auth Guard issue (middleware)

Created on 31 May 2017 · 5Comments · Source: nuxt/nuxt.js

I'm using JWT and saves a token in sessionStorage at client side.

I have an auth middleware which will check if the token exists in the sessionStorage and redirect if not.

The problem is, when the browser loads the app, or refresh, the middleware does not run locally at the first time, which leads to the "not found" error of sessionStorage.

even beforeCreate and created lifecycle hooks are running in the "server side" so the first check point on the client side will be after those lifecycles and this leads to inefficient redirections. It will be cool if it can redirect the page with loading as less information as possible in the page.

Is there a way that can elegantly handle this issue?

_{This question is available on Nuxt.js community (#c705)}

help-wanted question

Source

ghost

Most helpful comment

Hi, @panorart , the server does not know about the token in the sessionStorage. The solution is to use a cookie for the token, which the browser will send in each request to your server.
Once you do so you can access the token from the global.__VUE_SSR_CONTEXT__.

Take a look at, https://github.com/nuxt/modules/blob/master/modules/auth/store.js. I found it very helpful for a personal project (thanks to the authors).

motia on 1 Jun 2017

👍2

All 5 comments

Take a look at, https://github.com/nuxt/modules/blob/master/modules/auth/store.js. I found it very helpful for a personal project (thanks to the authors).

motia on 1 Jun 2017

👍2

Hi @motia , that's the way if there is a server. I'm using AWS Lambda as the backend so that might not work. It looks like the page middleware will not run after refresh, so I need to write inside the beforeRouteEnter to get the token from the browser

ghost on 2 Jun 2017

@panorart where do you host your Nuxt app?