style: fix linting issues met Prettier

This commit is contained in:
Lint Action 2025-03-10 11:20:14 +00:00
parent 394deba56d
commit 464dcbf73c
25 changed files with 5861 additions and 5062 deletions

View file

@ -12,14 +12,14 @@ import submissionRouter from './routes/submission.js';
import classRouter from './routes/class.js'; import classRouter from './routes/class.js';
import questionRouter from './routes/question.js'; import questionRouter from './routes/question.js';
import authRouter from './routes/auth.js'; import authRouter from './routes/auth.js';
import {authenticateUser} from './middleware/auth/auth.js'; import { authenticateUser } from './middleware/auth/auth.js';
import cors from './middleware/cors.js'; import cors from './middleware/cors.js';
import { getLogger, Logger } from './logging/initalize.js'; import { getLogger, Logger } from './logging/initalize.js';
import { responseTimeLogger } from './logging/responseTimeLogger.js'; import { responseTimeLogger } from './logging/responseTimeLogger.js';
import responseTime from 'response-time'; import responseTime from 'response-time';
import { EnvVars, getNumericEnvVar } from './util/envvars.js'; import { EnvVars, getNumericEnvVar } from './util/envvars.js';
import swaggerMiddleware from "./swagger"; import swaggerMiddleware from './swagger';
import swaggerUi from "swagger-ui-express"; import swaggerUi from 'swagger-ui-express';
const logger: Logger = getLogger(); const logger: Logger = getLogger();
@ -50,8 +50,14 @@ app.use('/question', questionRouter /* #swagger.tags = ['Question'] */);
app.use('/auth', authRouter /* #swagger.tags = ['Auth'] */); app.use('/auth', authRouter /* #swagger.tags = ['Auth'] */);
app.use('/theme', themeRoutes /* #swagger.tags = ['Theme'] */); app.use('/theme', themeRoutes /* #swagger.tags = ['Theme'] */);
app.use('/learningPath', learningPathRoutes /* #swagger.tags = ['Learning Path'] */); app.use(
app.use('/learningObject', learningObjectRoutes /* #swagger.tags = ['Learning Object'] */); '/learningPath',
learningPathRoutes /* #swagger.tags = ['Learning Path'] */
);
app.use(
'/learningObject',
learningObjectRoutes /* #swagger.tags = ['Learning Object'] */
);
// Swagger UI for API documentation // Swagger UI for API documentation
app.use('/api-docs', swaggerUi.serve, swaggerMiddleware); app.use('/api-docs', swaggerUi.serve, swaggerMiddleware);

View file

@ -1,19 +1,19 @@
import {EnvVars, getEnvVar} from "../util/envvars.js"; import { EnvVars, getEnvVar } from '../util/envvars.js';
type FrontendIdpConfig = { type FrontendIdpConfig = {
authority: string, authority: string;
clientId: string, clientId: string;
scope: string, scope: string;
responseType: string responseType: string;
} };
type FrontendAuthConfig = { type FrontendAuthConfig = {
student: FrontendIdpConfig, student: FrontendIdpConfig;
teacher: FrontendIdpConfig teacher: FrontendIdpConfig;
} };
const SCOPE = "openid profile email"; const SCOPE = 'openid profile email';
const RESPONSE_TYPE = "code"; const RESPONSE_TYPE = 'code';
export function getFrontendAuthConfig(): FrontendAuthConfig { export function getFrontendAuthConfig(): FrontendAuthConfig {
return { return {
@ -21,13 +21,13 @@ export function getFrontendAuthConfig(): FrontendAuthConfig {
authority: getEnvVar(EnvVars.IdpStudentUrl), authority: getEnvVar(EnvVars.IdpStudentUrl),
clientId: getEnvVar(EnvVars.IdpStudentClientId), clientId: getEnvVar(EnvVars.IdpStudentClientId),
scope: SCOPE, scope: SCOPE,
responseType: RESPONSE_TYPE responseType: RESPONSE_TYPE,
}, },
teacher: { teacher: {
authority: getEnvVar(EnvVars.IdpTeacherUrl), authority: getEnvVar(EnvVars.IdpTeacherUrl),
clientId: getEnvVar(EnvVars.IdpTeacherClientId), clientId: getEnvVar(EnvVars.IdpTeacherClientId),
scope: SCOPE, scope: SCOPE,
responseType: RESPONSE_TYPE responseType: RESPONSE_TYPE,
}, },
}; };
} }

