dsh-mesh-access 1.1.0 → 1.2.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # 更新日志
 
+## 1.2.0 — 面板里就能填服务器信息
+
+1.1.0 仍然要求你先去跑脚本写 `frpc.toml`，面板只是个看板。现在不用了：
+
+- 「公网隧道」卡新增**改配置 / 填服务器信息**：服务器地址、`bindPort`、`remotePort`、本地端口、域名、token 直接在面板里填，保存后自动启动；
+- token 留空表示沿用 `frpc.toml` 里已有的那个（不用每次重填，也不会把密钥显示在页面上）；
+- 填了域名，复制的地址就是 **`https://域名/?token=…`**（域名记在同目录的 `dsh-mesh-access.json` 侧车里，`frpc.toml` 保持标准 frp 格式）；
+- 输入校验：地址只认 IP/域名、端口必须 1–65535、域名格式检查，错误直接在面板上说明；
+- 面板写出来的 `frpc.toml` 和 `tools/frpc-setup.sh` 生成的是同一种文件，先跑脚本后来用面板改也不会打架。
+
+仍然要**手动做一次**的事（脚本和面板都替你做不了）：DNS 里给域名加 A 记录指向服务器、云安全组放行端口、
+在服务器上跑一次 `tools/frps-setup.sh`（它会顺带把证书和 Basic 认证配好）。
+
+## 1.1.1 — 面板把「外部进程」说清楚
+
+1.1.0 里如果 frpc 是你自己的 systemd 单元在跑，面板会同时显示「frpc 未运行」和「公网可达」，看着自相矛盾。改成：
+
+- 第一颗状态改成三态：`frpc 运行中（本插件）` / `frpc 运行中（外部进程）` / `frpc 未运行`；
+- 「停止」按钮在外部进程时禁用并给出提示，告诉你用 `systemctl --user stop dsh-frpc` 停；
+- 说明文字写清为什么不让重复启动（两个 frpc 抢同一个 `remotePort`）。
+
+功能没有变化。
+
 ## 1.1.0 — 把「自己的 VPS 隧道」做进面板
 
 组网这条路在某些网络下注定要中继（校园网只能一台设备在线、手机蜂窝 CGNAT），TCP 中继 RTT 800–990 ms，长连接撑不住。所以面板多了一张「公网隧道」卡片，用你自己的服务器 + frp 走第二条路：

package/lib/client.js

