dsh-pocket 1.0.11 → 1.0.13

package/README.en.md

@@ -28,6 +28,12 @@ That's what DSH Pocket does: **install it, scan a QR code, and your phone shows
 
 > One-liner: `dsh web` only allows local access by default; DSH Pocket puts a proxy in front of it that safely bridges your phone (see [How it works](#-how-it-works)).
 
+What it looks like — the phone shows the exact same UI as your computer, live:
+
+<p align="center">
+  <img src="docs/interface.jpg" alt="DSH UI on the phone" width="100%">
+</p>
+
 ## ✨ Features
 
 | Feature | Description |
@@ -95,6 +101,7 @@ DSH's `/api` browser-trust fence only accepts loopback or `--trusted-host` autho
 | Version stuck below 1.x | `^0.x` ranges never jump to 1.x: update with `--latest` (`dsh plugin --profile web update dsh-pocket --latest -w`) |
 | No push on iOS Safari | Safari Web Push requires **"Add to Home Screen"** first, then open from the home-screen icon (Chrome/Android don't need this) |
 | Public `error 1033` | See "Public tunnel troubleshooting" below — usually a local proxy/VPN (Clash etc. TUN mode) killing the tunnel |
+| After "Restart dsh web", the page says the process is running in the background | The new process from in-page self-restart is a detached background process (not attached to your terminal) — that's the standard way to apply updates in-page; stop it with `lsof -ti :3080 \| xargs kill -9` (logs under `$DSH_HOME` as `dsh-pocket-restart-*.log`) |
 
 ## ⚠️ Public tunnel troubleshooting (read first)
 

package/README.md

@@ -28,6 +28,12 @@ DSH Pocket 就是干这个的：**装上它，手机扫个码，就能实时看
 
 > 原理一句话：`dsh web` 默认只允许本机访问，DSH Pocket 在它前面加一层代理，把手机访问安全地接入（详见[「原理」](#-原理)）。
 
+实际效果——手机上的界面就是电脑上的界面，实时同步：
+
+<p align="center">
+  <img src="docs/interface.jpg" alt="手机上的 DSH 界面" width="100%">
+</p>
+
 ## ✨ 特性
 
 | 特性 | 说明 |
@@ -95,6 +101,7 @@ DSH 的 `/api` 浏览器信任栅栏只认 loopback 或 `--trusted-host`（官
 | 版本停在 0.x 升不上去 | `^0.x` 范围不允许升到 1.x：更新用 `--latest`（`dsh plugin --profile web update dsh-pocket --latest -w`） |
 | 手机 iOS 收不到推送 | Safari 的 Web Push 要求**先把网页「添加到主屏幕」**，从主屏幕图标打开后才生效（Chrome/Android 无此要求） |
 | 公网 `error 1033` | 见下方「公网隧道常见问题」——多半是本机代理/VPN（Clash 等 TUN 模式）掐断了隧道 |
+| 点「重启 dsh web」后页面提示进程在后台运行 | 自重启的新进程是 detached 后台进程（不挂终端），是页内更新的标准做法；停止它：`lsof -ti :3080 \| xargs kill -9`（日志在 `$DSH_HOME` 下 `dsh-pocket-restart-*.log`） |
 
 ## ⚠️ 公网隧道常见问题（必读）
 

package/client/client.js

@@ -1306,6 +1306,7 @@ function PocketSettingsTab({ rpcCall }) {
   const [pushEnabled, setPushEnabled] = (0, import_react2.useState)(true);
   const [pushState, setPushState] = (0, import_react2.useState)("checking");
   const [tunnelState, setTunnelState] = (0, import_react2.useState)(null);
+  const [restartNotice, setRestartNotice] = (0, import_react2.useState)(false);
   const [updateInfo, setUpdateInfo] = (0, import_react2.useState)(null);
   const call = async (endpoint, payload) => {
     const res = await rpcCall(endpoint, payload);
@@ -1317,6 +1318,7 @@ function PocketSettingsTab({ rpcCall }) {
       const s = await call(POCKET_ENDPOINTS.status, {});
       setStatus(s);
       setTunnelState(s.tunnelState ?? null);
+      if (s.restartNotice) setRestartNotice(true);
     } catch {
     }
   };
@@ -1428,10 +1430,22 @@ function PocketSettingsTab({ rpcCall }) {
         "\u5F00\u53D1\u8005\uFF1A\u7A0B\u5E8F\u5458\u5C11\u5317\u6668"
       )
     ),
+    // 重启后提示（进程在后台运行，停止方法）
+    restartNotice ? (0, import_react2.createElement)(
+      "div",
+      { style: { ...styles.block, border: "1px solid var(--dsw-alias-brand-primary,#4f6ef7)", borderRadius: 8, background: "var(--dsw-alias-bg-layer-2,#f3f4f6)", padding: "10px 12px" } },
+      (0, import_react2.createElement)(
+        "div",
+        { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: 8 } },
+        (0, import_react2.createElement)("div", { style: { fontWeight: 600, fontSize: 13 } }, "\u{1F504} \u5DF2\u91CD\u542F | Restarted"),
+        (0, import_react2.createElement)("button", { style: styles.btn, onClick: () => setRestartNotice(false) }, "\u77E5\u9053\u4E86 | OK")
+      ),
+      (0, import_react2.createElement)("div", { style: styles.muted, marginTop: 4, wordBreak: "break-all" }, "\u8FDB\u7A0B\u5728\u540E\u53F0\u8FD0\u884C\uFF08\u4E0D\u6302\u7EC8\u7AEF\uFF09\u3002\u5982\u9700\u505C\u6B62\uFF1Alsof -ti :3080 | xargs kill -9")
+    ) : null,
     // 更新提示
     updateInfo ? (0, import_react2.createElement)(
       "div",
-      { style: { ...styles.block, border: "1px solid var(--dsw-alias-state-warn-primary,#b45309)", borderRadius: 8, background: "var(--dsw-alias-bg-layer-2,#f3f4f6)", padding: "10px 12px" } },
+      { style: { ...styles.block, border: "1px solid var(--dsw-alias-state-warn-primary,#b45309)" }, borderRadius: 8, background: "var(--dsw-alias-bg-layer-2,#f3f4f6)", padding: "10px 12px" },
       (0, import_react2.createElement)(
         "div",
         { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: 8 } },

package/client/index.jsx

@@ -61,6 +61,7 @@ function PocketSettingsTab({ rpcCall }) {
   const [pushEnabled, setPushEnabled] = useState(true); // 宿主开关
   const [pushState, setPushState] = useState('checking'); // checking|on|unsupported|insecure|off
   const [tunnelState, setTunnelState] = useState(null); // 隧道进度 {phase, detail, startedAt}
+  const [restartNotice, setRestartNotice] = useState(false); // 重启后提示
   const [updateInfo, setUpdateInfo] = useState(null); // { current, latest, updating, result } | null
 
   const call = async (endpoint, payload) => {
@@ -74,6 +75,7 @@ function PocketSettingsTab({ rpcCall }) {
       const s = await call(POCKET_ENDPOINTS.status, {});
       setStatus(s);
       setTunnelState(s.tunnelState ?? null);
+      if (s.restartNotice) setRestartNotice(true);
     } catch { /* 忽略瞬时失败 */ }
   };
 
@@ -186,8 +188,17 @@ function PocketSettingsTab({ rpcCall }) {
         '开发者：程序员少北晨'),
     ),
 
+    // 重启后提示（进程在后台运行，停止方法）
+    restartNotice ? h('div', { style: { ...styles.block, border: '1px solid var(--dsw-alias-brand-primary,#4f6ef7)', borderRadius: 8, background: 'var(--dsw-alias-bg-layer-2,#f3f4f6)', padding: '10px 12px' } },
+      h('div', { style: { display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 8 } },
+        h('div', { style: { fontWeight: 600, fontSize: 13 } }, '🔄 已重启 | Restarted'),
+        h('button', { style: styles.btn, onClick: () => setRestartNotice(false) }, '知道了 | OK'),
+      ),
+      h('div', { style: styles.muted, marginTop: 4, wordBreak: 'break-all' }, '进程在后台运行（不挂终端）。如需停止：lsof -ti :3080 | xargs kill -9'),
+    ) : null,
+
     // 更新提示
-    updateInfo ? h('div', { style: { ...styles.block, border: '1px solid var(--dsw-alias-state-warn-primary,#b45309)', borderRadius: 8, background: 'var(--dsw-alias-bg-layer-2,#f3f4f6)', padding: '10px 12px' } },
+    updateInfo ? h('div', { style: { ...styles.block, border: '1px solid var(--dsw-alias-state-warn-primary,#b45309)' }, borderRadius: 8, background: 'var(--dsw-alias-bg-layer-2,#f3f4f6)', padding: '10px 12px' },
       h('div', { style: { display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 8 } },
         h('div', { style: { fontWeight: 600, fontSize: 13 } }, `📦 新版本 v${updateInfo.latest} | Update available`),
         updateInfo.result !== 'ok'

package/lib/index.js

@@ -7,10 +7,12 @@
 //   - 更新提示：有新版本时显示一键更新按钮（dsh plugin update --latest）
 // 手机看到的界面 = 电脑上的 dsh web，实时同步（WebSocket 透传）。
 
-import { readFile } from 'node:fs/promises';
 import { fileURLToPath } from 'node:url';
 import { spawn } from 'node:child_process';
 import { createRequire } from 'node:module';
+import { writeFile, readFile, mkdir } from 'node:fs/promises';
+import { join, dirname } from 'node:path';
+import { homedir } from 'node:os';
 
 import { createPocketService } from './service.mjs';
 import { installPocketRpc } from './web-rpc.js';
@@ -30,6 +32,28 @@ function currentVersion() {
   }
 }
 
+const restartNoticeRel = join('dsh-pocket', 'restarted.json');
+function restartNoticePath() {
+  return join(process.env.DSH_HOME ?? join(homedir(), '.dsh'), restartNoticeRel);
+}
+function readRestartNotice() {
+  try {
+    const raw = JSON.parse(readFile(restartNoticePath(), 'utf8'));
+    if (!raw?.at) return null;
+    if (Date.now() - raw.at > 30 * 60 * 1000) return null; // 30 分钟后过期
+    return raw;
+  } catch { return null; }
+}
+function writeRestartNotice() {
+  return mkdir(dirname(restartNoticePath()), { recursive: true })
+    .then(() => writeFile(restartNoticePath(), JSON.stringify({ at: Date.now(), pid: process.pid }), 'utf8'));
+}
+/** 自重启（先落 notice，让重启后的页面提示停止方法）。 */
+function pocketRestart() {
+  writeRestartNotice().catch(() => {});
+  return restartHost({ internals });
+}
+
 /** 执行更新：dsh plugin --profile <p> update dsh-pocket --latest -w（超时保护）。 */
 function performUpdate(profile, { timeoutMs = 180_000 } = {}) {
   return new Promise((resolve) => {
@@ -84,7 +108,8 @@ export function apply(ctx, config = {}, internals = {}) {
     service,
     push: internals.push ?? { vapidPublicKey: () => '', count: () => 0, subscribe: async () => false, unsubscribe: async () => false, isEnabled: () => true, setEnabled: async () => true },
     runUpdate: internals.runUpdate ?? { currentVersion, perform: performUpdate },
-    restart: internals.restart ?? (() => restartHost({ internals })),
+    restart: internals.restart ?? pocketRestart,
+    restartNotice: internals.restartNotice ?? readRestartNotice,
     log: logger,
   });
   disposers.push(disposeRpc);

package/lib/restart.js

@@ -1,45 +1,76 @@
-// dsh-pocket 自重启：重新拉起启动本宿主的确切 dsh 调用（脱离父进程），
-// 让更新后的插件代码生效——用户无需离开界面手动重启（借鉴 dshmarket 的
-// self-restart 方案，见 https://github.com/dsh-market/dsh-market lib/restart.js）。
+// dsh-pocket 自重启：重新拉起启动本宿主的确切 dsh 调用（detached 交接），
+// 让更新后的插件代码生效——用户无需离开界面手动重启。
 //
-// 原理：本插件运行在 dsh web 进程内，process.argv 即 dsh CLI 的启动参数
-// （如 node <bin.js> web [flags]）。用相同参数 detached 拉起新进程，
-// 短暂等待后旧进程退出，新进程接管端口。
+// 方案借鉴 dshmarket 的 self-restart（lib/restart.js，MIT）：不直接拉起新
+// 进程，而是先拉一个 detached 的 node 辅助进程，等旧进程退出、端口释放
+// （1.5s）后再拉起新 dsh，并把新进程输出写入临时日志——避免端口竞争
+// （EADDRINUSE）导致新进程静默崩溃。
+//
+// 注意：新进程 detached，不挂终端——停止方式：lsof -ti :3080 | xargs kill -9。
 
 import { spawn } from 'node:child_process';
+import { tmpdir } from 'node:os';
+import { join } from 'node:path';
 
-/**
- * 重建启动调用（与当前宿主相同的命令）。
- * @returns {{file:string, args:string[]}}
- */
+/** 重建启动调用（与当前宿主相同的命令）。 */
 export function restartLaunch() {
   return {
     file: process.argv[0], // node
     args: [process.argv[1], ...process.argv.slice(2)], // <bin.js> + web [flags]
+    cwd: process.cwd(),
   };
 }
 
+/** 辅助进程代码：等待 1.5s（旧进程释放端口）→ 拉起新 dsh → 输出写日志。 */
+function helperCode(launch, logOut, logErr) {
+  const spawn = "const { spawn } = require('node:child_process')";
+  const fs = "const fs = require('node:fs')";
+  const file = `const file = ${JSON.stringify(launch.file)}`;
+  const args = `const args = ${JSON.stringify(launch.args)}`;
+  const cwd = `const cwd = ${JSON.stringify(launch.cwd)}`;
+  const o = `const logOut = ${JSON.stringify(logOut)}`;
+  const e = `const logErr = ${JSON.stringify(logErr)}`;
+  const body = [
+    'setTimeout(() => {',
+    '  try {',
+    '    const out = fs.openSync(logOut, "a")',
+    '    const err = fs.openSync(logErr, "a")',
+    '    const child = spawn(file, args, { cwd, detached: true, stdio: ["ignore", out, err], env: process.env })',
+    '    child.unref()',
+    '  } catch {}',
+    '}, 1500)',
+  ].join('\n');
+  return [spawn, fs, file, args, cwd, o, e, body].join('\n');
+}
+
 /**
- * 拉起替代宿主（detached），随后退出当前进程。
+ * 拉起替代宿主（detached 辅助进程交接），随后结束当前进程。
  * @param {object} opts
- * @param {number} [opts.exitDelayMs] 等待新进程接管后再退出（默认 800ms）
- * @param {object} [opts.internals] 测试注入：spawnFn / exitFn
- * @returns {{spawned:boolean, file:string}}
+ * @param {number} [opts.handoffMs] 等待旧进程释放端口的时长（默认 1500ms）
+ * @param {object} [opts.internals] 测试注入：spawn / kill
+ * @returns {{helperPid:number|null, logOut:string, logErr:string}}
  */
-export function restartHost({ exitDelayMs = 800, internals = {} } = {}) {
+export function restartHost({ handoffMs = 1500, internals = {} } = {}) {
   const spawnFn = internals.spawn ?? spawn;
-  const exitFn = internals.exit ?? ((code) => process.exit(code));
-  const { file, args } = restartLaunch();
+  const killFn = internals.kill ?? ((pid) => process.kill(pid, 'SIGTERM'));
+  const launch = restartLaunch();
+  const stamp = new Date().toISOString().replace(/[:.]/g, '-').slice(0, 19);
+  const logOut = join(tmpdir(), `dsh-pocket-restart-${stamp}.out.log`);
+  const logErr = join(tmpdir(), `dsh-pocket-restart-${stamp}.err.log`);
+
+  let helperPid = null;
   try {
-    const child = spawnFn(file, args, {
+    const helper = spawnFn(process.execPath, ['-e', helperCode(launch, logOut, logErr)], {
       detached: true,
       stdio: 'ignore',
       env: process.env,
     });
-    child.unref?.();
-    setTimeout(() => exitFn(0), exitDelayMs);
-    return { spawned: true, file };
+    helper.unref?.();
+    helperPid = helper.pid ?? null;
+    // 短暂等待后结束当前进程（释放端口）；由辅助进程在 1.5s 后拉起新宿主
+    setTimeout(() => { try { killFn(process.pid); } catch { /* 忽略 */ } }, 500);
   } catch (err) {
-    return { spawned: false, error: err?.message ?? String(err) };
+    return { helperPid: null, logOut, logErr, error: err?.message ?? String(err) };
   }
+  return { helperPid, logOut, logErr };
 }

package/lib/web-rpc.js

@@ -17,7 +17,7 @@ function fail(code, message) {
 }
 
 /** 注册 /dsh-pocket 逻辑通道（仅本机 loopback 可调）。 */
-export function installPocketRpc(ctx, { service, push, log = console, runUpdate = null, restart = null }) {
+export function installPocketRpc(ctx, { service, push, log = console, runUpdate = null, restart = null, restartNotice = null }) {
   if (!ctx?.connection?.rpc?.handle) {
     log.warn?.('dsh-pocket: DSH Host Connection RPC unavailable — settings tab disabled | 无 Connection RPC，设置页不可用');
     return () => {};
@@ -25,17 +25,24 @@ export function installPocketRpc(ctx, { service, push, log = console, runUpdate
   return ctx.connection.rpc.handle(POCKET_RPC_CHANNEL, async (endpoint, payload = {}, signal) => {
     if (signal?.aborted) return fail('cancelled', 'The request was cancelled.');
 
+    // status 响应：redact 后的服务状态 + 重启提示（重启后 30 分钟内有效）
+    const statusPayload = async () => {
+      let notice = null;
+      try { notice = restartNotice?.() ?? null; } catch { notice = null; }
+      return ok({ ...redactStatus(await service.status()), restartNotice: notice });
+    };
+
     try {
       if (endpoint === POCKET_ENDPOINTS.status) {
-        return ok(redactStatus(await service.status()));
+        return await statusPayload();
       }
       if (endpoint === POCKET_ENDPOINTS.tunnelStart) {
         await service.startTunnel();
-        return ok(redactStatus(await service.status()));
+        return await statusPayload();
       }
       if (endpoint === POCKET_ENDPOINTS.tunnelStop) {
         service.stopTunnel();
-        return ok(redactStatus(await service.status()));
+        return await statusPayload();
       }
       if (endpoint === POCKET_ENDPOINTS.pushVapidKey) {
         return ok({ publicKey: push.vapidPublicKey() });
@@ -66,7 +73,7 @@ export function installPocketRpc(ctx, { service, push, log = console, runUpdate
       if (endpoint === POCKET_ENDPOINTS.restart) {
         if (!restart) return fail('bad-request', '重启不可用 | restart unavailable');
         const result = restart();
-        return ok(result);
+        return ok({ ...result, hint: '重启后进程在后台运行；如需停止：lsof -ti :3080 | xargs kill -9' });
       }
       return fail('bad-request', `Unknown endpoint: ${endpoint}`);
     } catch (err) {

package/package.json

@@ -77,5 +77,5 @@
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "version": "1.0.11"
+  "version": "1.0.13"
 }