frontend: add login page and auth guard

Add authentication flow to the frontend:
- authStore with token management (localStorage persistence)
- Login page with username/password form at /login
- Layout-level auth guard that redirects to /login when no valid
  session exists, validates token on load via GET /api/auth/me
- Top navigation bar showing username and admin link when applicable

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/routes/Cover.svelte

@@ -25,7 +25,6 @@
 		streamStore.CertHash = streamData.CertHash;
 		streamStore.Width = streamData.Width;
 		streamStore.Height = streamData.Height;
-		streamStore.StreamToken = streamData.StreamToken;
 
 		console.log(`Stream data retrieved. Navigating to /stream.`);
 		await goto('/stream');

frontend/src/routes/apps.ts

@@ -1,5 +1,3 @@
-import { getToken, handleUnauthorized } from './stores/authStore.svelte';
-
 export interface App {
   title: string;
   id: number;
@@ -14,15 +12,7 @@ export interface AppsResponse {
 
 export async function fetchApps() {
   console.log('Getting apps');
-  const response = await fetch('/api/apps', {
+  const response = await fetch('/api/apps');
-    headers: { 'Authorization': `Bearer ${getToken()}` }
-  });
-
-  if (response.status === 401) {
-    handleUnauthorized();
-    throw new Error('Unauthorized');
-  }
-
   console.log(response);
   const data = (await response.json()) as AppsResponse;
   console.log(data);

frontend/src/routes/getStreamData.ts

@@ -1,11 +1,8 @@
-import { getToken, handleUnauthorized } from './stores/authStore.svelte';
-
 type StreamData = {
   Url: string,
   CertHash: Array<number>,
   Width: number,
   Height: number,
-  StreamToken: string,
 }
 
 export async function getStreamData(appId: number, server_name: string): Promise<StreamData> {
@@ -37,16 +34,10 @@ export async function getStreamData(appId: number, server_name: string): Promise
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',
-        'Authorization': `Bearer ${getToken()}`,
       },
       body: JSON.stringify(payload)
     });
 
-    if (response.status === 401) {
-      handleUnauthorized();
-      throw new Error('Unauthorized');
-    }
-
     if (!response.ok) {
       throw new Error(`HTTP error! status: ${response.status}: ${await response.text()}`);
     }
@@ -54,17 +45,15 @@ export async function getStreamData(appId: number, server_name: string): Promise
     const streamDataResp = await response.json();
     console.log('Stream started:', streamDataResp);
 
-    let streamData: StreamData = {
+    let streamData: StreamData = { Url: streamDataResp.url, CertHash: streamDataResp.cert_hash, Width: width, Height: height };
-      Url: streamDataResp.url,
-      CertHash: streamDataResp.cert_hash,
-      Width: width,
-      Height: height,
-      StreamToken: streamDataResp.stream_token,
-    };
     return streamData;
 
+
   } catch (error) {
     console.error('Error getting stream data: ', error);
     throw new Error('Failed to start stream: ' + error);
   }
 }
+
+
+

frontend/src/routes/stores/streamStore.svelte.ts

@@ -3,5 +3,4 @@ export const streamStore = $state({
   CertHash: [0],
   Width: 0,
   Height: 0,
-  StreamToken: '',
 });

frontend/src/routes/stream/+page.svelte

@@ -6,7 +6,6 @@
 	$: certHash = streamStore.CertHash;
 	$: width = streamStore.Width;
 	$: height = streamStore.Height;
-	$: streamToken = streamStore.StreamToken;
 </script>
 
 <svelte:head>
@@ -14,7 +13,9 @@
 	<meta name="description" content="Streaming game" />
 </svelte:head>
 
-<Stream {url} {certHash} {width} {height} {streamToken} />
+<!--<section>
+</section>-->
+<Stream {url} {certHash} {width} {height} />
 
 <style>
 	section {

frontend/src/routes/stream/Stream.svelte

@@ -8,20 +8,17 @@
 		certHash: Array<number>;
 		width: number;
 		height: number;
-		streamToken: string;
 	}
 
