Middleware Auth
A middleware to check if a user is authenticated before displaying the protected route. If the authentication fails the user is redirected to the login page.
export default function auth({ to, next, store }) {
const loginQuery = { path: "/login", query: { redirect: to.fullPath } };
if (!store.getters["auth/authUser"]) {
store.dispatch("auth/getAuthUser").then(() => {
if (!store.getters["auth/authUser"]) next(loginQuery);
else next();
});
} else {
next();
}
}
To add this middleware to any route simply import it into your router/index.js file:
import auth from "@/middleware/auth";
Finally add the auth method as a middleware router parameter on the meta property:
{
path: "/dashboard",
name: "dashboard",
meta: { middleware: [auth] },
component: () =>
import(/* webpackChunkName: "dashboard" */ "../views/Dashboard"),
}