I am trying to make a Vue 3 project with Vite, that checks if user is logged in with AWS Cognito before entering to main page.
This is my router.js:
import { createRouter, createWebHistory } from 'vue-router'
import HomeView from '../views/HomeView.vue'
import store from '../store';
import auth from '../auth';
import url from 'url'
function requireAuth(to, from, next) {
if (!auth.auth.isUserSignedIn()) {
next({
path: '/check-login',
query: { redirect: to.fullPath }
});
} else {
console.log("User already logged in");
if(store.getters.token==null) {
store.commit('setToken', auth.auth.signInUserSession.getIdToken().jwtToken);
}
next();
}
}
const routes = [
{
path: '/',
name: 'home',
component: HomeView,
beforeEnter: requireAuth
},
{
path: '/check-login', beforeEnter: () => {
auth.auth.getSession();
}
},
{
path: '/login*', beforeEnter: async () => {
let currUrl = window.location.href;
const queryObject = url.parse(currUrl,true);
const query = queryObject.hash.replace("#", "").split("&");
let id_token = "";
for(let i=0; i<query.length; i++){
if(query[i].indexOf("id_token")>-1) {
id_token = query[i];
id_token = id_token.replace("id_token=", "");
break;
}
}
if(id_token){
console.log("Setting token");
store.commit('setToken', id_token);
}
await auth.auth.parseCognitoWebResponse(currUrl);
goHome();
}
},
{
path: '/logout', beforeEnter: (to, from, next) => {
auth.logout();
next();
}
}
]
const router = createRouter({
history: createWebHistory(),
routes
})
function goHome() {
router.push("/");
}
export default router
When I run the project using npm run dev the following warning appears:
[Vue Router warn]: No match found for location with path "/check-login?redirect=/"
I've tried to load manually other routes like login but same result. It seems that it doesn't recognize my routes (except Home), maybe because there is something wrong in the definition, but I can't find what it is...
Any idea?
Just found what was wrong. I had to include a component in every route to be detected well.
What I did is create a blank view with only a route-view inside.