Localstorage not defined

Question

i am using Nuxt.js for SSR. I have a login system whenever i Log in my App, i get an JSON web token (JWT) and store it in my Localstorage.

The problem is now the SSR. Whenever i try to access the Localstorage it says its not defined. I found an Stackoverflow article about this problem, its because the Code is server side rendered so it has no access to the Localstorage.

I tried the created() lifecycle hook to check if token exist in localstorage, no success. I also tried with nuxtServerInit also no success.

How can i check if token exist in localstorage on the client side or is there any better idea?

Answer 1

You may call a function on mounted

export default {
  mounted() {
    this.storage();
  },
  methods:{
    storage(){
       localStorage.getItem("authToken");
    }
  }
}

OR use created alongwith process.browser check

export default {
  created() {
    this.storage();
  },
  methods:{
    storage(){
      if (process.browser){
          localStorage.getItem("authToken");
      }
    }
  }
}