added token validation with input fields

2025-06-18 08:48:53 +02:00
parent 34f8fd5490
commit 3dbaf7a01b
10 changed files with 133 additions and 177 deletions
--- a/src/lib/minio.ts
+++ b/src/lib/minio.ts
@@ -6,3 +6,5 @@ import config from '$lib/config';

 /** export const client = new Minio.Client(config.minio); */
 export const client = new Client(config.minio);
+
+export const BUCKET = 'tatort';
--- a/src/lib/server/s3ClientService.ts
+++ b/src/lib/server/s3ClientService.ts
@@ -1,41 +1,4 @@
-import { client } from '$lib/minio';
-
-const BUCKET = 'tatort';
-
-export const getVorgang = ({ params }) => {
-	const prefix = params.vorgang ? `${params.vorgang}/` : '';
-	const stream = client.listObjectsV2('tatort', prefix, false, '');
-	const result = new ReadableStream({
-		start(controller) {
-			stream.on('data', (data) => {
-				if (prefix === '') {
-					if (data.prefix)
-						controller.enqueue(`${JSON.stringify({ ...data, name: data.prefix.slice(0, -1) })}\n`);
-					return;
-				}
-
-				const name = data.name.slice(prefix.length);
-				if (name === 'config.json') return;
-				// zugangscode datei
-				if (name === '__perm__') return;
-
-				controller.enqueue(`${JSON.stringify({ ...data, name, prefix })}\n`);
-			});
-			stream.on('end', () => {
-				controller.close();
-			});
-		},
-		cancel() {
-			stream.destroy();
-		}
-	});
-
-	return new Response(result, {
-		headers: {
-			'content-type': 'text/event-stream'
-		}
-	});
-};
+import { BUCKET, client } from '$lib/minio';


 export const checkIfExactDirectoryExists = (dir: string): Promise<boolean> => {
--- a/src/lib/server/vorgangService.ts
+++ b/src/lib/server/vorgangService.ts
@@ -1,5 +1,5 @@
 import { fail, redirect } from '@sveltejs/kit';
-import { client } from '$lib/minio';
+import { BUCKET, client } from '$lib/minio';
 import { checkIfExactDirectoryExists } from './s3ClientService';

 /**
@@ -7,62 +7,91 @@ import { checkIfExactDirectoryExists } from './s3ClientService';
 * @param request
 * @returns
 */
-export const getVorgangByCaseNumber = async ( request: Request) => {
+export const redirectIfVorgangExists = async (request: Request) => {
 	const data = await request.formData();
-        const caseNumber = data.get('caseNumber');
-        const user_token = data.get('token');
+	const caseId = data.get('case-id');
+	const caseToken = data.get('case-token');

-        if (!caseNumber) {
+	if (!caseId) {
 		return fail(400, {
 			success: false,
-                caseNumber,
+			caseId,
 			error: { message: 'Die Vorgangsnummer darf nicht leer sein.' }
 		});
 	}

-        if (typeof caseNumber === 'string' && !(await checkIfExactDirectoryExists(caseNumber))) {
+	if (typeof caseId === 'string' && !(await checkIfExactDirectoryExists(caseId))) {
 		return fail(400, {
 			success: false,
-                caseNumber,
+			caseId,
 			error: { message: 'Die Vorgangsnummer existiert in dieser Anwendung nicht.' }
 		});
 	}

+	const isTokenValid = await hasValidToken(caseId, caseToken);

-        const token = await getTokenOrNull(caseNumber);
-
-        if (token && token != user_token) {
+	if (!isTokenValid) {
 		return fail(400, {
 			success: false,
-                caseNumber,
-                error: { message: 'Der Token ist falsch.' }
+			caseId,
+			error: { message: 'Der Token ist ungültig.' }
 		});
 	}

-        redirect(303, `/list/${caseNumber}`);
+	redirect(303, `/list/${caseId}`);
+};
+
+export const getVorgangByCaseId = ({ params }) => {
+	const prefix = params.vorgang ? `${params.vorgang}/` : '';
+	const stream = client.listObjectsV2(BUCKET, prefix, false, '');
+	const result = new ReadableStream({
+		start(controller) {
+			stream.on('data', (data) => {
+				if (prefix === '') {
+					if (data.prefix)
+						controller.enqueue(`${JSON.stringify({ ...data, name: data.prefix.slice(0, -1) })}\n`);
+					return;
 				}

+				const name = data.name.slice(prefix.length);
+				if (name === 'config.json') return;
+				// zugangscode datei
+				if (name === '__perm__') return;

-const getTokenOrNull = async (vorgang) => {
-    const code_name = '__perm__';
-    const obj_path = `${vorgang}/${code_name}`;
+				controller.enqueue(`${JSON.stringify({ ...data, name, prefix })}\n`);
+			});
+			stream.on('end', () => {
+				controller.close();
+			});
+		},
+		cancel() {
+			stream.destroy();
+		}
+	});

-    let resp = null;
-    let code_saved = '';
+	return new Response(result, {
+		headers: {
+			'content-type': 'text/event-stream'
+		}
+	});
+};
+
+const hasValidToken = async (caseId: string, caseToken: string) => {
+	const tokenFileName = '__perm__';
+	const objPath = `${caseId}/${tokenFileName}`;

 	try {
-        resp = await client.getObject('tatort', obj_path);
+		if (!caseToken) return false;

-        code_saved = await new Response(resp).text();
+		const res = await client.getObject('tatort', objPath);
+
+		const savedToken = await new Response(res).text();
+
+		return savedToken === caseToken ? true : false;
 	} catch (error) {
 		if (error.name == 'S3Error') {
-            resp = null;
-        }
-    }
-
-    if (resp != null) {
-        return code_saved;
-    } else {
-        return null;
+			console.log(error);
+			return false;
 		}
 	}
+};
--- a/src/routes/(angemeldet)/upload/+page.svelte
+++ b/src/routes/(angemeldet)/upload/+page.svelte
@@ -148,6 +148,7 @@
 		} else {
 			return false;
 		}
+		return true;
 	}

 	// `/(angemeldet)/view` return true or false
--- a/src/routes/(token-based)/list/[vorgang]/+page.svelte
+++ b/src/routes/(token-based)/list/[vorgang]/+page.svelte
@@ -172,7 +172,6 @@
 					>
 						<div class=" flex gap-x-4">
 							<Cube />
-							<button on:click="{() => console.log('test')}">test</button>
 							<div class="min-w-0 flex-auto">
 								{#if data?.user?.admin}
 									<span
--- a/src/routes/(token-based)/list/[vorgang]/[tatort]/+server.ts
+++ b/src/routes/(token-based)/list/[vorgang]/[tatort]/+server.ts
@@ -1,11 +1,11 @@
-import { client } from '$lib/minio';
+import { BUCKET, client } from '$lib/minio';

 export async function DELETE({ request }: { request: Request }) {
 	const url_fragments = request.url.split('/');
 	const item = url_fragments.at(-1);
 	const vorgang = url_fragments.at(-2);

-	await client.removeObject('tatort', `${vorgang}/${item}`);
+	await client.removeObject(BUCKET, `${vorgang}/${item}`);

 	return new Response(null, { status: 204 });
 }
--- a/src/routes/(token-based)/view/+page.server.ts
+++ b/src/routes/(token-based)/view/+page.server.ts
@@ -1,6 +1,6 @@
-import { getVorgangByCaseNumber } from '$lib/server/vorgangService';
+import { redirectIfVorgangExists } from '$lib/server/vorgangService';

 /** @type {import('./$types').Actions} */
 export const actions = {
-	default: async ({request}: {request: Request}) => getVorgangByCaseNumber(request)
+	default: async ({request}: {request: Request}) => redirectIfVorgangExists(request)
 }
--- a/src/routes/(token-based)/view/+page.svelte
+++ b/src/routes/(token-based)/view/+page.svelte
@@ -1,5 +1,7 @@
 <script lang="ts">
+	import BaseInputField from '$lib/components/BaseInputField.svelte';
 	import Button from '$lib/components/Button.svelte';
+	import ArrowRight from '$lib/icons/Arrow-right.svelte';
 	import Exclamation from '$lib/icons/Exclamation.svelte';

 	export let form;
@@ -9,74 +11,30 @@
 	<div class="flex flex-col items-center justify-center w-full">
 		<h1 class="text-xl">Vorgang ansehen</h1>
 	</div>
-
-	<form method="POST">
-		<div class="space-y-12">
-			<div class="border-b border-gray-900/10 pb-12">
-				<!-- <h2 class="text-base font-semibold leading-7 text-gray-900">Profile</h2> -->
-				<p class="mt-8 text-sm leading-6 text-gray-600">
-					Anhand der Vorgangsnummer werden Sie zu den Dateien des Vorgangs weitergeleitet und können
-					sich den Vorgang dann ansehen.
+	<p class="mt-8 mb-8 text-sm leading-6 text-gray-600">
+		Anhand der Vorgangsnummer werden Sie zu den Dateien des Vorgangs weitergeleitet und können sich
+		den Vorgang dann ansehen.
 	</p>
-
-				<div class="mt-10 grid grid-cols-1 gap-x-6 gap-y-8">
-					<div>
-						<label for="caseNumber" class="block text-sm font-medium leading-6 text-gray-900"
-							><span class="flex"
-								>{#if form?.error?.caseNumber}
-									<span class="inline-block mr-1"><Exclamation /></span>
-								{/if} Vorgangs-Nr.</span
-							></label
-						>
-						<div class="mt-2 w-full">
-							<div
-								class="flex w-full rounded-md shadow-sm ring-1 ring-inset ring-gray-300 focus-within:ring-2 focus-within:ring-inset focus-within:ring-indigo-600"
-							>
-								<input
-									value={form?.caseNumber ?? ''}
+	<form method="POST">
+		<BaseInputField
+			id="case-id"
+			name="case-id"
+			label="Vorgangskennung"
 			type="text"
-									name="caseNumber"
-									id="caseNumber"
-									class="block w-full flex-1 border-0 bg-transparent py-1.5 pl-1 text-gray-900 placeholder:text-gray-400 focus:ring-0 sm:text-sm sm:leading-6"
+			value={form?.caseId}
+		/>
+		<div class="mt-5">
+			<BaseInputField
+				id="case-token"
+				name="case-token"
+				label="Zugangscode"
+				type="text"
+				value={form?.token}
+				error={form?.error?.message}
 			/>
 		</div>
-						</div>
-						{#if form?.error?.caseNumber}
-							<p class="block text-sm leading-6 text-red-900 mt-2">{form.error.caseNumber}</p>
-						{/if}
-					</div>
-
-					<div>
-						<label for="token" class="block text-sm font-medium leading-6 text-gray-900"
-							><span class="flex"> Zugangscode</span></label
-						>
-						<div class="mt-2 w-full">
-							<div
-								class="flex w-full rounded-md shadow-sm ring-1 ring-inset ring-gray-300 focus-within:ring-2 focus-within:ring-inset focus-within:ring-indigo-600"
-							>
-								<input
-									value={false || ''}
-									placeholder="optional"
-									type="text"
-									name="token"
-									id="token"
-									class="block w-full flex-1 border-0 bg-transparent py-1.5 pl-1 text-gray-900 placeholder:text-gray-400 focus:ring-0 sm:text-sm sm:leading-6"
-								/>
-							</div>
-						</div>
-						{#if form?.error?.token}
-							<p class="block text-sm leading-6 text-red-900 mt-2">{form.error.token}</p>
-						{/if}
-					</div>
-				</div>
-			</div>
-			<div class="mt-6 flex items-center justify-end gap-x-6">
-				<Button
-					type="submit"
-					class="rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
-					>Weiter</Button
-				>
-			</div>
+		<div class="flex justify-end pt-4">
+			<Button type="submit"><ArrowRight /></Button>
 		</div>
 	</form>
 </div>
--- a/src/routes/anmeldung/+page.server.ts
+++ b/src/routes/anmeldung/+page.server.ts
@@ -1,9 +1,9 @@
 import { loginUser, logoutUser } from '$lib/server/authService';
-import { getVorgangByCaseNumber } from '$lib/server/vorgangService.js';
+import { redirectIfVorgangExists } from '$lib/server/vorgangService.js';


 export const actions = {
 	login: ({ request, cookies }) => loginUser({request, cookies}),
 	logout: (event) => logoutUser(event),
-	getVorgang: ({request}) => getVorgangByCaseNumber(request)
+	redirectToVorgang: ({request}) => redirectIfVorgangExists(request)
 } as const;
--- a/src/routes/anmeldung/+page.svelte
+++ b/src/routes/anmeldung/+page.svelte
@@ -24,21 +24,29 @@
 	<div class="w-full max-w-sm mx-auto">
 		<div class="relative mt-5 bg-gray-50 rounded-xl shadow-xl p-3 pt-1">
 			<div class="mt-10">
-				<form action="?/getVorgang" method="POST">
+				<form action="?/redirectToVorgang" method="POST">
 					<BaseInputField
-						id="caseNumber"
-						name="caseNumber"
-						label="Vorgangs-Nr."
+						id="case-id"
+						name="case-id"
+						label="Vorgangskennung"
 						type="text"
-						value={form?.caseNumber}
+						value={form?.caseId}
+					/>
+					<div class="mt-5">
+						<BaseInputField
+							id="case-token"
+							name="case-token"
+							label="Zugangscode"
+							type="text"
+							value={form?.token}
 							error={form?.error?.message}
 						/>
+					</div>
 					<div class="flex justify-end pt-4">
 						<Button type="submit"><ArrowRight /></Button>
 					</div>
 				</form>
 			</div>
-
 		</div>
 		<div class="flex justify-end mt-10 px-3">
 			<Button on:click={() => (open = true)}><Login /></Button>
@@ -80,11 +88,7 @@
 			</div>

 			<div class="flex justify-end">
-				<Button
-					type="submit"
-					class="mt-5"
-					>Anmelden</Button
-				>
+				<Button type="submit" class="mt-5">Anmelden</Button>
 			</div>
 		</form>
 	</ModalContent>