feat: add authentication test page and API testing scripts; implement debug auth endpoint and enhance task route with read permissions
This commit is contained in:
142
public/test-auth.html
Normal file
142
public/test-auth.html
Normal file
@@ -0,0 +1,142 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Authentication Test Page</title>
|
||||
<style>
|
||||
body { font-family: Arial, sans-serif; margin: 20px; }
|
||||
.test-section { margin: 20px 0; padding: 20px; border: 1px solid #ccc; border-radius: 5px; }
|
||||
.result { margin: 10px 0; padding: 10px; border-radius: 3px; }
|
||||
.success { background-color: #d4edda; border: 1px solid #c3e6cb; color: #155724; }
|
||||
.error { background-color: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; }
|
||||
.info { background-color: #d1ecf1; border: 1px solid #bee5eb; color: #0c5460; }
|
||||
button { padding: 10px 20px; margin: 5px; cursor: pointer; }
|
||||
pre { background: #f8f9fa; padding: 10px; border-radius: 3px; overflow-x: auto; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Authentication & API Test Page</h1>
|
||||
|
||||
<div class="test-section">
|
||||
<h2>Authentication Status</h2>
|
||||
<button onclick="checkAuthStatus()">Check Authentication Status</button>
|
||||
<div id="authStatus"></div>
|
||||
</div>
|
||||
|
||||
<div class="test-section">
|
||||
<h2>API Endpoint Tests</h2>
|
||||
<button onclick="testAllEndpoints()">Test All API Endpoints</button>
|
||||
<div id="apiResults"></div>
|
||||
</div>
|
||||
|
||||
<div class="test-section">
|
||||
<h2>Manual Login Instructions</h2>
|
||||
<div class="info">
|
||||
<p><strong>Test Credentials:</strong></p>
|
||||
<p>Email: <code>admin@localhost.com</code></p>
|
||||
<p>Password: <code>admin123456</code></p>
|
||||
<p><a href="/auth/signin" target="_blank">Open Sign-in Page</a></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
async function checkAuthStatus() {
|
||||
const statusDiv = document.getElementById('authStatus');
|
||||
statusDiv.innerHTML = '<div class="info">Checking authentication status...</div>';
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/auth/session');
|
||||
const session = await response.json();
|
||||
|
||||
if (session && session.user) {
|
||||
statusDiv.innerHTML = `
|
||||
<div class="success">
|
||||
<h3>✅ Authenticated</h3>
|
||||
<pre>${JSON.stringify(session, null, 2)}</pre>
|
||||
</div>
|
||||
`;
|
||||
} else {
|
||||
statusDiv.innerHTML = `
|
||||
<div class="error">
|
||||
<h3>❌ Not Authenticated</h3>
|
||||
<p>Please <a href="/auth/signin">sign in</a> first.</p>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
} catch (error) {
|
||||
statusDiv.innerHTML = `
|
||||
<div class="error">
|
||||
<h3>❌ Error checking authentication</h3>
|
||||
<p>${error.message}</p>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
async function testAllEndpoints() {
|
||||
const resultsDiv = document.getElementById('apiResults');
|
||||
resultsDiv.innerHTML = '<div class="info">Testing API endpoints...</div>';
|
||||
|
||||
const endpoints = [
|
||||
{ url: '/api/debug-auth', method: 'GET', name: 'Debug Auth' },
|
||||
{ url: '/api/projects', method: 'GET', name: 'Projects' },
|
||||
{ url: '/api/contracts', method: 'GET', name: 'Contracts' },
|
||||
{ url: '/api/tasks', method: 'GET', name: 'Tasks' },
|
||||
{ url: '/api/tasks/templates', method: 'GET', name: 'Task Templates' },
|
||||
{ url: '/api/project-tasks', method: 'GET', name: 'Project Tasks' }
|
||||
];
|
||||
|
||||
let results = '';
|
||||
|
||||
for (const endpoint of endpoints) {
|
||||
try {
|
||||
const response = await fetch(endpoint.url, {
|
||||
method: endpoint.method,
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
const count = Array.isArray(data) ? data.length : 'object';
|
||||
results += `
|
||||
<div class="success">
|
||||
<strong>✅ ${endpoint.name}</strong> (${endpoint.method} ${endpoint.url})
|
||||
<br>Status: ${response.status} | Data: ${count} items
|
||||
</div>
|
||||
`;
|
||||
} else if (response.status === 401) {
|
||||
results += `
|
||||
<div class="error">
|
||||
<strong>🔒 ${endpoint.name}</strong> (${endpoint.method} ${endpoint.url})
|
||||
<br>Status: ${response.status} - Unauthorized (Please sign in)
|
||||
</div>
|
||||
`;
|
||||
} else {
|
||||
results += `
|
||||
<div class="error">
|
||||
<strong>❌ ${endpoint.name}</strong> (${endpoint.method} ${endpoint.url})
|
||||
<br>Status: ${response.status} - ${response.statusText}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
} catch (error) {
|
||||
results += `
|
||||
<div class="error">
|
||||
<strong>💥 ${endpoint.name}</strong> (${endpoint.method} ${endpoint.url})
|
||||
<br>Error: ${error.message}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
resultsDiv.innerHTML = results;
|
||||
}
|
||||
|
||||
// Auto-check authentication status on page load
|
||||
window.addEventListener('load', checkAuthStatus);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user