То как мы его в store то запихнём?

Через мутацию?

const app = createApp(App); app.use(store) await store.loadSomeState(); app.mount('#app')

Да только там надо ещё роутер чуть попозже создать

Да, забыл про роутер, но я думаю суть понятна

А вот я здесь призадумался с одним вопросом. Что будет, если при первичном получении /profile с backend выпадет 401, тогда перехватчик попытается сделать с помощью router redirect на страницу /login: Но ведь router ещё не инициализирован, так как запрос делается ДО app.use(router). Это первый вопрос. const api = axios.create({ withCredentials: true, timeout: 5000, headers: { "Content-Type": "application/json" }, }); api.interceptors.response.use( function (response) { return response; }, function (error) { console.log(error.response.data); if (error.response.status === 401) { // store.dispatch('logout') router.push("/login").then(console.error); return Promise.resolve(error.response); } else { return Promise.reject(error); } } ); Второй вопрос у меня возник из первого, сейчас если я не авторизован меня даже на условный home сайта (/) не пускает, так как сразу пытается выполниться запрос на получение профиля, но там падает 401 и меня редиректит на страницу логина. Я считаю что это так работать не должно, правильно ли я догадываюсь что использовать одновременно перехватчик на 401 и в beforeEnter проверку meta.requiresAuth не нужно?

Вы связали интерцепторы аксиоса с вью роутером? Это прямой выстрел себе в ногу.

Собственно в этом и был вопрос, я сам учуял что это вместе будет странно работать и решил уточнить. получается от interceptors и redirect на login стоит отказаться и возложить всю ответственность за права на вот эту штуку: router.beforeEach((to) => { console.log("beforeEach", to.fullPath); if (to.meta.disableIfAuthorized && store.getters["user/isAuthorized"]) { console.log("disableIfAuthorized"); return { path: "/", }; } // instead of having to check every route record with // to.matched.some(record => record.meta.requiresAuth) if (to.meta.requiresAuth && !store.getters["user/isAuthorized"]) { // this route requires auth, check if logged in // if not, redirect to login page. return { path: "/login", // save the location we were at to come back later query: { redirect: to.fullPath }, }; } });

А в глобал стор в actions ставить router.push хорошaя практика?

Я бы не использовал для этого meta. Гарды можно для каждого роута указывать свои. const authenticatedOnly = () => ({ next }) => { if (store.getters["user/isAuthorized"]) { next() } else { next('/login') } } { name: 'restricted', path: '/secret', beforeEnter: authenticatedOnly(), }

Нет

понял, спасибо, учту

Так, я наконец-то сел пробовать вот этот вариант. const app = createApp(App); app.use(store); await store.fetchUser(); app.use(router); app.mount("#app"); store index: import { createStore } from "vuex"; import { userModule } from "@/store/userModule"; export default createStore({ modules: { user: userModule, }, strict: process.env.NODE_ENV !== "production", }); Как здесь обратиться к userModule и вызывать у него метод, который загрузит профиль пользователя?

для начала перестать называть его модулем)

так а чё, во vuex это модули ж

Что такое вуекс?

Как тут в телеге также код оформлять?

Ща

js (твой код) и закрывающиеся кавычки ```js function foo() {}

ах

Стикер

let a = 5; console.log(a + 5); // result

Спасибо большое!

Привет! А как сюда добавить чтобы был обратно redirect на путь из которого попали ? Аналог return { path: '/login', // save the location we were at to come back later query: { redirect: to.fullPath } }

Можно получить это в beforeEnter и сохранить где-нибудь или явно указать в квери параметре

Понял, спасибо