I have a button:
<button
type="submit"
class="bg-blue-600 px-10 text-xl py-3 rounded-md text-white font-semibold"
routerLink="/user-dashboard/main"
>
a service:
export class AuthService {
constructor(private cookieService: CookieService) {}
url = 'http://localhost:8000/api/v1/login';
token: string = '';
isAuthenticated = signal<Boolean>(false);
changeIsAAuthenticated() {
this.isAuthenticated.set(false);
console.log(this.isAuthenticated);
}
async login(formObject: any) {
try {
const res = await axios.post(`${this.url}`, formObject, {
withCredentials: true,
});
console.log('http cookie set!');
} catch (error) {
console.error(error);
}
}
verifyToken = async () => {
try {
const res = await axios.get(`${this.url}`, {
withCredentials: true,
});
if (res.status !== 200) return;
return true;
} catch (error) {
console.error(error);
return false;
}
};
}
and a route guard:
export const loginAuthGuard: CanActivateFn = async (route, state) => {
let authService = inject(AuthService);
try {
const isValid = await authService.verifyToken();
if (!isValid) {
return false;
}
return true;
console.log('go next!');
} catch (error) {
console.error(error);
return false;
}
};
and a router:
path: 'user-dashboard',
component: UserDashboardComponent,
title: 'user-dashboard',
canActivate: [loginAuthGuard],
children:
if i enter the correct credentials, theres no console.log. If i enter the bad crenedtials, i go in anyway and theres 401 code in console, but i go in. Why does this guard doesnt work?