120 lines
3.2 KiB
Plaintext
120 lines
3.2 KiB
Plaintext
---
|
|
// src/pages/auth/callback.astro
|
|
---
|
|
|
|
<html>
|
|
<head>
|
|
<title>Processing Authentication...</title>
|
|
<style>
|
|
body {
|
|
font-family: system-ui, -apple-system, sans-serif;
|
|
background: var(--color-bg, #ffffff);
|
|
color: var(--color-text, #000000);
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.container {
|
|
text-align: center;
|
|
padding: 4rem 2rem;
|
|
max-width: 500px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.spinner {
|
|
width: 40px;
|
|
height: 40px;
|
|
border: 4px solid #f3f3f3;
|
|
border-top: 4px solid #3498db;
|
|
border-radius: 50%;
|
|
animation: spin 1s linear infinite;
|
|
margin: 0 auto 1rem;
|
|
}
|
|
|
|
@keyframes spin {
|
|
0% { transform: rotate(0deg); }
|
|
100% { transform: rotate(360deg); }
|
|
}
|
|
|
|
.error {
|
|
color: #e74c3c;
|
|
background: #fdf2f2;
|
|
padding: 1rem;
|
|
border-radius: 0.5rem;
|
|
border: 1px solid #e74c3c;
|
|
margin-top: 1rem;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<div class="spinner"></div>
|
|
<h2>Processing authentication...</h2>
|
|
<p>Please wait while we complete your login.</p>
|
|
<div id="error-message" class="hidden error"></div>
|
|
</div>
|
|
|
|
<script>
|
|
(function() {
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
const code = urlParams.get('code');
|
|
const state = urlParams.get('state');
|
|
const error = urlParams.get('error');
|
|
|
|
console.log('Client-side callback params:', { code: !!code, state: !!state, error });
|
|
|
|
const errorDiv = document.getElementById('error-message') as HTMLElement;
|
|
|
|
if (error) {
|
|
if (errorDiv) {
|
|
errorDiv.textContent = `Authentication error: ${error}`;
|
|
errorDiv.style.display = 'block';
|
|
}
|
|
setTimeout(() => {
|
|
window.location.href = '/?auth=error';
|
|
}, 3000);
|
|
} else if (code && state) {
|
|
fetch('/api/auth/process', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
body: JSON.stringify({ code, state })
|
|
})
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error(`HTTP ${response.status}`);
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(data => {
|
|
if (data.success) {
|
|
window.location.href = data.redirectTo || '/';
|
|
} else {
|
|
throw new Error(data.error || 'Authentication failed');
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Authentication processing failed:', error);
|
|
if (errorDiv) {
|
|
errorDiv.textContent = `Authentication failed: ${error.message}`;
|
|
errorDiv.style.display = 'block';
|
|
}
|
|
setTimeout(() => {
|
|
window.location.href = '/?auth=error';
|
|
}, 3000);
|
|
});
|
|
} else {
|
|
console.error('Missing code or state parameters');
|
|
if (errorDiv) {
|
|
errorDiv.textContent = 'Missing authentication parameters';
|
|
errorDiv.style.display = 'block';
|
|
}
|
|
setTimeout(() => {
|
|
window.location.href = '/?auth=error';
|
|
}, 3000);
|
|
}
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html> |