添加数据库集成和用户认证功能
- 新增用户注册和登录系统 (login.html, register.html) - 集成Supabase数据库连接 (config.js, api.js) - 完善数据库架构设计 (database-schema.sql) - 添加部署指南和配置文档 (DEPLOYMENT_GUIDE.md) - 修复主页面结构和功能完善 (index.html) - 支持通话记录保存到数据库 - 完整的账单管理和用户认证流程 - 集成OpenAI、Twilio、Stripe等API服务
This commit is contained in:
@@ -0,0 +1,223 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Supabase 连接测试</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.container {
|
||||
background: white;
|
||||
padding: 30px;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
|
||||
}
|
||||
.status {
|
||||
padding: 15px;
|
||||
margin: 10px 0;
|
||||
border-radius: 5px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.success {
|
||||
background-color: #d4edda;
|
||||
color: #155724;
|
||||
border: 1px solid #c3e6cb;
|
||||
}
|
||||
.error {
|
||||
background-color: #f8d7da;
|
||||
color: #721c24;
|
||||
border: 1px solid #f5c6cb;
|
||||
}
|
||||
.info {
|
||||
background-color: #d1ecf1;
|
||||
color: #0c5460;
|
||||
border: 1px solid #bee5eb;
|
||||
}
|
||||
button {
|
||||
background-color: #007bff;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
}
|
||||
button:hover {
|
||||
background-color: #0056b3;
|
||||
}
|
||||
.loading {
|
||||
display: none;
|
||||
}
|
||||
pre {
|
||||
background-color: #f8f9fa;
|
||||
padding: 15px;
|
||||
border-radius: 5px;
|
||||
overflow-x: auto;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<h1>🔧 Supabase 连接测试</h1>
|
||||
|
||||
<div class="info">
|
||||
<strong>说明：</strong> 这个页面用于测试 Supabase 数据库连接是否正常。
|
||||
</div>
|
||||
|
||||
<h2>当前配置</h2>
|
||||
<div id="currentConfig"></div>
|
||||
|
||||
<h2>连接测试</h2>
|
||||
<button onclick="testConnection()" id="testBtn">测试连接</button>
|
||||
<div class="loading" id="loading">正在测试连接...</div>
|
||||
|
||||
<div id="result"></div>
|
||||
|
||||
<h2>数据库表检查</h2>
|
||||
<button onclick="checkTables()" id="tablesBtn">检查数据库表</button>
|
||||
<div id="tablesResult"></div>
|
||||
|
||||
<h2>解决方案</h2>
|
||||
<div class="info">
|
||||
<p><strong>如果连接失败，请按以下步骤操作：</strong></p>
|
||||
<ol>
|
||||
<li>访问 <a href="https://supabase.com/dashboard/project/poxwjzdianersitpnvdy" target="_blank">Supabase 控制台</a></li>
|
||||
<li>进入 Settings → API</li>
|
||||
<li>复制 "anon public" 密钥</li>
|
||||
<li>更新 config.js 文件中的 ANON_KEY</li>
|
||||
<li>刷新页面重新测试</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 引入 Supabase 客户端 -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/@supabase/supabase-js@2"></script>
|
||||
<script src="config.js"></script>
|
||||
|
||||
<script>
|
||||
// 显示当前配置
|
||||
document.getElementById('currentConfig').innerHTML = `
|
||||
<pre>
|
||||
URL: ${CONFIG.SUPABASE.URL}
|
||||
ANON_KEY: ${CONFIG.SUPABASE.ANON_KEY.substring(0, 50)}...
|
||||
</pre>
|
||||
`;
|
||||
|
||||
let supabase;
|
||||
|
||||
async function testConnection() {
|
||||
const resultDiv = document.getElementById('result');
|
||||
const testBtn = document.getElementById('testBtn');
|
||||
const loading = document.getElementById('loading');
|
||||
|
||||
testBtn.disabled = true;
|
||||
loading.style.display = 'block';
|
||||
resultDiv.innerHTML = '';
|
||||
|
||||
try {
|
||||
// 创建 Supabase 客户端
|
||||
const { createClient } = supabase;
|
||||
supabase = createClient(CONFIG.SUPABASE.URL, CONFIG.SUPABASE.ANON_KEY);
|
||||
|
||||
// 测试连接
|
||||
const { data, error } = await supabase.auth.getSession();
|
||||
|
||||
if (error) {
|
||||
throw error;
|
||||
}
|
||||
|
||||
resultDiv.innerHTML = `
|
||||
<div class="success">
|
||||
✅ 连接成功！API 密钥有效。
|
||||
</div>
|
||||
<pre>响应数据: ${JSON.stringify(data, null, 2)}</pre>
|
||||
`;
|
||||
|
||||
} catch (error) {
|
||||
resultDiv.innerHTML = `
|
||||
<div class="error">
|
||||
❌ 连接失败: ${error.message}
|
||||
</div>
|
||||
<pre>错误详情: ${JSON.stringify(error, null, 2)}</pre>
|
||||
`;
|
||||
} finally {
|
||||
testBtn.disabled = false;
|
||||
loading.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
async function checkTables() {
|
||||
const resultDiv = document.getElementById('tablesResult');
|
||||
const tablesBtn = document.getElementById('tablesBtn');
|
||||
|
||||
if (!supabase) {
|
||||
resultDiv.innerHTML = `
|
||||
<div class="error">
|
||||
❌ 请先测试连接！
|
||||
</div>
|
||||
`;
|
||||
return;
|
||||
}
|
||||
|
||||
tablesBtn.disabled = true;
|
||||
resultDiv.innerHTML = '<div class="info">正在检查数据库表...</div>';
|
||||
|
||||
try {
|
||||
// 尝试查询系统设置表
|
||||
const { data, error } = await supabase
|
||||
.from('system_settings')
|
||||
.select('*')
|
||||
.limit(5);
|
||||
|
||||
if (error) {
|
||||
throw error;
|
||||
}
|
||||
|
||||
resultDiv.innerHTML = `
|
||||
<div class="success">
|
||||
✅ 数据库表访问正常！找到 ${data.length} 条系统设置记录。
|
||||
</div>
|
||||
<pre>示例数据: ${JSON.stringify(data, null, 2)}</pre>
|
||||
`;
|
||||
|
||||
} catch (error) {
|
||||
if (error.message.includes('relation "system_settings" does not exist')) {
|
||||
resultDiv.innerHTML = `
|
||||
<div class="error">
|
||||
❌ 数据库表不存在！请先执行数据库初始化脚本。
|
||||
</div>
|
||||
<div class="info">
|
||||
<p><strong>解决方案：</strong></p>
|
||||
<ol>
|
||||
<li>访问 <a href="https://supabase.com/dashboard/project/poxwjzdianersitpnvdy" target="_blank">Supabase SQL Editor</a></li>
|
||||
<li>执行 database-init.sql 脚本</li>
|
||||
<li>重新测试</li>
|
||||
</ol>
|
||||
</div>
|
||||
`;
|
||||
} else {
|
||||
resultDiv.innerHTML = `
|
||||
<div class="error">
|
||||
❌ 数据库访问失败: ${error.message}
|
||||
</div>
|
||||
<pre>错误详情: ${JSON.stringify(error, null, 2)}</pre>
|
||||
`;
|
||||
}
|
||||
} finally {
|
||||
tablesBtn.disabled = false;
|
||||
}
|
||||
}
|
||||
|
||||
// 页面加载时自动测试连接
|
||||
window.addEventListener('load', () => {
|
||||
setTimeout(testConnection, 1000);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user