Auto-logout users when page is closed

- Create LogoutOnUnload component that triggers logout on page close
- Uses beforeunload/unload events with navigator.sendBeacon() for reliability
- Create /api/logout endpoint that clears both admin and customer sessions
- Add LogoutOnUnload to root layout so it runs on all pages
- Works for both admin and customer users

Behavior:
- When user closes browser tab/window, logout happens automatically
- Session cookies are cleared via API endpoint
- Improves security by preventing session hijacking from closed windows

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
Andymick
2026-07-17 22:31:40 +01:00
co-authored by Claude Haiku 4.5
parent a2908e8ae1
commit 3aa2b730bc
3 changed files with 43 additions and 0 deletions
+27
View File
@@ -0,0 +1,27 @@
'use client';
import { useEffect } from 'react';
/**
* Logs out the user when they close/leave the page
* Works for both admin and customer sessions
*/
export default function LogoutOnUnload() {
useEffect(() => {
const handleUnload = () => {
// Use sendBeacon to reliably send logout even when page is closing
// This doesn't wait for a response, which is fine for logout
navigator.sendBeacon('/api/logout');
};
window.addEventListener('beforeunload', handleUnload);
window.addEventListener('unload', handleUnload);
return () => {
window.removeEventListener('beforeunload', handleUnload);
window.removeEventListener('unload', handleUnload);
};
}, []);
return null;
}