@@ -41,6 +41,16 @@ window.__ModuleLoader__.load({
       dot: (on) => ({ width: 7, height: 7, borderRadius: 999, background: on ? '#3fb950' : '#8b949e' }),
       err: { color: '#f85149', fontSize: 13, marginTop: 8 },
       hint: { fontSize: 12, opacity: 0.6, marginTop: 10, lineHeight: 1.6 },
+      input: {
+        padding: '6px 10px',
+        borderRadius: 8,
+        border: '1px solid rgba(127,127,127,.35)',
+        background: 'transparent',
+        color: 'inherit',
+        fontSize: 13,
+        width: 200,
+      },
+      label: { fontSize: 12, opacity: 0.7, marginBottom: 4, display: 'block' },
     }
 
     /** 带硬超时的 fetch：超时就 abort，绝不让调用方永远挂着。
@@ -61,7 +71,7 @@ window.__ModuleLoader__.load({
         fetchJson('/api/dsh-mesh-access/tunnel', {
           method: 'POST',
           headers: { 'content-type': 'application/json' },
-          body: JSON.stringify({ action }),
+          body: JSON.stringify(typeof action === 'string' ? { action } : action),
         }, 20000),
       action: (action, port) =>
         fetchJson('/api/dsh-mesh-access/proxy', {
@@ -92,6 +102,8 @@ window.__ModuleLoader__.load({
       const [err, setErr] = react.useState(null)
       const [tunnelErr, setTunnelErr] = react.useState(null)
       const [copied, setCopied] = react.useState(false)
+      const [formOpen, setFormOpen] = react.useState(false)
+      const [form, setForm] = react.useState({})
 
       const refresh = react.useCallback(() => {
         api
@@ -128,6 +140,49 @@ window.__ModuleLoader__.load({
           .finally(() => setTunnelBusy(false))
       }
 
+      const runConfig = () => {
+        const payload = Object.assign({ action: 'config' }, form)
+        setTunnelBusy(true)
+        setTunnelErr(null)
+        api
+          .tunnelAction(payload)
+          .then((t) => {
+            if (t && t.ok === false) {
+              setTunnelErr(t.error ?? '保存失败')
+              return null
+            }
+            setFormOpen(false)
+            setForm({})
+            refresh()
+            // 存完顺手起隧道；起不来也只报错，不静默
+            return api.tunnelAction('start')
+          })
+          .then((t) => {
+            if (!t) return
+            if (t && t.ok === false) setTunnelErr(t.error ?? '隧道没起来')
+            else if (t && t.error) setTunnelErr(t.error)
+            refresh()
+          })
+          .catch((e) => setTunnelErr(String(e && e.message ? e.message : e)))
+          .finally(() => setTunnelBusy(false))
+      }
+
+      const openForm = () => {
+        const tn0 = tunnel || (state && state.tunnel) || {}
+        setForm({
+          serverAddr: tn0.serverAddr || '',
+          serverPort: String(tn0.serverPort || 7000),
+          remotePort: String(tn0.remotePort || 21081),
+          localPort: String(tn0.localPort || (state && state.proxy && state.proxy.port) || 3081),
+          localIP: tn0.localIP || (state && state.mesh && state.mesh[0] && state.mesh[0].address) || '127.0.0.1',
+          domain: tn0.domain || '',
+          token: '',
+        })
+        setFormOpen(true)
+      }
+
+      const setField = (k) => (e) => setForm(Object.assign({}, form, { [k]: e.target.value }))
+
       const run = (action) => {
         setBusy(true)
         setErr(null)
@@ -215,7 +270,8 @@ window.__ModuleLoader__.load({
         h(
           Card, { title: '公网隧道（自己的 VPS，可选的第二条路）' },
           h('div', { style: S.row },
-            h('span', { style: S.pill(Boolean(tn.running)) }, h('span', { style: S.dot(Boolean(tn.running)) }), tn.running ? 'frpc 运行中' : 'frpc 未运行'),
+            h('span', { style: S.pill(Boolean(tn.running || tn.external)) }, h('span', { style: S.dot(Boolean(tn.running || tn.external)) }),
+              tn.running ? 'frpc 运行中（本插件）' : tn.external ? 'frpc 运行中（外部进程）' : 'frpc 未运行'),
             h('span', { style: S.pill(Boolean(tn.reachable)) }, h('span', { style: S.dot(Boolean(tn.reachable)) }), tn.reachable ? '公网可达' : '公网不可达'),
             h('span', { style: S.pill(Boolean(tn.url)) }, h('span', { style: S.dot(Boolean(tn.url)) }), tn.domain ? '域名 ' + tn.domain : tn.remotePort ? '端口 ' + tn.remotePort : '未配置'),
           ),
@@ -225,9 +281,48 @@ window.__ModuleLoader__.load({
               disabled: tunnelBusy || Boolean(tn.running) || Boolean(tn.external) || !tn.configFound,
               onClick: () => runTunnel('start'),
             }, tunnelBusy ? '处理中…' : tn.external ? '外部进程已在跑' : '启动隧道'),
-            h('button', { style: S.btn, disabled: tunnelBusy || !tn.running, onClick: () => runTunnel('stop') }, '停止'),
+            h('button', {
+              style: S.btn,
+              disabled: tunnelBusy || !tn.running,
+              title: tn.external && !tn.running ? '这个 frpc 是外部进程（systemd 单元），请用 systemctl --user stop dsh-frpc' : '',
+              onClick: () => runTunnel('stop'),
+            }, '停止'),
             h('button', { style: S.btn, disabled: tunnelBusy, onClick: refresh }, '刷新'),
+            h('button', { style: S.btn, disabled: tunnelBusy, onClick: formOpen ? () => setFormOpen(false) : openForm }, formOpen ? '收起' : tn.configFound ? '改配置' : '填服务器信息'),
           ),
+          formOpen
+            ? h('div', { style: { marginTop: 12, padding: 12, borderRadius: 8, border: '1px dashed rgba(127,127,127,.35)' } },
+                h('div', { style: S.hint, marginTop: 0, opacity: 0.8 },
+                  '填的是你自己的服务器。不知道填什么就问给你配服务器的那个人，或者把 docs/AI-SETUP.md 丢给你的 AI。'),
+                h('div', { style: S.row, marginTop: 10, gap: 10 },
+                  h('div', null, h('label', { style: S.label }, '服务器地址（IP 或域名）'),
+                    h('input', { style: S.input, value: form.serverAddr || '', placeholder: '1.2.3.4', onChange: setField('serverAddr') })),
+                  h('div', null, h('label', { style: S.label }, '绑定端口 bindPort'),
+                    h('input', { style: S.input, value: form.serverPort || '', placeholder: '7000', onChange: setField('serverPort') })),
+                  h('div', null, h('label', { style: S.label }, '公网端口 remotePort'),
+                    h('input', { style: S.input, value: form.remotePort || '', placeholder: '21081', onChange: setField('remotePort') })),
+                ),
+                h('div', { style: S.row, marginTop: 10, gap: 10 },
+                  h('div', null, h('label', { style: S.label }, '域名（可选，填了就用 https）'),
+                    h('input', { style: S.input, value: form.domain || '', placeholder: 'dsh.example.com', onChange: setField('domain') })),
+                  h('div', null, h('label', { style: S.label }, '本地端口（组网 IP 上那个）'),
+                    h('input', { style: S.input, value: form.localPort || '', placeholder: '3081', onChange: setField('localPort') })),
+                  h('div', null, h('label', { style: S.label }, 'token' + (tn.tokenSet ? '（已存，留空不变）' : '')),
+                    h('input', {
+                      style: S.input,
+                      type: 'password',
+                      value: form.token || '',
+                      placeholder: tn.tokenSet ? '••••••••（保持不变）' : '服务端 /etc/frp/frps.toml 里的 auth.token',
+                      onChange: setField('token'),
+                    })),
+                ),
+                h('div', { style: S.row, marginTop: 12 },
+                  h('button', { style: S.btnPrimary, disabled: tunnelBusy, onClick: runConfig }, tunnelBusy ? '保存中…' : '保存并启动'),
+                  h('button', { style: S.btn, disabled: tunnelBusy, onClick: () => setFormOpen(false) }, '取消'),
+                ),
+                h('div', { style: S.hint }, '保存会写 ~/.config/frp/frpc.toml（600）和同目录的 dsh-mesh-access.json（只存域名）。'),
+              )
+            : null,
           tunnelErr ? h('div', { style: S.err }, tunnelErr) : null,
           tn.urlSigned
             ? h('div', { style: S.row, marginTop: 12 },
@@ -240,7 +335,7 @@ window.__ModuleLoader__.load({
               ? 'frpc 配置：' + tn.configPath + (tn.serverAddr ? '（' + tn.serverAddr + '，本地 ' + tn.localPort + ' → 远端 ' + tn.remotePort + '）' : '')
               : '没找到 frpc 配置 ' + (tn.configPath || '') + '。这条是可选的：用你自己的服务器做公网入口，就不受组网中继心跳超时的影响。装法见 docs/VPS.md，或者把 docs/AI-SETUP.md 丢给你的 AI 让它跑 tools/frps-setup.sh + tools/frpc-setup.sh。',
             tn.external && !tn.running
-              ? ' 检测到公网已经可达、但 frpc 不是这个进程拉起的（大概是你自己的 systemd 单元在跑），所以这里不让重复启动，免得抢同一个 remotePort。'
+              ? ' 现在这个隧道是你自己的外部进程在跑（多半是 systemd 单元 dsh-frpc），所以这里显示为「外部进程」并且不让重复启动，免得抢同一个 remotePort。想停：systemctl --user stop dsh-frpc。'
               : '',
             ' 组网走中继时 RTT 800–990 ms（最坏 3.7 s），长连接会被心跳判死；你自己的服务器通常 30–60 ms。',
           ),

package/lib/index.js

@@ -19,6 +19,7 @@ import os from 'node:os'
 import fs from 'node:fs'
 import http from 'node:http'
 import net from 'node:net'
+import path from 'node:path'
 import { spawn } from 'node:child_process'
 
 export const name = 'dsh-mesh-access'
@@ -187,6 +188,7 @@ export function apply(ctx, config = {}) {
     // 公网隧道（frp）。默认路径与 frp 官网安装脚本一致，用户换位置就在配置里覆盖。
     frpcBin: asText(config.frpcBin, `${os.homedir()}/.local/bin/frpc`),
     frpcConfig: asText(config.frpcConfig, `${os.homedir()}/.config/frp/frpc.toml`),
+    frpcLog: asText(config.frpcLog, `${os.homedir()}/.config/frp/frpc.log`),
     // 隧道对外暴露的域名（有 TLS 时写域名，没有就留空 —— 会自动退回 http://serverAddr:remotePort）
     tunnelDomain: asText(config.tunnelDomain, ''),
   }
@@ -260,6 +262,83 @@ export function apply(ctx, config = {}) {
     return Number.isFinite(num) ? num : raw
   }
 
+  const sidecarPath = () => `${path.dirname(cfg.frpcConfig)}/dsh-mesh-access.json`
+
+  const readSidecar = () => {
+    try {
+      return JSON.parse(fs.readFileSync(sidecarPath(), 'utf8'))
+    } catch {
+      return {}
+    }
+  }
+
+  const writeSidecar = (data) => {
+    try {
+      fs.mkdirSync(path.dirname(sidecarPath()), { recursive: true })
+      fs.writeFileSync(sidecarPath(), JSON.stringify(data, null, 2) + '\n')
+    } catch {
+      /* 侧车只是记域名，写不进去就退回插件配置 */
+    }
+  }
+
+  /**
+   * 写 frpc.toml + 侧车（域名）。面板上的「设置」和 tools/frpc-setup.sh 产出的是同一种文件，
+   * 所以用户先跑脚本、后来改用面板改，两边不会打架。
+   */
+  const writeTunnelConfig = (input) => {
+    const str = (v) => (typeof v === 'string' ? v.trim() : '')
+    const serverAddr = str(input.serverAddr)
+    const domain = str(input.domain).replace(/^https?:\/\//, '').replace(/\/+$/, '')
+    const serverPort = Number(input.serverPort ?? 7000)
+    const remotePort = Number(input.remotePort ?? 21081)
+    const localPort = Number(input.localPort ?? cfg.proxyPort)
+    const localIP = str(input.localIP) || '127.0.0.1'
+    const token = str(input.token)
+
+    if (!/^[A-Za-z0-9._-]+$/.test(serverAddr)) throw new Error('服务器地址只能填 IP 或域名')
+    for (const [name, v] of [['绑定端口', serverPort], ['公网端口', remotePort], ['本地端口', localPort]]) {
+      if (!Number.isInteger(v) || v < 1 || v > 65535) throw new Error(`${name}要填 1–65535 之间的整数`)
+    }
+    if (domain && !/^[A-Za-z0-9.-]+\.[A-Za-z]{2,}$/.test(domain)) throw new Error('域名格式不对，例如 dsh.example.com')
+
+    let oldToken = ''
+    try {
+      oldToken = String(tomlValue(fs.readFileSync(cfg.frpcConfig, 'utf8'), 'auth.token') || '')
+    } catch {
+      /* 没有旧配置就算了 */
+    }
+    const finalToken = token || oldToken
+    if (!finalToken) throw new Error('token 不能为空（服务端 /etc/frp/frps.toml 里的 auth.token）')
+
+    const text = `# 由 dsh-mesh-access 面板生成
+serverAddr = "${serverAddr}"
+serverPort = ${serverPort}
+
+auth.method = "token"
+auth.token = "${finalToken}"
+
+log.to = "${cfg.frpcLog}"
+log.level = "info"
+
+[[proxies]]
+name = "dsh-mesh"
+type = "tcp"
+localIP = "${localIP}"
+localPort = ${localPort}
+remotePort = ${remotePort}
+transport.useEncryption = true
+`
+    fs.mkdirSync(path.dirname(cfg.frpcConfig), { recursive: true })
+    fs.writeFileSync(cfg.frpcConfig, text, { mode: 0o600 })
+    try {
+      fs.chmodSync(cfg.frpcConfig, 0o600)
+    } catch {
+      /* ignore */
+    }
+    writeSidecar({ domain: domain || null, updatedAt: new Date().toISOString() })
+    return true
+  }
+
   const tunnelCfg = () => {
     let text = ''
     try {
@@ -271,7 +350,8 @@ export function apply(ctx, config = {}) {
     const serverPort = Number(tomlValue(text, 'serverPort') ?? 7000)
     const remotePort = Number(tomlValue(text, 'remotePort') ?? 0)
     const localPort = Number(tomlValue(text, 'localPort') ?? cfg.proxyPort)
-    const domain = cfg.tunnelDomain || ''
+    const localIP = String(tomlValue(text, 'localIP') || '127.0.0.1')
+    const domain = readSidecar().domain || cfg.tunnelDomain || ''
     // 有域名就走 https://domain/（VPS 上 nginx 已经接管 TLS），否则直连 IP:remotePort
     const base = domain ? `https://${domain}/` : remotePort && serverAddr ? `http://${serverAddr}:${remotePort}/` : null
     return {
@@ -282,6 +362,8 @@ export function apply(ctx, config = {}) {
       serverPort,
       remotePort,
       localPort,
+      localIP,
+      tokenSet: Boolean(tomlValue(text, 'auth.token')),
       domain: domain || null,
       url: base,
       urlSigned: signed(base),
@@ -558,6 +640,14 @@ export function apply(ctx, config = {}) {
           const action = String(body.action ?? '')
           if (action === 'start') return json(res, 200, await startTunnel())
           if (action === 'stop') return json(res, 200, await stopTunnel())
+          if (action === 'config') {
+            try {
+              writeTunnelConfig(body)
+            } catch (err) {
+              return json(res, 400, { ok: false, error: String(err?.message ?? err) })
+            }
+            return json(res, 200, { ok: true, ...tunnelSnapshot() })
+          }
           return json(res, 400, { ok: false, error: "action 只能是 'start' 或 'stop'" })
         },
       },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-mesh-access",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "Control your DSH from your phone: opens a port on the mesh/VPN interface from inside the running server process, so a phone browser gets the same instance and the same session list — no SSH, no second dsh. Also reachable from another PC, a GUI NAS, or a TV box.",
   "type": "module",
   "main": "lib/index.js",