mirror of
https://gitcode.com/JianFeeeee/webui4frpc.git
synced 2026-09-20 17:07:57 +00:00
jianf
c1936887a2
- 零 frp 源码依赖，单二进制 (Go + Vue3 + VueFlow + Element Plus) - 画布多对多连线，渲染 tcp/udp/http/https frpc 配置 - worker 进程管理：自愈、日志轮转、崩溃退避重启 - frpc 一键安装 (GitHub Releases) + 手动指定路径 - 三页 UI：状态(默认)/连接配置/设置 - 状态页实时节点/转发状态，节点可增删改启停 - 画布冲突检查：端口/域名冲突标红 + 弹窗拦截保存 - backend 单测覆盖 store/render/process/httpapi/install - plan.md + FRPC_FEATURES_AUDIT.md 文档
94 lines
3.3 KiB
Markdown
94 lines
3.3 KiB
Markdown
# webui4frpc
|
||
|
||
一个**独立于 frp 源码**的可视化 frpc 控制器。用画布方式把「本地转发项」连到「远程服务器」，自动为每台远程服务器生成 frpc 配置并拉起独立 worker 进程，免去运维反复手写 frpc 配置的麻烦。
|
||
|
||
> 本仓库**不捆绑、不包含任何 frp 源码**。frpc 可执行文件由用户一键从官方 GitHub Releases 下载，或手动指定路径。
|
||
|
||
## 特性
|
||
|
||
- **Scratch 风格画布**：本地转发项（local）与远程服务器（remote）可视化连线，一个 local 可连多个 remote，一个 remote 可连多个 local
|
||
- **曲线连线 + 端口标签**：每条连线独立曲线，标签为远程端口，可拖拽调整曲线位置，端口可点开编辑
|
||
- **一键生成配置**：保存画布即渲染每台 remote 的 frpc JSON 配置，自动拉起/重启对应 worker
|
||
- **worker 自愈**：崩溃自动重启（指数退避），随 webui 启停
|
||
- **frpc 一键安装**：从官方 Releases 下载任意版本 frpc，或手动指定二进制路径
|
||
- **token 可视化**：remote 支持 token/URL 等字段
|
||
|
||
## 构建
|
||
|
||
### 后端（Go 1.25+）
|
||
|
||
```bash
|
||
go build -o webui4frpc ./cmd/webui4frpc
|
||
```
|
||
|
||
### 前端（Node 20+）
|
||
|
||
```bash
|
||
cd web && npm install && npm run build
|
||
```
|
||
|
||
前端产物会进入 `web/dist`，需要拷贝到 `internal/httpapi/dist` 以便 Go `embed` 打包进单一二进制：
|
||
|
||
```bash
|
||
rm -rf internal/httpapi/dist && cp -r web/dist internal/httpapi/dist
|
||
```
|
||
|
||
## 运行
|
||
|
||
```bash
|
||
./webui4frpc -addr 127.0.0.1:7500 -user admin -password admin123 -workdir ./data
|
||
```
|
||
|
||
打开 http://127.0.0.1:7500/ ，输入账号密码进入画布。首次使用可到「设置」页一键安装 frpc（或手动指定路径），然后回到画布创建 local / remote 并连线、保存。
|
||
|
||
参数：
|
||
|
||
| 参数 | 默认 | 说明 |
|
||
|---|---|---|
|
||
| `-addr` | `127.0.0.1:7500` | 监听地址 |
|
||
| `-user` / `-password` | `admin`/`admin` | Basic 认证 |
|
||
| `-workdir` | `./webui4frpc` | 数据目录（db/配置/日志/bin） |
|
||
| `-bin` | 空 | 初始 frpc 路径（可选） |
|
||
|
||
## 数据目录
|
||
|
||
```
|
||
<workdir>
|
||
├── manager.db # SQLite 状态（locals/remotes/links/settings）
|
||
├── configs/<name>.json # 每台 remote 渲染的 frpc 配置
|
||
├── logs/<name>.log # worker 日志（按大小轮转）
|
||
└── bin/frpc-<v> # 一键安装的 frpc
|
||
```
|
||
|
||
## 架构
|
||
|
||
```
|
||
webui4frpc（单二进制，无 frp 依赖）
|
||
├── cmds/webui4frpc 入口：HTTP 服务 + 生命周期
|
||
├── internal/store SQLite 持久化
|
||
├── internal/canvas 画布模型（local/remote/link）
|
||
├── internal/render 渲染 frpc JSON 配置
|
||
├── internal/process worker 进程管理（spawn/stop/restart/自愈）
|
||
├── internal/httpapi REST API + 静态资源
|
||
└── internal/install 一键下载官方 frpc
|
||
```
|
||
|
||
## API
|
||
|
||
| 方法 | 路径 | 说明 |
|
||
|---|---|---|
|
||
| GET | `/api/manager/status` | 总览状态 |
|
||
| GET/PUT | `/api/manager/canvas` | 读写画布 |
|
||
| GET/PUT | `/api/manager/settings` | 读写运行策略 |
|
||
| POST | `/api/manager/binary/install` | 一键安装 frpc |
|
||
| POST | `/api/manager/profiles/{name}/start\|stop\|restart` | worker 启停 |
|
||
| GET | `/api/manager/profiles/{name}/config\|logs` | 查看配置/日志 |
|
||
|
||
## 测试
|
||
|
||
```bash
|
||
go test ./...
|
||
# 前端
|
||
cd web && npm run type-check
|
||
```
|