LinkDesk/frontend/clear-auth-and-reload.html

125 lines
3.5 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>Clear Auth & Reload</title>
<style>
body {
font-family: Arial, sans-serif;
max-width: 600px;
margin: 50px auto;
padding: 20px;
}
button {
background: #007bff;
color: white;
border: none;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
border-radius: 4px;
margin: 10px 5px;
}
button:hover {
background: #0056b3;
}
.danger {
background: #dc3545;
}
.danger:hover {
background: #c82333;
}
.success {
background: #28a745;
}
.success:hover {
background: #218838;
}
.info {
background: #f8f9fa;
border: 1px solid #dee2e6;
padding: 15px;
margin: 20px 0;
border-radius: 4px;
}
pre {
background: #f4f4f4;
padding: 10px;
border-radius: 4px;
overflow-x: auto;
}
</style>
</head>
<body>
<h1>🔧 Fix Shot Detail 403 Error</h1>
<div class="info">
<h3>Current Issue:</h3>
<p>You're getting 403 errors when clicking on shots, even though you're logged in as admin.</p>
<p><strong>Solution:</strong> Clear your authentication tokens and login again.</p>
</div>
<h2>Step 1: Check Current Auth State</h2>
<button onclick="checkAuth()">Check Auth</button>
<pre id="authState"></pre>
<h2>Step 2: Clear All Auth Data</h2>
<button class="danger" onclick="clearAuth()">Clear Auth Tokens</button>
<pre id="clearResult"></pre>
<h2>Step 3: Reload Application</h2>
<button class="success" onclick="reloadApp()">Reload & Login Again</button>
<script>
function checkAuth() {
const authState = {
token: localStorage.getItem('token'),
refreshToken: localStorage.getItem('refreshToken'),
user: localStorage.getItem('user')
};
document.getElementById('authState').textContent = JSON.stringify(authState, null, 2);
if (authState.user) {
try {
const user = JSON.parse(authState.user);
console.log('User data:', user);
} catch (e) {
console.error('Failed to parse user data:', e);
}
}
}
function clearAuth() {
// Clear all auth-related items
const keysToRemove = [
'token',
'refreshToken',
'user',
'access_token',
'refresh_token'
];
keysToRemove.forEach(key => {
localStorage.removeItem(key);
sessionStorage.removeItem(key);
});
document.getElementById('clearResult').textContent = '✓ All auth tokens cleared!\n\nCleared items:\n' + keysToRemove.join('\n');
}
function reloadApp() {
// Clear auth first
clearAuth();
// Redirect to login page
setTimeout(() => {
window.location.href = 'http://localhost:5173/login';
}, 500);
}
// Auto-check on load
window.onload = checkAuth;
</script>
</body>
</html>