frps-admin — 独立 frps 管理控制台

一个独立于 frps 本体的 Web 管理控制台。以 BFF（Backend-for-Frontend） 方式代理 frps API，不修改 frps 源码即可集中管理多台 frps 实例、查看客户端与代理、在线 SSH 连接代理背后的主机。

---

功能特性

• 多 frps 实例管理：在「frps 连接」中添加多台 frps 服务端地址与 Basic Auth 凭据，随时切换。
• 总览大屏：展示当前 frps 服务端配置（bindPort、subdomainHost 等）与代理类型分布。
• 客户端与代理一体化：外层表格展示客户端（Key、ClientID、版本、协议类型、IP、状态等），展开行展示该客户端下的所有代理；支持清理离线代理。
• 一键访问/连接：每条代理行提供「访问」（新标签打开 clientIP:remotePort）和「连接」（Web SSH 弹窗登录）。
• Web SSH 终端：通过 WebSocket → 后端 SSH 客户端直连代理所属客户端机器，支持密码或私钥认证。
• 操作日志：prune 等写入类操作记录到 SQLite 审计日志。

---

技术栈

层	技术
前端	Vue 3 + Vite + Ant Design Vue 4 + @ant-design/icons-vue + xterm.js
后端	Go + Gin + GORM + glebarez/sqlite（纯 Go，免 CGO）+ golang.org/x/crypto/ssh + gorilla/websocket
认证	JWT（前端 localStorage 持 token，WebSocket 通过 ?token= 传递）
数据	SQLite：User / FrpsConfig / OperationLog

---

项目结构

standalone-admin/
├── backend/              # Go BFF 后端
│   ├── internal/config   # 环境变量配置
│   ├── internal/db       # SQLite 初始化
│   ├── internal/handler  # HTTP / WebSocket handler
│   ├── internal/middleware
│   ├── internal/model
│   └── main.go
├── frontend/             # Vue3 前端
│   ├── src/
│   │   ├── api/          # axios 封装
│   │   ├── components/   # TerminalModal、BarChart、Layout 等
│   │   ├── store/        # auth.js / useFrps.js
│   │   └── views/        # 总览、客户端与代理、frps 连接
│   ├── package.json
│   └── vite.config.ts
├── doc/                  # 界面截图
├── start.sh              # 一键启动/停止前后端（WSL）
└── README.md

---

快速开始

推荐在 WSL / Linux 下运行；start.sh 已处理前后端依赖、平台原生包修复与进程清理。

1. 启动（调试用）

cd standalone-admin
bash start.sh

• 每次启动都会先杀掉旧进程。
• 后端自动执行 go mod tidy 并重新编译。
• 前端自动执行 npm install；若 node_modules 与当前平台不符会清理重装。

启动后访问：

地址	说明
http://127.0.0.1:5173	前端（Vite dev，/api 代理到后端）
http://127.0.0.1:8080	后端 API（也可直接访问打包后的前端）

默认管理员账号：admin / admin

2. 停止

bash start.sh stop

3. 生产构建

# 后端编译
cd backend
go mod tidy
go build -o bin/frps-admin .

# 前端构建
cd ../frontend
npm install
npm run build

生产运行时把 WEB_ROOT 指向前端构建产物目录（默认 ../frontend/dist）：

cd backend
WEB_ROOT=../frontend/dist PORT=8080 JWT_SECRET=your-secret ./bin/frps-admin

---

配置说明

后端通过环境变量读取配置：

变量	默认值	说明
PORT	8080	后端监听端口
JWT_SECRET	change-me-in-prod-please	JWT 签名密钥，生产务必修改
DB_PATH	admin.db	SQLite 文件路径
WEB_ROOT	../frontend/dist	前端静态文件目录
ADMIN_USER	admin	初始管理员用户名
ADMIN_PASSWORD	admin	初始管理员密码，生产务必修改

---

核心 API 路由

方法	路径	说明
POST	/api/auth/login	登录，返回 JWT
POST	/api/auth/logout	登出
GET	/api/auth/me	当前用户信息（需 JWT）
GET/POST/PUT/DELETE	/api/frps	frps 连接配置 CRUD（需 JWT）
GET	/api/frps/:id/health	检测 frps 连接健康（需 JWT）
GET	/api/frps/:id/system/info	frps 总览信息（需 JWT）
GET	/api/frps/:id/users	用户列表（需 JWT）
GET	/api/frps/:id/clients	客户端列表（需 JWT）
GET	/api/frps/:id/clients/:key	客户端详情（需 JWT）
GET	/api/frps/:id/proxies	代理列表（需 JWT）
GET	/api/frps/:id/proxies/:name	代理详情（需 JWT）
GET	/api/frps/:id/proxies/:name/traffic	代理流量趋势（需 JWT）
POST	/api/frps/:id/prune	清理离线代理（需 JWT，写审计日志）
GET	/api/ssh/ws?token=...	Web SSH WebSocket（handler 内部校验 JWT）
GET	/api/oplogs	操作日志（需 JWT）

---

界面截图

1. 总览

展示当前 frps 服务端配置与代理类型分布。

2. 客户端与代理

客户端行可展开查看其下代理；代理行提供「访问」与「连接」操作。

3. SSH 登录弹窗

点击「连接」后弹出登录框，支持用户名、密码、私钥 PEM。

4. 正在连接

后端收到 connect 消息后尝试 SSH 拨号，成功后显示终端。

5. SSH 终端

连接成功后进入交互式终端，弹窗宽度占屏幕 70%，高度 60vh。

---

使用提示

1. frps 连接配置：首次登录后进入左侧「frps 连接」，添加 frps 的 http://host:port、Basic Auth 用户名与密码；切换后左侧菜单会自动加载对应实例数据。
2. 访问 vs 连接地址：两者均使用代理所属客户端的真实 IP（clientIP）与代理自身的 remotePort，即 clientIP:remotePort。若该地址不通，请确认客户端机器在对应端口上确实有服务监听。
3. Web SSH 后端拨号：SSH 连接由后端 Go 进程发起，因此后端必须能网络直达 clientIP:remotePort。
4. 清理离线代理：红色按钮会调用 frps 的 /api/v2/system/prune 并写入操作日志，谨慎使用。

---

开发说明

• 前端 dev server 通过 vite.config.ts 的 /api 代理将请求转发到后端，因此本地调试只需访问前端地址。
• 后端 CORS 默认允许所有来源，生产环境建议移除 cors 中间件并采用同源部署（WEB_ROOT 指向前端 dist）。
• start.sh 的停止逻辑兼容 WSL、Linux、macOS 与 Windows PowerShell；端口清理会兜底杀掉 frps-admin 与 vite 进程。