Не сохраняется token при авторизации
Друзья, привет, я новичок, помогите пожалуйста
Пишу интернет-магазин, есть профиль и авторизация Вхожу в аккаунт, все хорошо
Но как только нажимаю на профиль, он опять требует войти каждый раз, хотя в это же время из аккаунта не вышел.
Когда проверяю локальное хранилище в панели - пишет undefined напротив token
Помогите правильно организовать хранение токена.
Код из трех файлов SignIn, Profile и store здесь:
Profile.vue
<script>
import axios from 'axios'
export default {
name: 'Profile',
data() {
return {
orders: []
}
},
methods: {
logout() {
axios.defaults.headers.common["Authorization"] = ""
localStorage.removeItem("token")
localStorage.removeItem("email")
localStorage.removeItem("userid")
this.$store.commit('removeToken')
this.$router.push('/')
},
}
}
</script>
store:
import Vuex from 'vuex'
import Vue from 'vue'
Vue.use(Vuex)
const store = new Vuex.Store({
state: {
cart: {
items: [],
},
isAuthenticated: false,
token: '',
isLoading: false
},
mutations: {
initializeStore(state) {
if (localStorage.getItem('cart')) {
state.cart = JSON.parse(localStorage.getItem('cart'))
} else {
localStorage.setItem('cart', JSON.stringify(state.cart))
}
if (localStorage.getItem('token')) {
state.token = localStorage.getItem('token')
state.isAuthenticated = true
} else {
state.token = ''
state.isAuthenticated = false
}
},
addToCart(state, item) {
const exists = state.cart.items.filter(i => i.product.id === item.product.id)
if (exists.length) {
exists[0].quantity = parseInt(exists[0].quantity) + parseInt(item.quantity)
} else {
state.cart.items.push(item)
}
localStorage.setItem('cart', JSON.stringify(state.cart))
},
setIsLoading(state, status) {
state.isLoading = status
},
setToken(state, token) {
state.token = token
state.isAuthenticated = true
},
removeToken(state) {
state.token = ''
state.isAuthenticated = false
},
clearCart(state) {
state.cart = { items: [] }
localStorage.setItem('cart', JSON.stringify(state.cart))
},
},
actions: {
},
modules: {
}
})
export default store;
SignIn.vue
import axios from 'axios'
export default {
name: 'SignIn',
data() {
return {
email: '',
password: '',
errors: []
}
},
methods: {
async submitForm() {
axios.defaults.headers.common["Authorization"] = ""
localStorage.removeItem("token")
const formData = {
email: this.email,
password: this.password
}
await axios
.post("/auth/login/", formData)
.then(response => {
const token = response.data.auth_token
this.$store.commit('setToken', token)
axios.defaults.headers.common["Authorization"] = "Token " + token
localStorage.setItem("token", token)
const toPath = this.$route.query.to || '/cart'
this.$router.push(toPath)
})
.catch(error => {
if (error.response) {
for (const property in error.response.data) {
this.errors.push(`${property}: ${error.response.data[property]}`)
}
} else {
this.errors.push('Что-то пошло не так, попробуйте снова')
console.log(JSON.stringify(error))
}
})
}
},
mounted () {
document.title = 'ALLEN | Вход'
}
}