-	let { url, certHash, width, height, streamToken }: Props = $props();
+	let { url, certHash, width, height }: Props = $props();
 	let loading = $state(true);
 	let fullscreen = $state(false);
 	let gameplayView: HTMLDivElement;
 	let gameplayCanvas: HTMLCanvasElement;
 
 	async function startStream() {
-		// Append stream token to URL for proxy authentication
-		const authenticatedUrl = url + (url.includes('?') ? '&' : '?') + 'token=' + encodeURIComponent(streamToken);
 		await startWebtransportStream(
-			authenticatedUrl,
+			url,
 			certHash,
 			width,
 			height,

gamestream-webtransport-proxy/src/apps.rs

@@ -47,7 +47,16 @@ struct GetAppsResponse {
 impl crate::backend::Backend {
     #[craft(endpoint(status_codes(StatusCode::OK, StatusCode::INTERNAL_SERVER_ERROR)))]
     pub async fn get_apps(self: ::std::sync::Arc<Self>, depot: &mut Depot) -> AppResult<Json<GetAppsResponse>> {
-        let user = auth::get_user_from_depot(depot).cloned();
+        let user = match auth::get_user_from_depot(depot) {
+            Some(u) => u.clone(),
+            None => {
+                error!("get_apps reached without authenticated user in depot");
+                return Err(AppError {
+                    status_code: StatusCode::UNAUTHORIZED,
+                    description: "Not authenticated".to_string(),
+                });
+            }
+        };
         let standard_error = Err(AppError {
             status_code: StatusCode::INTERNAL_SERVER_ERROR,
             description: "failed to get available apps".to_string(),
@@ -146,18 +155,16 @@ impl crate::backend::Backend {
         }
 
         // Filter apps by user permissions (admins see everything)
-        if let Some(ref user) = user {
+        if !user.is_admin {
-            if !user.is_admin {
+            let permissions = self.db.get_permissions(&user.id).unwrap_or_default();
-                let permissions = self.db.get_permissions(&user.id).unwrap_or_default();
+            for (server_name, apps) in get_apps_resp.apps.iter_mut() {
-                for (server_name, apps) in get_apps_resp.apps.iter_mut() {
+                apps.retain(|app| {
-                    apps.retain(|app| {
+                    permissions.iter().any(|p| {
-                        permissions.iter().any(|p| {
+                        p.server == *server_name && p.app_id == app.id as i64
-                            p.server == *server_name && p.app_id == app.id as i64
+                    })
-                        })
+                });
-                    });
-                }
-                get_apps_resp.apps.retain(|_, apps| !apps.is_empty());
             }
+            get_apps_resp.apps.retain(|_, apps| !apps.is_empty());
         }
 
         Ok(Json(get_apps_resp))

gamestream-webtransport-proxy/src/proxy/handler.rs

@@ -85,31 +85,17 @@ impl crate::proxy::Proxy {
             description: "Could not start stream".to_string(),
         });
 
-        // Validate single-use stream token
+        // Validate single-use stream token via the shared helper so this
+        // handler and its unit tests exercise the same code path.
         let provided_token = req.query::<String>("token").unwrap_or_default();
-        {
+        if let Err(msg) = super::validate_stream_token(&self, &provided_token).await {
-            let mut token_guard = self.stream_token.write().await;
+            error!("Stream token validation failed: {msg}");
-            match token_guard.take() {
+            return Err(AppError {
-                Some(expected) if expected == provided_token => {
+                status_code: StatusCode::UNAUTHORIZED,
-                    // Token consumed successfully (single-use)
+                description: msg,
-                    info!("Stream token validated and consumed");
+            });
-                }
-                Some(_) => {
-                    error!("Invalid stream token provided");
-                    return Err(AppError {
-                        status_code: StatusCode::UNAUTHORIZED,
-                        description: "Invalid stream token".to_string(),
-                    });
-                }
-                None => {
-                    error!("Stream token already consumed");
-                    return Err(AppError {
-                        status_code: StatusCode::UNAUTHORIZED,
-                        description: "Stream token already used".to_string(),
-                    });
-                }
-            }
         }
+        info!("Stream token validated and consumed");
 
         info!("WebTransport connection initiated");
         let (wt_stream_send, wt_stream_recv, wt_datagram_send) = match setup_webtransport(req).await

gamestream-webtransport-proxy/src/proxy/mod.rs

@@ -85,8 +85,9 @@ pub async fn validate_stream_token(proxy: &Proxy, provided: &str) -> std::result
     match token_guard.take() {
         Some(expected) if expected == provided => Ok(()),
         Some(_) => {
-            // Put the token back since it wasn't matched
+            // Wrong token: still consumed by the `take()` above. Any validation
-            // Actually no — the design is that any attempt consumes it for security
+            // attempt — correct or not — invalidates the token, so a wrong
+            // guess cannot be followed by a correct one.
             Err("Invalid stream token".to_string())
         }
         None => Err("Stream token already used".to_string()),

gamestream-webtransport-proxy/src/stream.rs

@@ -90,20 +90,28 @@ impl crate::backend::Backend {
         });
 
         // Check app permission
-        if let Some(user) = auth::get_user_from_depot(depot) {
+        let user = match auth::get_user_from_depot(depot) {
-            if !user.is_admin {
+            Some(u) => u.clone(),
-                match self.db.check_app_permission(&user.id, &body.server, body.id as i64) {
+            None => {
-                    Ok(true) => {}
+                error!("post_stream_start reached without authenticated user in depot");
-                    Ok(false) => {
+                return Err(AppError {
-                        return Err(AppError {
+                    status_code: StatusCode::UNAUTHORIZED,
-                            status_code: StatusCode::FORBIDDEN,
+                    description: "Not authenticated".to_string(),
-                            description: "You do not have permission to access this application".to_string(),
+                });
-                        });
+            }
-                    }
+        };
-                    Err(e) => {
+        if !user.is_admin {
-                        error!("Permission check error: {e}");
+            match self.db.check_app_permission(&user.id, &body.server, body.id as i64) {
-                        return standard_error;
+                Ok(true) => {}
-                    }
+                Ok(false) => {
+                    return Err(AppError {
+                        status_code: StatusCode::FORBIDDEN,
+                        description: "You do not have permission to access this application".to_string(),
+                    });
+                }
+                Err(e) => {
+                    error!("Permission check error: {e}");
+                    return standard_error;
                 }
             }
         }