I am trying to get auth middleware to work so that logged in user only can view Home page. https://nuxtjs.org/examples/auth-routes/ Inside store/modules/auth.js
`
const state = {
isLoggedIn: false
}
const getters = {
isLoggedIn: state => state.isLoggedIn
}
const mutations = {
[types.LOGIN_REQUEST] (state) {
console.log(state)
state.isLoggedIn = false
},
[types.LOGIN_FAILURE] (state) {
state.isLoggedIn = false
},
[types.LOGIN_SUCCESS] (state, { token }) {
state.isLoggedIn = true
console.log(token)
}
}
// actions
const actions = {
USER_LOGIN: async function ({ commit, state }, cred) {
commit(types.LOGIN_REQUEST)
try {
const resp = await axios.post(
url,
cred,
{ headers: headers }
)
commit(types.LOGIN_SUCCESS, { token: resp.data })
console.log(resp.data)
} catch (err) {
console.log(err)
commit(types.LOGIN_FAILURE)
}
}
}
export default {
state,
getters,
actions,
mutations
}
`
And inside signin.vue I am dispatching the action like this ` ... methods: { async login () { await this.$store.dispatch('USER_LOGIN', { username: this.email, password: this.password }) } }
` The login works well. and it sets the state to isLoggedIn = true
And I should get that 'isLoggedIn' as true inside middleware/auth.js
But i am getting it as undefined
export default function ({ store, error }) {
console.log(store.state.isLoggedIn)
// it is undefined // it should be true // getting it true in component
if (!store.state.isLoggedIn) {
error({
message: 'You are not connected',
statusCode: 403
})
}
}
The above code is in middleware/auth.js
Can anyone help me - what I am doing wrong here?
And what if I want to use namespace : true for store/modules? what will be the way to call it from middleware?
<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1812">#c1812</a>)</em></sub></div>