View file

@ -1,13 +1,13 @@
export class UnauthorizedException extends Error { export class UnauthorizedException extends Error {
status = 401; status = 401;
constructor(message: string = "Unauthorized") { constructor(message: string = 'Unauthorized') {
super(message); super(message);
} }
} }
export class ForbiddenException extends Error { export class ForbiddenException extends Error {
status = 403; status = 403;
constructor(message: string = "Forbidden") { constructor(message: string = 'Forbidden') {
super(message); super(message);
} }
} }

View file

@ -1,25 +1,25 @@
import {EnvVars, getEnvVar} from "../../util/envvars.js"; import { EnvVars, getEnvVar } from '../../util/envvars.js';
import {expressjwt} from 'express-jwt'; import { expressjwt } from 'express-jwt';
import {JwtPayload} from 'jsonwebtoken' import { JwtPayload } from 'jsonwebtoken';
import jwksClient from 'jwks-rsa'; import jwksClient from 'jwks-rsa';
import * as express from "express"; import * as express from 'express';
import * as jwt from "jsonwebtoken"; import * as jwt from 'jsonwebtoken';
import {AuthenticatedRequest} from "./authenticated-request.js"; import { AuthenticatedRequest } from './authenticated-request.js';
import {AuthenticationInfo} from "./authentication-info.js"; import { AuthenticationInfo } from './authentication-info.js';
import {ForbiddenException, UnauthorizedException} from "../../exceptions"; import { ForbiddenException, UnauthorizedException } from '../../exceptions';
const JWKS_CACHE = true; const JWKS_CACHE = true;
const JWKS_RATE_LIMIT = true; const JWKS_RATE_LIMIT = true;
const REQUEST_PROPERTY_FOR_JWT_PAYLOAD = "jwtPayload"; const REQUEST_PROPERTY_FOR_JWT_PAYLOAD = 'jwtPayload';
const JWT_ALGORITHM = "RS256"; // Not configurable via env vars since supporting other algorithms would const JWT_ALGORITHM = 'RS256'; // Not configurable via env vars since supporting other algorithms would
// Require additional libraries to be added. // Require additional libraries to be added.
const JWT_PROPERTY_NAMES = { const JWT_PROPERTY_NAMES = {
username: "preferred_username", username: 'preferred_username',
firstName: "given_name", firstName: 'given_name',
lastName: "family_name", lastName: 'family_name',
name: "name", name: 'name',
email: "email" email: 'email',
}; };
function createJwksClient(uri: string): jwksClient.JwksClient { function createJwksClient(uri: string): jwksClient.JwksClient {
@ -38,7 +38,7 @@ const idpConfigs = {
teacher: { teacher: {
issuer: getEnvVar(EnvVars.IdpTeacherUrl), issuer: getEnvVar(EnvVars.IdpTeacherUrl),
jwksClient: createJwksClient(getEnvVar(EnvVars.IdpTeacherJwksEndpoint)), jwksClient: createJwksClient(getEnvVar(EnvVars.IdpTeacherJwksEndpoint)),
} },
}; };
/** /**
@ -47,42 +47,48 @@ const idpConfigs = {
const verifyJwtToken = expressjwt({ const verifyJwtToken = expressjwt({
secret: async (_: express.Request, token: jwt.Jwt | undefined) => { secret: async (_: express.Request, token: jwt.Jwt | undefined) => {
if (!token?.payload || !(token.payload as JwtPayload).iss) { if (!token?.payload || !(token.payload as JwtPayload).iss) {
throw new Error("Invalid token"); throw new Error('Invalid token');
} }
const issuer = (token.payload as JwtPayload).iss; const issuer = (token.payload as JwtPayload).iss;
const idpConfig = Object.values(idpConfigs).find(config => {return config.issuer === issuer}); const idpConfig = Object.values(idpConfigs).find((config) => {
return config.issuer === issuer;
});
if (!idpConfig) { if (!idpConfig) {
throw new Error("Issuer not accepted."); throw new Error('Issuer not accepted.');
} }
const signingKey = await idpConfig.jwksClient.getSigningKey(token.header.kid); const signingKey = await idpConfig.jwksClient.getSigningKey(
token.header.kid
);
if (!signingKey) { if (!signingKey) {
throw new Error("Signing key not found."); throw new Error('Signing key not found.');
} }
return signingKey.getPublicKey(); return signingKey.getPublicKey();
}, },
audience: getEnvVar(EnvVars.IdpAudience), audience: getEnvVar(EnvVars.IdpAudience),
algorithms: [JWT_ALGORITHM], algorithms: [JWT_ALGORITHM],
credentialsRequired: false, credentialsRequired: false,
requestProperty: REQUEST_PROPERTY_FOR_JWT_PAYLOAD requestProperty: REQUEST_PROPERTY_FOR_JWT_PAYLOAD,
}); });
/** /**
* Get an object with information about the authenticated user from a given authenticated request. * Get an object with information about the authenticated user from a given authenticated request.
*/ */
function getAuthenticationInfo(req: AuthenticatedRequest): AuthenticationInfo | undefined { function getAuthenticationInfo(
req: AuthenticatedRequest
): AuthenticationInfo | undefined {
if (!req.jwtPayload) { if (!req.jwtPayload) {
return; return;
} }
const issuer = req.jwtPayload.iss; const issuer = req.jwtPayload.iss;
let accountType: "student" | "teacher"; let accountType: 'student' | 'teacher';
if (issuer === idpConfigs.student.issuer) { if (issuer === idpConfigs.student.issuer) {
accountType = "student"; accountType = 'student';
} else if (issuer === idpConfigs.teacher.issuer) { } else if (issuer === idpConfigs.teacher.issuer) {
accountType = "teacher"; accountType = 'teacher';
} else { } else {
return; return;
} }
@ -93,14 +99,18 @@ function getAuthenticationInfo(req: AuthenticatedRequest): AuthenticationInfo |
firstName: req.jwtPayload[JWT_PROPERTY_NAMES.firstName], firstName: req.jwtPayload[JWT_PROPERTY_NAMES.firstName],
lastName: req.jwtPayload[JWT_PROPERTY_NAMES.lastName], lastName: req.jwtPayload[JWT_PROPERTY_NAMES.lastName],
email: req.jwtPayload[JWT_PROPERTY_NAMES.email], email: req.jwtPayload[JWT_PROPERTY_NAMES.email],
} };
} }
/** /**
* Add the AuthenticationInfo object with the information about the current authentication to the request in order * Add the AuthenticationInfo object with the information about the current authentication to the request in order
* to avoid that the routers have to deal with the JWT token. * to avoid that the routers have to deal with the JWT token.
*/ */
const addAuthenticationInfo = (req: AuthenticatedRequest, res: express.Response, next: express.NextFunction) => { const addAuthenticationInfo = (
req: AuthenticatedRequest,
res: express.Response,
next: express.NextFunction
) => {
req.auth = getAuthenticationInfo(req); req.auth = getAuthenticationInfo(req);
next(); next();
}; };
@ -113,8 +123,14 @@ export const authenticateUser = [verifyJwtToken, addAuthenticationInfo];
* @param accessCondition Predicate over the current AuthenticationInfo. Access is only granted when this evaluates * @param accessCondition Predicate over the current AuthenticationInfo. Access is only granted when this evaluates
* to true. * to true.
*/ */
export const authorize = (accessCondition: (auth: AuthenticationInfo) => boolean) => { export const authorize = (
return (req: AuthenticatedRequest, res: express.Response, next: express.NextFunction): void => { accessCondition: (auth: AuthenticationInfo) => boolean
) => {
return (
req: AuthenticatedRequest,
res: express.Response,
next: express.NextFunction
): void => {
if (!req.auth) { if (!req.auth) {
throw new UnauthorizedException(); throw new UnauthorizedException();
} else if (!accessCondition(req.auth)) { } else if (!accessCondition(req.auth)) {
@ -122,20 +138,26 @@ export const authorize = (accessCondition: (auth: AuthenticationInfo) => boolean
} else { } else {
next(); next();
} }
} };
} };
/** /**
* Middleware which rejects all unauthenticated users, but accepts all authenticated users. * Middleware which rejects all unauthenticated users, but accepts all authenticated users.
*/ */
export const authenticatedOnly = authorize(_ => {return true}); export const authenticatedOnly = authorize((_) => {
return true;
});
/** /**
* Middleware which rejects requests from unauthenticated users or users that aren't students. * Middleware which rejects requests from unauthenticated users or users that aren't students.
*/ */
export const studentsOnly = authorize(auth => {return auth.accountType === "student"}); export const studentsOnly = authorize((auth) => {
return auth.accountType === 'student';
});
/** /**
* Middleware which rejects requests from unauthenticated users or users that aren't teachers. * Middleware which rejects requests from unauthenticated users or users that aren't teachers.
*/ */
export const teachersOnly = authorize(auth => {return auth.accountType === "teacher"}); export const teachersOnly = authorize((auth) => {
return auth.accountType === 'teacher';
});

View file

@ -1,6 +1,6 @@
import { Request } from "express"; import { Request } from 'express';
import { JwtPayload } from "jsonwebtoken"; import { JwtPayload } from 'jsonwebtoken';
import {AuthenticationInfo} from "./authentication-info.js"; import { AuthenticationInfo } from './authentication-info.js';
export interface AuthenticatedRequest extends Request { export interface AuthenticatedRequest extends Request {
// Properties are optional since the user is not necessarily authenticated. // Properties are optional since the user is not necessarily authenticated.

View file

@ -2,10 +2,10 @@
* Object with information about the user who is currently logged in. * Object with information about the user who is currently logged in.
*/ */
export type AuthenticationInfo = { export type AuthenticationInfo = {
accountType: "student" | "teacher", accountType: 'student' | 'teacher';
username: string, username: string;
name?: string, name?: string;
firstName?: string, firstName?: string;
lastName?: string, lastName?: string;
email?: string email?: string;
}; };

View file

@ -1,7 +1,7 @@
import cors from "cors"; import cors from 'cors';
import {EnvVars, getEnvVar} from "../util/envvars.js"; import { EnvVars, getEnvVar } from '../util/envvars.js';
export default cors({ export default cors({
origin: getEnvVar(EnvVars.CorsAllowedOrigins).split(','), origin: getEnvVar(EnvVars.CorsAllowedOrigins).split(','),
allowedHeaders: getEnvVar(EnvVars.CorsAllowedHeaders).split(',') allowedHeaders: getEnvVar(EnvVars.CorsAllowedHeaders).split(','),
}); });

View file

@ -1,6 +1,10 @@
import express from 'express' import express from 'express';
import {getFrontendAuthConfig} from "../controllers/auth.js"; import { getFrontendAuthConfig } from '../controllers/auth.js';
import {authenticatedOnly, studentsOnly, teachersOnly} from "../middleware/auth/auth.js"; import {
authenticatedOnly,
studentsOnly,
teachersOnly,
} from '../middleware/auth/auth.js';
const router = express.Router(); const router = express.Router();
// Returns auth configuration for frontend // Returns auth configuration for frontend
@ -10,17 +14,17 @@ router.get('/config', (req, res) => {
router.get('/testAuthenticatedOnly', authenticatedOnly, (req, res) => { router.get('/testAuthenticatedOnly', authenticatedOnly, (req, res) => {
/* #swagger.security = [{ "student": [ ] }, { "teacher": [ ] }] */ /* #swagger.security = [{ "student": [ ] }, { "teacher": [ ] }] */
res.json({message: "If you see this, you should be authenticated!"}); res.json({ message: 'If you see this, you should be authenticated!' });
}); });
router.get('/testStudentsOnly', studentsOnly, (req, res) => { router.get('/testStudentsOnly', studentsOnly, (req, res) => {
/* #swagger.security = [{ "student": [ ] }] */ /* #swagger.security = [{ "student": [ ] }] */
res.json({message: "If you see this, you should be a student!"}); res.json({ message: 'If you see this, you should be a student!' });
}); });
router.get('/testTeachersOnly', teachersOnly, (req, res) => { router.get('/testTeachersOnly', teachersOnly, (req, res) => {
/* #swagger.security = [{ "teacher": [ ] }] */ /* #swagger.security = [{ "teacher": [ ] }] */
res.json({message: "If you see this, you should be a teacher!"}); res.json({ message: 'If you see this, you should be a teacher!' });
}); });
export default router; export default router;

View file

@ -16,14 +16,32 @@ export const EnvVars: { [key: string]: EnvVar } = {
DbPassword: { key: DB_PREFIX + 'PASSWORD', required: true }, DbPassword: { key: DB_PREFIX + 'PASSWORD', required: true },
DbUpdate: { key: DB_PREFIX + 'UPDATE', defaultValue: false }, DbUpdate: { key: DB_PREFIX + 'UPDATE', defaultValue: false },
IdpStudentUrl: { key: STUDENT_IDP_PREFIX + 'URL', required: true }, IdpStudentUrl: { key: STUDENT_IDP_PREFIX + 'URL', required: true },
IdpStudentClientId: { key: STUDENT_IDP_PREFIX + 'CLIENT_ID', required: true }, IdpStudentClientId: {
IdpStudentJwksEndpoint: { key: STUDENT_IDP_PREFIX + 'JWKS_ENDPOINT', required: true }, key: STUDENT_IDP_PREFIX + 'CLIENT_ID',
required: true,
},
IdpStudentJwksEndpoint: {
key: STUDENT_IDP_PREFIX + 'JWKS_ENDPOINT',
required: true,
},
IdpTeacherUrl: { key: TEACHER_IDP_PREFIX + 'URL', required: true }, IdpTeacherUrl: { key: TEACHER_IDP_PREFIX + 'URL', required: true },
IdpTeacherClientId: { key: TEACHER_IDP_PREFIX + 'CLIENT_ID', required: true }, IdpTeacherClientId: {
IdpTeacherJwksEndpoint: { key: TEACHER_IDP_PREFIX + 'JWKS_ENDPOINT', required: true }, key: TEACHER_IDP_PREFIX + 'CLIENT_ID',
required: true,
},
IdpTeacherJwksEndpoint: {
key: TEACHER_IDP_PREFIX + 'JWKS_ENDPOINT',
required: true,
},
IdpAudience: { key: IDP_PREFIX + 'AUDIENCE', defaultValue: 'account' }, IdpAudience: { key: IDP_PREFIX + 'AUDIENCE', defaultValue: 'account' },
CorsAllowedOrigins: { key: CORS_PREFIX + 'ALLOWED_ORIGINS', defaultValue: ''}, CorsAllowedOrigins: {
CorsAllowedHeaders: { key: CORS_PREFIX + 'ALLOWED_HEADERS', defaultValue: 'Authorization,Content-Type'} key: CORS_PREFIX + 'ALLOWED_ORIGINS',
defaultValue: '',
},
CorsAllowedHeaders: {
key: CORS_PREFIX + 'ALLOWED_HEADERS',
defaultValue: 'Authorization,Content-Type',
},
} as const; } as const;
/** /**

View file

@ -23,16 +23,19 @@ services:
KC_HEALTH_ENABLED: 'true' KC_HEALTH_ENABLED: 'true'
KC_LOG_LEVEL: info KC_LOG_LEVEL: info
healthcheck: healthcheck:
test: [ 'CMD', 'curl', '-f', 'http://localhost:7080/health/ready' ] test: ['CMD', 'curl', '-f', 'http://localhost:7080/health/ready']
interval: 15s interval: 15s
timeout: 2s timeout: 2s
retries: 15 retries: 15
command: [ command:
'start-dev', [
'--http-port', '7080', 'start-dev',
'--https-port', '7443', '--http-port',
'--import-realm' '7080',
] '--https-port',
'7443',
'--import-realm',
]
ports: ports:
- '7080:7080' - '7080:7080'
- '7443:7443' - '7443:7443'

View file

@ -1,4 +1,4 @@
import swaggerAutogen from "swagger-autogen"; import swaggerAutogen from 'swagger-autogen';
const doc = { const doc = {
info: { info: {
@ -7,18 +7,18 @@ const doc = {
description: 'Dwengo-1 Backend API using Express, based on VZW Dwengo', description: 'Dwengo-1 Backend API using Express, based on VZW Dwengo',
license: { license: {
name: 'MIT', name: 'MIT',
url: 'https://github.com/SELab-2/Dwengo-1/blob/336496ab6352ee3f8bf47490c90b5cf81526cef6/LICENSE' url: 'https://github.com/SELab-2/Dwengo-1/blob/336496ab6352ee3f8bf47490c90b5cf81526cef6/LICENSE',
} },
}, },
servers: [ servers: [
{ {
url: 'http://localhost:3000/', url: 'http://localhost:3000/',
description: 'Development server' description: 'Development server',
}, },
{ {
url: 'https://sel2-1.ugent.be/api', url: 'https://sel2-1.ugent.be/api',
description: 'Production server' description: 'Production server',
} },
], ],
components: { components: {
securitySchemes: { securitySchemes: {
@ -26,35 +26,35 @@ const doc = {
type: 'oauth2', type: 'oauth2',
flows: { flows: {
implicit: { implicit: {
authorizationUrl: 'http://localhost:7080/realms/student/protocol/openid-connect/auth', authorizationUrl:
'http://localhost:7080/realms/student/protocol/openid-connect/auth',
scopes: { scopes: {
openid: 'openid', openid: 'openid',
profile: 'profile', profile: 'profile',
email: 'email' email: 'email',
} },
} },
} },
}, },
teacher: { teacher: {
type: 'oauth2', type: 'oauth2',
flows: { flows: {
implicit: { implicit: {
authorizationUrl: 'http://localhost:7080/realms/teacher/protocol/openid-connect/auth', authorizationUrl:
'http://localhost:7080/realms/teacher/protocol/openid-connect/auth',
scopes: { scopes: {
openid: 'openid', openid: 'openid',
profile: 'profile', profile: 'profile',
email: 'email' email: 'email',
} },
} },
} },
} },
} },
} },
}; };
const outputFile = './swagger.json'; const outputFile = './swagger.json';
const routes = [ const routes = ['../../backend/src/app.ts'];
'../../backend/src/app.ts'
];
swaggerAutogen({ openapi: '3.1.0' })(outputFile, routes, doc); swaggerAutogen({ openapi: '3.1.0' })(outputFile, routes, doc);

File diff suppressed because it is too large Load diff

View file

@ -1,5 +1,5 @@
export const apiConfig = { export const apiConfig = {
baseUrl: window.location.hostname == "localhost" ? "http://localhost:3000" : window.location.origin baseUrl: window.location.hostname == "localhost" ? "http://localhost:3000" : window.location.origin,
} };
export const loginRoute = "/login"; export const loginRoute = "/login";

View file

@ -36,7 +36,7 @@ const router = createRouter({
}, },
{ {
path: "/callback", path: "/callback",
component: CallbackPage component: CallbackPage,
}, },
{ {
path: "/student/:id", path: "/student/:id",

View file

@ -1,5 +1,5 @@
import axios from "axios"; import axios from "axios";
import {apiConfig} from "@/config.ts"; import { apiConfig } from "@/config.ts";
const apiClient = axios.create({ const apiClient = axios.create({
baseURL: apiConfig.baseUrl, baseURL: apiConfig.baseUrl,

View file

@ -1,5 +1,5 @@
import apiClient from "@/services/api-client.ts"; import apiClient from "@/services/api-client.ts";
import type {FrontendAuthConfig} from "@/services/auth/auth.d.ts"; import type { FrontendAuthConfig } from "@/services/auth/auth.d.ts";
/** /**
* Fetch the authentication configuration from the backend. * Fetch the authentication configuration from the backend.
@ -22,6 +22,6 @@ export async function loadAuthConfig() {
response_type: authConfig.teacher.responseType, response_type: authConfig.teacher.responseType,
scope: authConfig.teacher.scope, scope: authConfig.teacher.scope,
post_logout_redirect_uri: window.location.origin, post_logout_redirect_uri: window.location.origin,
} },
}; };
} }

View file

@ -2,15 +2,15 @@
* Service for all authentication- and authorization-related tasks. * Service for all authentication- and authorization-related tasks.
*/ */
import {computed, reactive} from "vue"; import { computed, reactive } from "vue";
import type {AuthState, Role, UserManagersForRoles} from "@/services/auth/auth.d.ts"; import type { AuthState, Role, UserManagersForRoles } from "@/services/auth/auth.d.ts";
import {User, UserManager} from "oidc-client-ts"; import { User, UserManager } from "oidc-client-ts";
import {loadAuthConfig} from "@/services/auth/auth-config-loader.ts"; import { loadAuthConfig } from "@/services/auth/auth-config-loader.ts";
import authStorage from "./auth-storage.ts" import authStorage from "./auth-storage.ts";
import {loginRoute} from "@/config.ts"; import { loginRoute } from "@/config.ts";
import apiClient from "@/services/api-client.ts"; import apiClient from "@/services/api-client.ts";
import router from "@/router"; import router from "@/router";
import type {AxiosError} from "axios"; import type { AxiosError } from "axios";
const authConfig = await loadAuthConfig(); const authConfig = await loadAuthConfig();
@ -40,10 +40,12 @@ async function loadUser(): Promise<User | null> {
const authState = reactive<AuthState>({ const authState = reactive<AuthState>({
user: null, user: null,
accessToken: null, accessToken: null,
activeRole: authStorage.getActiveRole() || null activeRole: authStorage.getActiveRole() || null,
}); });
const isLoggedIn = computed(() => {return authState.user !== null}); const isLoggedIn = computed(() => {
return authState.user !== null;
});
/** /**
* Redirect the user to the login page where he/she can choose whether to log in as a student or teacher. * Redirect the user to the login page where he/she can choose whether to log in as a student or teacher.
@ -70,7 +72,7 @@ async function handleLoginCallback(): Promise<void> {
if (!activeRole) { if (!activeRole) {
throw new Error("Login callback received, but the user is not logging in!"); throw new Error("Login callback received, but the user is not logging in!");
} }
authState.user = await userManagers[activeRole].signinCallback() || null; authState.user = (await userManagers[activeRole].signinCallback()) || null;
} }
/** /**
@ -104,29 +106,35 @@ async function logout(): Promise<void> {
} }
// Registering interceptor to add the authorization header to each request when the user is logged in. // Registering interceptor to add the authorization header to each request when the user is logged in.
apiClient.interceptors.request.use(async (reqConfig) => { apiClient.interceptors.request.use(
const token = authState?.user?.access_token; async (reqConfig) => {
if (token) { const token = authState?.user?.access_token;
reqConfig.headers.Authorization = `Bearer ${token}`; if (token) {
} reqConfig.headers.Authorization = `Bearer ${token}`;
return reqConfig; }
}, (error) => {return Promise.reject(error)}); return reqConfig;
},
(error) => {
return Promise.reject(error);
},
);
// Registering interceptor to refresh the token when a request failed because it was expired. // Registering interceptor to refresh the token when a request failed because it was expired.
apiClient.interceptors.response.use( apiClient.interceptors.response.use(
response => {return response}, (response) => {
async (error: AxiosError<{message?: string}>) => { return response;
},
async (error: AxiosError<{ message?: string }>) => {
if (error.response?.status === 401) { if (error.response?.status === 401) {
if (error.response!.data.message === "token_expired") { if (error.response!.data.message === "token_expired") {
console.log("Access token expired, trying to refresh..."); console.log("Access token expired, trying to refresh...");
await renewToken(); await renewToken();
return apiClient(error.config!); // Retry the request return apiClient(error.config!); // Retry the request
} // Apparently, the user got a 401 because he was not logged in yet at all. Redirect him to login. } // Apparently, the user got a 401 because he was not logged in yet at all. Redirect him to login.
await initiateLogin() await initiateLogin();
} }
return Promise.reject(error); return Promise.reject(error);
} },
); );
export default {authState, isLoggedIn, initiateLogin, loadUser, handleLoginCallback, loginAs, logout}; export default { authState, isLoggedIn, initiateLogin, loadUser, handleLoginCallback, loginAs, logout };

View file

@ -1,4 +1,4 @@
import type {Role} from "@/services/auth/auth.d.ts"; import type { Role } from "@/services/auth/auth.d.ts";
export default { export default {
/** /**
@ -22,5 +22,5 @@ export default {
*/ */
deleteActiveRole() { deleteActiveRole() {
localStorage.removeItem("activeRole"); localStorage.removeItem("activeRole");
} },
} };

View file

@ -1,22 +1,22 @@
import {type User, UserManager} from "oidc-client-ts"; import { type User, UserManager } from "oidc-client-ts";
export type AuthState = { export type AuthState = {
user: User | null, user: User | null;
accessToken: string | null, accessToken: string | null;
activeRole: Role | null activeRole: Role | null;
}; };
export type FrontendAuthConfig = { export type FrontendAuthConfig = {
student: FrontendIdpConfig, student: FrontendIdpConfig;
teacher: FrontendIdpConfig teacher: FrontendIdpConfig;
}; };
export type FrontendIdpConfig = { export type FrontendIdpConfig = {
authority: string, authority: string;
clientId: string, clientId: string;
scope: string, scope: string;
responseType: string responseType: string;
}; };
export type Role = "student" | "teacher"; export type Role = "student" | "teacher";
export type UserManagersForRoles = {student: UserManager, teacher: UserManager}; export type UserManagersForRoles = { student: UserManager; teacher: UserManager };

View file

@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import {useRouter} from "vue-router"; import { useRouter } from "vue-router";
import {onMounted} from "vue"; import { onMounted } from "vue";
import auth from "../services/auth/auth-service.ts" import auth from "../services/auth/auth-service.ts";
const router = useRouter(); const router = useRouter();
@ -19,6 +19,4 @@
<p>Logging you in...</p> <p>Logging you in...</p>
</template> </template>
<style scoped> <style scoped></style>
</style>

View file

@ -1,12 +1,12 @@
<script setup lang="ts"> <script setup lang="ts">
import auth from "@/services/auth/auth-service.ts"; import auth from "@/services/auth/auth-service.ts";
import apiClient from "@/services/api-client.ts"; import apiClient from "@/services/api-client.ts";
import {ref} from "vue"; import { ref } from "vue";
const testResponse = ref(null); const testResponse = ref(null);
async function testAuthenticated() { async function testAuthenticated() {
testResponse.value = await apiClient.get("/auth/testAuthenticatedOnly") testResponse.value = await apiClient.get("/auth/testAuthenticatedOnly");
} }
</script> </script>
@ -15,8 +15,10 @@
<!-- TODO Placeholder implementation to test the login - replace by a more beautiful page later --> <!-- TODO Placeholder implementation to test the login - replace by a more beautiful page later -->
<b>Welcome to the dwengo homepage</b> <b>Welcome to the dwengo homepage</b>
<div v-if="auth.isLoggedIn.value"> <div v-if="auth.isLoggedIn.value">
<p>Hello {{auth.authState.user?.profile.name}}!</p> <p>Hello {{ auth.authState.user?.profile.name }}!</p>
<p>Your access token for the backend is: <code>{{auth.authState.user?.access_token}}</code></p> <p>
Your access token for the backend is: <code>{{ auth.authState.user?.access_token }}</code>
</p>
</div> </div>
<v-btn @click="testAuthenticated">Send test request</v-btn> <v-btn @click="testAuthenticated">Send test request</v-btn>

View file

@ -23,7 +23,9 @@
<v-btn @click="loginAsTeacher">Login as teacher</v-btn> <v-btn @click="loginAsTeacher">Login as teacher</v-btn>
</div> </div>
<div v-if="auth.isLoggedIn.value"> <div v-if="auth.isLoggedIn.value">
<p>You are currently logged in as {{ auth.authState.user!.profile.name }} ({{ auth.authState.activeRole }})</p> <p>
You are currently logged in as {{ auth.authState.user!.profile.name }} ({{ auth.authState.activeRole }})
</p>
<v-btn @click="performLogout">Logout</v-btn> <v-btn @click="performLogout">Logout</v-btn>
</div> </div>
</main> </main>

View file

@ -1,7 +1,9 @@
# Testdata in de IDP # Testdata in de IDP
De IDP in `docker-compose.yml` is zo geconfigureerd dat hij automatisch bij het starten een testconfiguratie inlaadt. Deze houdt in: De IDP in `docker-compose.yml` is zo geconfigureerd dat hij automatisch bij het starten een testconfiguratie inlaadt. Deze houdt in:
* Een realm `student` die de IDP voor leerlingen representeert.
* Hierin de gebruiker met username `testleerling1`, wachtwoord `password`. - Een realm `student` die de IDP voor leerlingen representeert.
* Een realm `teacher` die de IDP voor leerkrachten representeert. - Hierin de gebruiker met username `testleerling1`, wachtwoord `password`.
* Hierin de gebruiker met username `testleerkracht1`, wachtwoord `password`. - Een realm `teacher` die de IDP voor leerkrachten representeert.
* De admin-account (in de realm `master`) heeft username `admin` en wachtwoord `admin`. - Hierin de gebruiker met username `testleerkracht1`, wachtwoord `password`.
- De admin-account (in de realm `master`) heeft username `admin` en wachtwoord `admin`.

File diff suppressed because it is too large Load diff

File diff suppressed because it is too large Load diff