175 lines
4.2 KiB
Markdown
175 lines
4.2 KiB
Markdown
# SiliconFlow API Key 验证器
|
||
|
||
这是一个全栈应用程序,用于验证和管理 SiliconFlow API Key,实时监控账户余额状态。
|
||
|
||
## ✨ 功能特性
|
||
|
||
- 🔐 **API Key 管理**: 安全地存储和管理多个API Key
|
||
- ✅ **实时验证**: 批量或单独验证API Key有效性
|
||
- 💰 **余额监控**: 查看实时余额信息
|
||
- 📊 **统计面板**: 一目了然的账户状态统计
|
||
- 🎨 **现代界面**: 美观易用的用户界面
|
||
- 🔒 **数据安全**: 本地数据库存储,确保数据私密性
|
||
|
||
## 🚀 快速开始
|
||
|
||
### 1️⃣ 克隆和安装依赖
|
||
|
||
```bash
|
||
# 克隆仓库
|
||
git clone [your-repo-url]
|
||
cd siliconflow-api-key-validator
|
||
|
||
# 安装后端依赖
|
||
npm install
|
||
|
||
# 安装前端依赖
|
||
cd frontend
|
||
npm install
|
||
cd ..
|
||
```
|
||
|
||
### 2️⃣ 数据库初始化
|
||
|
||
```bash
|
||
# 创建数据库
|
||
npx prisma generate
|
||
npx prisma migrate dev --name init
|
||
```
|
||
|
||
### 3️⃣ 启动应用
|
||
|
||
#### 开发模式
|
||
|
||
```bash
|
||
# 同时启动后端和前端开发服务器
|
||
npm run dev
|
||
|
||
# 或者分别启动
|
||
npm run server:dev # 后端 (端口3000)
|
||
cd frontend && npm run dev # 前端 (端口3001)
|
||
```
|
||
|
||
#### 生产模式
|
||
|
||
```bash
|
||
# 构建
|
||
npm run build
|
||
|
||
# 启动生产服务器
|
||
npm start
|
||
```
|
||
|
||
## 🌐 访问应用
|
||
|
||
- **首页**: http://localhost:3001
|
||
- **API 地址**: http://localhost:3000/api
|
||
- **健康检查**: http://localhost:3000/health
|
||
|
||
## 📋 API 端点
|
||
|
||
### API Keys 管理
|
||
|
||
- `GET /api/api-keys` - 获取所有API Key
|
||
- `POST /api/api-keys` - 添加新API Key
|
||
- `POST /api/api-keys/:id/validate` - 验证单个API Key
|
||
- `POST /api/api-keys/validate-all` - 批量验证所有API Key
|
||
- `DELETE /api/api-keys/:id` - 删除API Key
|
||
|
||
## 🛠️ 技术栈
|
||
|
||
### 后端
|
||
- **Node.js** + **Express**
|
||
- **TypeScript** - 类型安全
|
||
- **Prisma** - 数据库ORM
|
||
- **SQLite** - 轻量级数据库
|
||
- **Axios** - HTTP客户端
|
||
- **CORS** + **Helmet** + **Compression** - 安全与性能优化
|
||
|
||
### 前端
|
||
- **React 18** + **TypeScript**
|
||
- **Vite** - 现代构建工具
|
||
- **TailwindCSS** - 样式框架
|
||
- **Axios** - HTTP客户端
|
||
- **Lucide React** - 图标库
|
||
|
||
## 📁 项目结构
|
||
|
||
```
|
||
siliconflow-api-key-validator/
|
||
├── src/
|
||
│ ├── config/
|
||
│ │ └── siliconflow.ts # SiliconFlow API 配置和验证逻辑
|
||
│ ├── services/
|
||
│ │ └── apiKeyService.ts # 业务逻辑服务
|
||
│ ├── routes/
|
||
│ │ └── apiKeys.ts # API 路由定义
|
||
│ ├── utils/
|
||
│ │ └── errors.ts # 自定义错误类
|
||
│ └── server.ts # Express 服务器入口
|
||
├── frontend/
|
||
│ ├── src/
|
||
│ │ ├── components/ # React 组件
|
||
│ │ ├── services/ # 前端 API 服务
|
||
│ │ ├── types/ # TypeScript 类型定义
|
||
│ │ ├── utils/ # 工具函数
|
||
│ │ └── App.tsx # 主应用组件
|
||
│ ├── package.json
|
||
│ ├── vite.config.ts
|
||
│ └── tailwind.config.js
|
||
├── prisma/
|
||
│ └── schema.prisma # 数据模型定义
|
||
└── README.md
|
||
```
|
||
|
||
## 🔧 环境变量配置
|
||
|
||
### .env
|
||
```env
|
||
PORT=3000
|
||
NODE_ENV=development
|
||
API_TIMEOUT=10000
|
||
```
|
||
|
||
## 📝 使用说明
|
||
|
||
### 添加API Key
|
||
1. 在主页的"添加新API Key"表单中输入:
|
||
- API Key名称(如"生产环境")
|
||
- 实际的API Key
|
||
- 可选描述信息
|
||
|
||
### 验证API Key
|
||
- **单独验证**: 点击卡片右上角的刷新图标
|
||
- **批量验证**: 使用页面顶部"批量验证"按钮
|
||
|
||
### 查看账户信息
|
||
- **状态**: 绿色表示有效,红色表示无效
|
||
- **余额**: 显示实时账户余额
|
||
- **用户信息**: 显示关联的账户邮箱和名称
|
||
- **验证统计**: 显示验证次数和最后验证时间
|
||
|
||
## 🐛 故障排除
|
||
|
||
### 常见问题
|
||
|
||
1. **端口占用**: 确保3000和3001端口未被占用
|
||
2. **数据库连接**: 检查`prisma/dev.db`文件是否存在
|
||
3. **构建错误**: 确保所有依赖已安装: `npm install` 和 `cd frontend && npm install`
|
||
4. **API验证失败**: 检查网络连接和API Key格式
|
||
|
||
### 重置数据
|
||
|
||
```bash
|
||
# 删除数据库重新初始化
|
||
rm prisma/dev.db
|
||
npx prisma migrate dev --name init
|
||
```
|
||
|
||
## 🤝 贡献
|
||
|
||
欢迎提交Issue和Pull Request!
|
||
|
||
## 📄 许可证
|
||
|
||
MIT License - 详见 LICENSE 文件 |