# web-mysql客户端

**Repository Path**: nicke/web-mysql-client

## Basic Information

- **Project Name**: web-mysql客户端
- **Description**: 尝试使用claude code + openSpec实现
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-07-07
- **Last Updated**: 2026-07-07

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Web MySQL Client

一个轻量级的 Web 版 MySQL 客户端，浏览器打开即用，无需安装桌面软件。

## 功能

- **连接管理** — 多连接配置保存、测试连通性、一键切换
- **SQL 编辑器** — CodeMirror 6 语法高亮、Ctrl+Enter 执行、SQL 一键格式化
- **结果展示** — 表格展示查询结果、分页、执行耗时、错误提示
- **元数据浏览** — 树形导航浏览数据库和表、查看表结构（字段/索引/注释）
- **可视化 CRUD** — 双击编辑单元格、新增/删除行、SQL 预览确认
- **历史记录** — 自动记录 SQL 执行历史、双击加载到编辑器
- **数据导出** — 查询结果导出 CSV（UTF-8 BOM，兼容 Excel）
- **暗模式** — 支持亮色/暗色主题切换

## 技术栈

| 层 | 技术 |
|----|------|
| 前端 | Vue 3 + TypeScript + Vite + Naive UI + CodeMirror 6 + Pinia |
| 后端 | Fastify + TypeScript + mysql2 |
| 存储 | 本地 JSON 文件（连接配置 AES-256-GCM 加密） |

## 快速开始

```bash
# 安装依赖
npm install
cd web && npm install
cd ../server && npm install
cd ..

# 开发模式（前后端热重载）
npm run dev
# 前端: http://localhost:5173
# 后端: http://127.0.0.1:3721

# 生产模式
cd web && npm run build && cd ..
cd server && npm start
# 访问: http://127.0.0.1:3721
```

## 项目结构

```
├── web/                    # 前端 Vue3 + Vite
│   └── src/
│       ├── api/            # axios 封装 + API 函数
│       ├── components/     # UI 组件
│       ├── composables/    # 可组合函数
│       ├── router/         # Vue Router 路由
│       ├── stores/         # Pinia 状态管理
│       └── views/          # 页面视图
├── server/                 # 后端 Fastify + TS
│   └── src/
│       ├── routes/         # API 路由
│       ├── services/       # 业务逻辑
│       ├── db/             # 本地 JSON 存储
│       └── utils/          # 加密工具
└── openspec/               # OpenSpec 规格文档
```

## 安全说明

- 默认仅监听 `127.0.0.1`，不对外暴露
- 数据库密码使用 AES-256-GCM 本地加密存储
- 密钥文件首次启动自动生成，存储在 `data/.key`

## License

MIT