@qzsy/dsh-bridge 3.1.0 → 3.2.0

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # 更新日志
 
+## [v3.2.0] - 2026-11-02
+
+### ✨ 新增
+
+- **授权后显示账号信息**：面板在授权成功（已绑定）后新增账号卡片，展示头像、昵称、邮箱/用户名，头像加载失败回退首字母。
+- **使用时长**：展示剩余时长、本月已用、累计已用，以及授权时间与已授权天数；每 60 秒自动刷新，支持手动刷新。
+- **控制面新接口** `POST /api/saas/device/profile`：设备凭据鉴权（与设备令牌同口径），只返回绑定账号的展示字段与时长，隔离边界仍为 `device.userId`；相对路径头像按请求源补全为绝对 URL。
+- **插件 RPC `getProfile`**：面板通过 Host 侧 RPC 拉取账号资料；失败只回给面板，不写入隧道 `lastError`。
+
+### 🧪 验证
+
+- 单测覆盖账号资料字段归一化、头像协议白名单、RPC 未绑定/未授权拒绝；无感授权回归覆盖绑定后读取账号资料。
+
+
+## [v3.1.1] - 2026-11-02
+
+### 🐛 修复
+
+- 修复启用时 `TypeError: Invalid effect` 导致插件无法激活：`apply()` 不再返回实例对象（宿主会把 async apply 的解析值当作 disposer），改为通过 `getApplyState()` 暴露给单测。
+
+
 ## [v3.0.2] - 2026-11-01
 
 ### 🐛 修复

package/README.md

@@ -26,6 +26,8 @@ dsh plugin --profile <name> add @qzsy/dsh-bridge
    `https://<控制面>/device/authorize?code=...`。
 3. 在浏览器登录 SaaS 账号 → 点「**授权此设备**」→ 回到 DSH 面板。
 4. 面板会自动轮询并完成绑定，**绑定后自动开启隧道**，随后出现「**显示二维码**」按钮。
+   绑定成功后，面板顶部会出现**账号卡片**：头像、昵称/邮箱/用户名、剩余时长、本月已用、
+   累计已用与授权时间；每 60 秒自动刷新，也可手动「刷新」。
 5. 手机扫码（`https://<控制面>/open/<publicId>`）→ 登录 SaaS 账号 → 自动验证隧道归属并签发一次性
    ticket，跳转进入本机 DSH。
 
@@ -86,7 +88,7 @@ loopback 会话 cookie。来源判定：
 | 请求 502 | DSH 本体不可达：确认 `dsh web` 在运行，或配置 `targetPort` |
 | WebSocket 打不开 | 确认网关与反代放行 WS Upgrade；插件会透传 `ws-open/accept/frame/close` |
 
-## 已知限制（v3.1.0）
+## 已知限制（v3.2.0）
 
 - `getStatus` 为面板引导接口，免 adminToken，只返回脱敏状态（设备 id/secret 均掩码，不含访问令牌与二维码；`openUrl` 由 /open/<publicId> 二次校验归属）。
 - adminToken 每次进程启动随机生成，只经物理回环 `/__qzsy_bridge__/loopback-token` 签发；重启 DSH 后需重新领取（面板自动完成）。

package/client/client.js

@@ -48,6 +48,7 @@ var RPC_ENDPOINTS = Object.freeze({
   getAccessUrl: "getAccessUrl",
   startLogin: "startLogin",
   getEntryQr: "getEntryQr",
+  getProfile: "getProfile",
   setAccessPassword: "setAccessPassword",
   clearAccessPassword: "clearAccessPassword"
 });
@@ -101,7 +102,22 @@ var zh = {
   autoStart: "\u968F DSH \u542F\u52A8\u81EA\u52A8\u5F00\u542F",
   status: "\u72B6\u6001",
   version: "\u7248\u672C",
-  loadFailed: "\u65E0\u6CD5\u8FDE\u63A5\u63D2\u4EF6 RPC"
+  loadFailed: "\u65E0\u6CD5\u8FDE\u63A5\u63D2\u4EF6 RPC",
+  authorized: "\u5DF2\u6388\u6743",
+  balance: "\u5269\u4F59\u65F6\u957F",
+  monthUsed: "\u672C\u6708\u5DF2\u7528",
+  totalUsed: "\u7D2F\u8BA1\u5DF2\u7528",
+  authorizedAt: "\u6388\u6743\u4E8E ${date}",
+  authorizedDays: "\u5DF2\u6388\u6743 ${days} \u5929",
+  profileLoading: "\u6B63\u5728\u8BFB\u53D6\u8D26\u53F7\u4FE1\u606F\u2026",
+  profileFailed: "\u8D26\u53F7\u4FE1\u606F\u8BFB\u53D6\u5931\u8D25",
+  accountUnknown: "\u8D26\u53F7",
+  refresh: "\u5237\u65B0",
+  refreshing: "\u5237\u65B0\u4E2D\u2026",
+  durationHours: "${hours} \u5C0F\u65F6",
+  durationHoursMinutes: "${hours} \u5C0F\u65F6 ${minutes} \u5206",
+  durationMinutes: "${minutes} \u5206\u949F",
+  durationUnderMinute: "\u4E0D\u8DB3 1 \u5206\u949F"
 };
 var en = {
   title: "Remote Access",
@@ -151,7 +167,22 @@ var en = {
   autoStart: "Auto-start with DSH",
   status: "Status",
   version: "Version",
-  loadFailed: "Cannot reach plugin RPC"
+  loadFailed: "Cannot reach plugin RPC",
+  authorized: "Authorized",
+  balance: "Time left",
+  monthUsed: "Used this month",
+  totalUsed: "Total used",
+  authorizedAt: "Authorized ${date}",
+  authorizedDays: "${days} days since authorization",
+  profileLoading: "Loading account\u2026",
+  profileFailed: "Failed to load account",
+  accountUnknown: "Account",
+  refresh: "Refresh",
+  refreshing: "Refreshing\u2026",
+  durationHours: "${hours} h",
+  durationHoursMinutes: "${hours} h ${minutes} min",
+  durationMinutes: "${minutes} min",
+  durationUnderMinute: "< 1 min"
 };
 function detectLang(host = {}) {
   try {
@@ -193,7 +224,46 @@ var styles = {
   code: { fontSize: 28, fontWeight: 700, letterSpacing: 4, fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace", margin: "8px 0" },
   error: { color: "var(--dsw-alias-state-error-primary, #dc2626)", fontSize: 12, lineHeight: 1.6, wordBreak: "break-all" },
   muted: { color: "var(--dsw-alias-label-secondary, #6b7280)", fontSize: 12, lineHeight: 1.6 },
-  qr: { width: 168, height: 168, borderRadius: 8, background: "#fff", padding: 6 }
+  qr: { width: 168, height: 168, borderRadius: 8, background: "#fff", padding: 6 },
+  accountTop: { display: "flex", gap: 12, alignItems: "center" },
+  avatar: {
+    width: 48,
+    height: 48,
+    borderRadius: 999,
+    overflow: "hidden",
+    flex: "0 0 auto",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    background: "var(--dsw-alias-bg-secondary, #eef1f5)",
+    color: "var(--dsw-alias-label-primary, #111827)",
+    fontSize: 18,
+    fontWeight: 700
+  },
+  avatarImg: { width: "100%", height: "100%", objectFit: "cover", display: "block" },
+  accountIdentity: { flex: "1 1 220px", minWidth: 0 },
+  accountName: { fontSize: 14, fontWeight: 600, lineHeight: 1.5, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
+  accountEmail: { fontSize: 12, color: "var(--dsw-alias-label-secondary, #6b7280)", lineHeight: 1.6, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" },
+  statGrid: {
+    display: "flex",
+    gap: 8,
+    flexWrap: "wrap",
+    marginTop: 12,
+    paddingTop: 12,
+    borderTop: "1px solid var(--dsw-alias-border-secondary, #e5e7eb)"
+  },
+  stat: { flex: "1 1 120px", minWidth: 0 },
+  statLabel: { display: "block", fontSize: 12, color: "var(--dsw-alias-label-secondary, #6b7280)", lineHeight: 1.6 },
+  statValue: { fontSize: 14, fontWeight: 600, lineHeight: 1.5, wordBreak: "break-word" },
+  accountFoot: { display: "flex", justifyContent: "space-between", alignItems: "center", gap: 8, flexWrap: "wrap", marginTop: 10 },
+  linkBtn: {
+    padding: 0,
+    border: "none",
+    background: "transparent",
+    color: "var(--dsw-alias-brand-primary, #4f6ef7)",
+    cursor: "pointer",
+    fontSize: 12
+  }
 };
 function CopyButton({ value, t }) {
   const [copied, setCopied] = React.useState(false);
@@ -222,8 +292,101 @@ function UrlRow({ label, url, t }) {
     )
   );
 }
+function formatDuration(t, seconds) {
+  const total = Math.max(0, Math.floor(Number(seconds) || 0));
+  const hours = Math.floor(total / 3600);
+  const minutes = Math.floor(total % 3600 / 60);
+  if (hours > 0) {
+    return minutes > 0 ? t("durationHoursMinutes", { hours, minutes }) : t("durationHours", { hours });
+  }
+  if (minutes > 0) return t("durationMinutes", { minutes });
+  return t("durationUnderMinute");
+}
+function formatDate(iso) {
+  if (!iso) return "";
+  const date = new Date(iso);
+  if (!Number.isFinite(date.getTime())) return "";
+  try {
+    return date.toLocaleDateString();
+  } catch {
+    return String(iso).slice(0, 10);
+  }
+}
+function AccountAvatar({ url, name: name2 }) {
+  const [failed, setFailed] = React.useState(false);
+  React.useEffect(() => {
+    setFailed(false);
+  }, [url]);
+  const initial = (name2 || "?").trim().slice(0, 1).toUpperCase() || "?";
+  return h(
+    "div",
+    { style: styles.avatar },
+    url && !failed ? h("img", { src: url, alt: name2 || "", style: styles.avatarImg, onError: () => setFailed(true) }) : h("span", null, initial)
+  );
+}
+function AccountCard({ profile, loading, error, onRefresh, t }) {
+  const user = profile?.user;
+  const usage = profile?.usage;
+  const authorization = profile?.authorization;
+  const pending = loading || !profile && !error;
+  const boundDate = formatDate(authorization?.boundAt);
+  const authorizedText = boundDate ? `${t("authorizedAt", { date: boundDate })}${authorization?.days > 0 ? ` \xB7 ${t("authorizedDays", { days: authorization.days })}` : ""}` : "";
+  return h(
+    "div",
+    { style: styles.card },
+    h(
+      "div",
+      { style: styles.accountTop },
+      h(AccountAvatar, { url: user?.avatarUrl, name: user?.name }),
+      h(
+        "div",
+        { style: styles.accountIdentity },
+        h("div", { style: styles.accountName }, user?.name || (pending ? t("profileLoading") : t("accountUnknown"))),
+        user?.email ? h("div", { style: styles.accountEmail, title: user.email }, user.email) : null,
+        user?.username ? h("div", { style: styles.accountEmail }, `@${user.username}`) : null
+      ),
+      h("span", { style: styles.badge }, t("authorized"))
+    ),
+    usage ? h(
+      "div",
+      { style: styles.statGrid },
+      h(
+        "div",
+        { style: styles.stat },
+        h("span", { style: styles.statLabel }, t("balance")),
+        h("div", { style: styles.statValue }, formatDuration(t, usage.balanceSeconds))
+      ),
+      h(
+        "div",
+        { style: styles.stat },
+        h("span", { style: styles.statLabel }, t("monthUsed")),
+        h("div", { style: styles.statValue }, formatDuration(t, usage.monthUsedSeconds))
+      ),
+      h(
+        "div",
+        { style: styles.stat },
+        h("span", { style: styles.statLabel }, t("totalUsed")),
+        h("div", { style: styles.statValue }, formatDuration(t, usage.totalUsedSeconds))
+      )
+    ) : null,
+    error ? h("div", { style: { ...styles.error, marginTop: 8 } }, `${t("profileFailed")}\uFF1A${error}`) : null,
+    h(
+      "div",
+      { style: styles.accountFoot },
+      h("span", { style: styles.muted }, authorizedText),
+      h("button", { style: styles.linkBtn, disabled: pending, onClick: onRefresh }, pending ? t("refreshing") : t("refresh"))
+    )
+  );
+}
 function BridgePanel() {
-  const t = createTranslator({});
+  const documentLang = (() => {
+    try {
+      return globalThis.document?.documentElement?.getAttribute?.("lang") ?? "";
+    } catch {
+      return "";
+    }
+  })();
+  const t = React.useMemo(() => createTranslator({}), [documentLang]);
   const [adminToken, setAdminToken] = React.useState("");
   const rpc = React.useCallback((endpoint, payload, signal) => ctxRpc(endpoint, { ...payload ?? {}, ...adminToken ? { adminToken } : {} }, signal), [adminToken]);
   const [status, setStatus] = React.useState(null);
@@ -236,6 +399,10 @@ function BridgePanel() {
   const [showQr, setShowQr] = React.useState(false);
   const [entryQr, setEntryQr] = React.useState("");
   const [passwordDraft, setPasswordDraft] = React.useState("");
+  const [profile, setProfile] = React.useState(null);
+  const [profileLoading, setProfileLoading] = React.useState(false);
+  const [profileError, setProfileError] = React.useState("");
+  const [profileTick, setProfileTick] = React.useState(0);
   const loadAdminToken = React.useCallback(async (port) => {
     if (!port) return;
     try {
@@ -280,6 +447,39 @@ function BridgePanel() {
       cancelled = true;
     };
   }, [adminToken, showQr, status?.openUrl, rpc]);
+  React.useEffect(() => {
+    if (!adminToken || !status?.device?.bound) {
+      setProfile(null);
+      setProfileError("");
+      setProfileLoading(false);
+      return;
+    }
+    let cancelled = false;
+    const load = async () => {
+      setProfileLoading(true);
+      setProfileError("");
+      try {
+        const res = await rpc(RPC_ENDPOINTS.getProfile);
+        if (cancelled) return;
+        if (res?.ok && res.value) setProfile(res.value);
+        else if (res && res.ok === false) setProfileError(res.error?.message ?? t("profileFailed"));
+      } catch (err) {
+        if (!cancelled) setProfileError(err?.message ?? String(err));
+      } finally {
+        if (!cancelled) setProfileLoading(false);
+      }
+    };
+    load().catch(() => {
+    });
+    const timer = setInterval(() => {
+      load().catch(() => {
+      });
+    }, 6e4);
+    return () => {
+      cancelled = true;
+      clearInterval(timer);
+    };
+  }, [adminToken, status?.device?.bound, profileTick, rpc, t]);
   const run = React.useCallback(async (key, fn) => {
     setBusy(key);
     setError("");
@@ -352,6 +552,13 @@ function BridgePanel() {
       h("div", { style: { fontSize: 15, fontWeight: 700 } }, t("subtitle")),
       h("div", { style: styles.muted, marginTop: 4 }, `${PACKAGE_NAME} \xB7 v${status?.version ?? "\u2014"}`)
     ),
+    bound && adminToken ? h(AccountCard, {
+      profile,
+      loading: profileLoading,
+      error: profileError,
+      onRefresh: () => setProfileTick((value) => value + 1),
+      t
+    }) : null,
     h(
       "div",
       { style: styles.card },

package/client/index.js

@@ -24,6 +24,45 @@ const styles = {
   error: { color: 'var(--dsw-alias-state-error-primary, #dc2626)', fontSize: 12, lineHeight: 1.6, wordBreak: 'break-all' },
   muted: { color: 'var(--dsw-alias-label-secondary, #6b7280)', fontSize: 12, lineHeight: 1.6 },
   qr: { width: 168, height: 168, borderRadius: 8, background: '#fff', padding: 6 },
+  accountTop: { display: 'flex', gap: 12, alignItems: 'center' },
+  avatar: {
+    width: 48,
+    height: 48,
+    borderRadius: 999,
+    overflow: 'hidden',
+    flex: '0 0 auto',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    background: 'var(--dsw-alias-bg-secondary, #eef1f5)',
+    color: 'var(--dsw-alias-label-primary, #111827)',
+    fontSize: 18,
+    fontWeight: 700,
+  },
+  avatarImg: { width: '100%', height: '100%', objectFit: 'cover', display: 'block' },
+  accountIdentity: { flex: '1 1 220px', minWidth: 0 },
+  accountName: { fontSize: 14, fontWeight: 600, lineHeight: 1.5, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' },
+  accountEmail: { fontSize: 12, color: 'var(--dsw-alias-label-secondary, #6b7280)', lineHeight: 1.6, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' },
+  statGrid: {
+    display: 'flex',
+    gap: 8,
+    flexWrap: 'wrap',
+    marginTop: 12,
+    paddingTop: 12,
+    borderTop: '1px solid var(--dsw-alias-border-secondary, #e5e7eb)',
+  },
+  stat: { flex: '1 1 120px', minWidth: 0 },
+  statLabel: { display: 'block', fontSize: 12, color: 'var(--dsw-alias-label-secondary, #6b7280)', lineHeight: 1.6 },
+  statValue: { fontSize: 14, fontWeight: 600, lineHeight: 1.5, wordBreak: 'break-word' },
+  accountFoot: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', gap: 8, flexWrap: 'wrap', marginTop: 10 },
+  linkBtn: {
+    padding: 0,
+    border: 'none',
+    background: 'transparent',
+    color: 'var(--dsw-alias-brand-primary, #4f6ef7)',
+    cursor: 'pointer',
+    fontSize: 12,
+  },
 };
 
 function CopyButton({ value, t }) {
@@ -50,8 +89,84 @@ function UrlRow({ label, url, t }) {
   );
 }
 
+function formatDuration(t, seconds) {
+  const total = Math.max(0, Math.floor(Number(seconds) || 0));
+  const hours = Math.floor(total / 3600);
+  const minutes = Math.floor((total % 3600) / 60);
+  if (hours > 0) {
+    return minutes > 0 ? t('durationHoursMinutes', { hours, minutes }) : t('durationHours', { hours });
+  }
+  if (minutes > 0) return t('durationMinutes', { minutes });
+  return t('durationUnderMinute');
+}
+
+function formatDate(iso) {
+  if (!iso) return '';
+  const date = new Date(iso);
+  if (!Number.isFinite(date.getTime())) return '';
+  try { return date.toLocaleDateString(); } catch { return String(iso).slice(0, 10); }
+}
+
+function AccountAvatar({ url, name }) {
+  const [failed, setFailed] = React.useState(false);
+  React.useEffect(() => { setFailed(false); }, [url]);
+  const initial = (name || '?').trim().slice(0, 1).toUpperCase() || '?';
+  return h('div', { style: styles.avatar },
+    url && !failed
+      ? h('img', { src: url, alt: name || '', style: styles.avatarImg, onError: () => setFailed(true) })
+      : h('span', null, initial),
+  );
+}
+
+function AccountCard({ profile, loading, error, onRefresh, t }) {
+  const user = profile?.user;
+  const usage = profile?.usage;
+  const authorization = profile?.authorization;
+  const pending = loading || (!profile && !error);
+  const boundDate = formatDate(authorization?.boundAt);
+  const authorizedText = boundDate
+    ? `${t('authorizedAt', { date: boundDate })}${authorization?.days > 0 ? ` · ${t('authorizedDays', { days: authorization.days })}` : ''}`
+    : '';
+  return h('div', { style: styles.card },
+    h('div', { style: styles.accountTop },
+      h(AccountAvatar, { url: user?.avatarUrl, name: user?.name }),
+      h('div', { style: styles.accountIdentity },
+        h('div', { style: styles.accountName }, user?.name || (pending ? t('profileLoading') : t('accountUnknown'))),
+        user?.email ? h('div', { style: styles.accountEmail, title: user.email }, user.email) : null,
+        user?.username ? h('div', { style: styles.accountEmail }, `@${user.username}`) : null,
+      ),
+      h('span', { style: styles.badge }, t('authorized')),
+    ),
+    usage
+      ? h('div', { style: styles.statGrid },
+        h('div', { style: styles.stat },
+          h('span', { style: styles.statLabel }, t('balance')),
+          h('div', { style: styles.statValue }, formatDuration(t, usage.balanceSeconds)),
+        ),
+        h('div', { style: styles.stat },
+          h('span', { style: styles.statLabel }, t('monthUsed')),
+          h('div', { style: styles.statValue }, formatDuration(t, usage.monthUsedSeconds)),
+        ),
+        h('div', { style: styles.stat },
+          h('span', { style: styles.statLabel }, t('totalUsed')),
+          h('div', { style: styles.statValue }, formatDuration(t, usage.totalUsedSeconds)),
+        ),
+      )
+      : null,
+    error ? h('div', { style: { ...styles.error, marginTop: 8 } }, `${t('profileFailed')}：${error}`) : null,
+    h('div', { style: styles.accountFoot },
+      h('span', { style: styles.muted }, authorizedText),
+      h('button', { style: styles.linkBtn, disabled: pending, onClick: onRefresh }, pending ? t('refreshing') : t('refresh')),
+    ),
+  );
+}
+
 function BridgePanel() {
-  const t = createTranslator({});
+  const documentLang = (() => {
+    try { return globalThis.document?.documentElement?.getAttribute?.('lang') ?? ''; } catch { return ''; }
+  })();
+  // 词典按宿主页面语言缓存：每次渲染新建 translator 会让依赖它的 effect 反复重建。
+  const t = React.useMemo(() => createTranslator({}), [documentLang]);
   // 注意：adminToken 必须先声明——后面 useCallback 的依赖数组会在 Hook 调用时立即求值，
   // 若 state 声明在其后，会在渲染时触发 TDZ（Cannot access before initialization）导致整页白屏。
   const [adminToken, setAdminToken] = React.useState('');
@@ -67,6 +182,10 @@ function BridgePanel() {
   const [showQr, setShowQr] = React.useState(false);
   const [entryQr, setEntryQr] = React.useState('');
   const [passwordDraft, setPasswordDraft] = React.useState('');
+  const [profile, setProfile] = React.useState(null);
+  const [profileLoading, setProfileLoading] = React.useState(false);
+  const [profileError, setProfileError] = React.useState('');
+  const [profileTick, setProfileTick] = React.useState(0);
 
   const loadAdminToken = React.useCallback(async (port) => {
     if (!port) return;
@@ -108,6 +227,34 @@ function BridgePanel() {
     return () => { cancelled = true; };
   }, [adminToken, showQr, status?.openUrl, rpc]);
 
+  // 授权成功后显示账号资料与时长：首次进入 / 手动刷新 / 每 60 秒拉一次。
+  React.useEffect(() => {
+    if (!adminToken || !status?.device?.bound) {
+      setProfile(null);
+      setProfileError('');
+      setProfileLoading(false);
+      return;
+    }
+    let cancelled = false;
+    const load = async () => {
+      setProfileLoading(true);
+      setProfileError('');
+      try {
+        const res = await rpc(RPC_ENDPOINTS.getProfile);
+        if (cancelled) return;
+        if (res?.ok && res.value) setProfile(res.value);
+        else if (res && res.ok === false) setProfileError(res.error?.message ?? t('profileFailed'));
+      } catch (err) {
+        if (!cancelled) setProfileError(err?.message ?? String(err));
+      } finally {
+        if (!cancelled) setProfileLoading(false);
+      }
+    };
+    load().catch(() => {});
+    const timer = setInterval(() => { load().catch(() => {}); }, 60_000);
+    return () => { cancelled = true; clearInterval(timer); };
+  }, [adminToken, status?.device?.bound, profileTick, rpc, t]);
+
   const run = React.useCallback(async (key, fn) => {
     setBusy(key);
     setError('');
@@ -165,6 +312,14 @@ function BridgePanel() {
       h('div', { style: styles.muted, marginTop: 4 }, `${PACKAGE_NAME} · v${status?.version ?? '—'}`),
     ),
 
+    bound && adminToken ? h(AccountCard, {
+      profile,
+      loading: profileLoading,
+      error: profileError,
+      onRefresh: () => setProfileTick((value) => value + 1),
+      t,
+    }) : null,
+
     h('div', { style: styles.card },
       h('div', { style: styles.row },
         h('span', { style: styles.badge }, `${t('status')}: ${stateText}`),

package/client/locales.mjs

@@ -48,6 +48,21 @@ export const zh = {
   status: '状态',
   version: '版本',
   loadFailed: '无法连接插件 RPC',
+  authorized: '已授权',
+  balance: '剩余时长',
+  monthUsed: '本月已用',
+  totalUsed: '累计已用',
+  authorizedAt: '授权于 ${date}',
+  authorizedDays: '已授权 ${days} 天',
+  profileLoading: '正在读取账号信息…',
+  profileFailed: '账号信息读取失败',
+  accountUnknown: '账号',
+  refresh: '刷新',
+  refreshing: '刷新中…',
+  durationHours: '${hours} 小时',
+  durationHoursMinutes: '${hours} 小时 ${minutes} 分',
+  durationMinutes: '${minutes} 分钟',
+  durationUnderMinute: '不足 1 分钟',
 };
 
 export const en = {
@@ -99,6 +114,21 @@ export const en = {
   status: 'Status',
   version: 'Version',
   loadFailed: 'Cannot reach plugin RPC',
+  authorized: 'Authorized',
+  balance: 'Time left',
+  monthUsed: 'Used this month',
+  totalUsed: 'Total used',
+  authorizedAt: 'Authorized ${date}',
+  authorizedDays: '${days} days since authorization',
+  profileLoading: 'Loading account…',
+  profileFailed: 'Failed to load account',
+  accountUnknown: 'Account',
+  refresh: 'Refresh',
+  refreshing: 'Refreshing…',
+  durationHours: '${hours} h',
+  durationHoursMinutes: '${hours} h ${minutes} min',
+  durationMinutes: '${minutes} min',
+  durationUnderMinute: '< 1 min',
 };
 
 export function detectLang(host = {}) {

package/lib/identity.js

@@ -20,6 +20,7 @@ export const RPC_ENDPOINTS = Object.freeze({
   getAccessUrl: 'getAccessUrl',
   startLogin: 'startLogin',
   getEntryQr: 'getEntryQr',
+  getProfile: 'getProfile',
   setAccessPassword: 'setAccessPassword',
   clearAccessPassword: 'clearAccessPassword',
 });

package/lib/index.js

@@ -21,6 +21,7 @@ import { SaasTunnelClient } from './saas/tunnel-client.mjs';
 import {
   claimDeviceCode,
   fetchDeviceCodeStatus,
+  fetchDeviceProfile,
   maskDeviceSecret,
   normalizeSaasBaseUrl,
   refreshDeviceToken,
@@ -68,6 +69,13 @@ function registerRpc(ctx, handler, logger) {
   }
 }
 
+let lastApplyState = null;
+
+/** 仅供单测读取 apply 产出的实例（宿主不允许 apply 返回值，见下方注释）。 */
+export function getApplyState() {
+  return lastApplyState;
+}
+
 export async function apply(ctx, pluginConfig = {}) {
   const logger = ctx?.logger?.(name) ?? console;
   const dshPort = Number(ctx?.webServer?.port) || Number(pluginConfig.targetPort) || 3080;
@@ -369,6 +377,21 @@ export async function apply(ctx, pluginConfig = {}) {
           }
           return ok({ url, token: config.access.token, qrDataUrl });
         }
+        case RPC_ENDPOINTS.getProfile: {
+          if (!config.deviceId || !config.deviceSecret) {
+            return fail('bad-request', '尚未绑定设备：请先登录授权');
+          }
+          // 账号资料是展示信息：失败只回给面板，不写 lastError 干扰隧道状态。
+          try {
+            return ok(await fetchDeviceProfile({
+              gatewayUrl: gatewayBase(),
+              deviceId: config.deviceId,
+              secret: config.deviceSecret,
+            }));
+          } catch (err) {
+            return errorPayload(err);
+          }
+        }
         case RPC_ENDPOINTS.setAccessPassword: {
           const password = String(payload?.password ?? '');
           if (password.length < 6) return fail('bad-request', '访问密码至少 6 位');
@@ -404,7 +427,10 @@ export async function apply(ctx, pluginConfig = {}) {
   };
   try { ctx.effect?.(() => dispose, `${PLUGIN_ID}: lifecycle`); } catch {}
 
-  return { gate, dispose };
+  // 宿主（cordis）会把 async apply 的解析值当作 disposer 处理，返回对象会抛
+  // TypeError: Invalid effect，导致 "entry did not activate"。这里只暴露给单测，不返回值。
+  lastApplyState = { gate, dispose };
+  return undefined;
 }
 
 export { GateProxy } from './gate.js';

package/lib/saas/device-auth.mjs

@@ -5,6 +5,7 @@
 //   GET  /api/saas/device/code/:code       → { status: pending|approved|consumed|expired }
 //   POST /api/saas/device/code/:code/claim → { deviceId, secret, tunnel:{publicId,name} }
 //   POST /api/saas/device/token            → { token, expiresAt, tunnel, gateway:{url,path} }
+//   POST /api/saas/device/profile          → { user, usage, authorization, serverTime }
 //
 // 本模块只负责 HTTP 与状态判定，不做落盘：deviceSecret 由调用方写进 config.json
 // （lib/index.js 的 updateConfig → writeConfig 固定 mode=0600，与现有配置落盘方式一致）。
@@ -304,6 +305,65 @@ function normalizeTunnel(tunnel) {
   return { publicId, name };
 }
 
+function nonNegativeInt(value) {
+  const parsed = Number(value);
+  return Number.isFinite(parsed) && parsed > 0 ? Math.floor(parsed) : 0;
+}
+
+/**
+ * 读取绑定账号资料（授权后展示）：POST /api/saas/device/profile。
+ * 服务端已按 deviceId+secret 校验并要求 active；这里只做字段归一化，
+ * 头像只接受 http(s) / data:image（面板渲染失败会回退首字母）。
+ *
+ * @param {object} options
+ * @param {string} options.gatewayUrl
+ * @param {string} options.deviceId
+ * @param {string} options.secret
+ * @param {Function} [options.fetchImpl]
+ * @param {AbortSignal} [options.signal]
+ * @param {number} [options.timeoutMs]
+ * @returns {Promise<{user:{id:string,name:string,email:string,username:string|null,avatarUrl:string|null}, usage:{balanceSeconds:number,monthUsedSeconds:number,totalUsedSeconds:number}, authorization:{boundAt:string,days:number}, serverTime:string}>}
+ */
+export async function fetchDeviceProfile({ gatewayUrl, deviceId, secret, fetchImpl, signal, timeoutMs } = {}) {
+  const base = normalizeSaasBaseUrl(gatewayUrl);
+  const id = String(deviceId ?? '').trim();
+  const value = String(secret ?? '');
+  if (!id || !value) {
+    throw new SaasAuthError('设备尚未绑定：缺少 deviceId/deviceSecret', { code: 'auth_failed', terminal: true });
+  }
+  const data = await requestJson({
+    url: `${base}/api/saas/device/profile`,
+    method: 'POST',
+    body: { deviceId: id, secret: value },
+    fetchImpl,
+    signal,
+    timeoutMs,
+  });
+  const user = data?.user && typeof data.user === 'object' ? data.user : {};
+  const usage = data?.usage && typeof data.usage === 'object' ? data.usage : {};
+  const authorization = data?.authorization && typeof data.authorization === 'object' ? data.authorization : {};
+  const avatar = typeof user.avatarUrl === 'string' ? user.avatarUrl : '';
+  return {
+    user: {
+      id: String(user.id ?? ''),
+      name: String(user.name ?? '').trim(),
+      email: String(user.email ?? '').trim(),
+      username: user.username ? String(user.username).trim() : null,
+      avatarUrl: /^(https?:\/\/|data:image\/)/i.test(avatar) ? avatar : null,
+    },
+    usage: {
+      balanceSeconds: nonNegativeInt(usage.balanceSeconds),
+      monthUsedSeconds: nonNegativeInt(usage.monthUsedSeconds),
+      totalUsedSeconds: nonNegativeInt(usage.totalUsedSeconds),
+    },
+    authorization: {
+      boundAt: typeof authorization.boundAt === 'string' ? authorization.boundAt : '',
+      days: nonNegativeInt(authorization.days),
+    },
+    serverTime: typeof data?.serverTime === 'string' ? data.serverTime : '',
+  };
+}
+
 function defaultSleep(ms) {
   return new Promise((resolve) => {
     const timer = setTimeout(resolve, ms);

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@qzsy/dsh-bridge",
-  "version": "3.1.0",
+  "version": "3.2.0",
   "description": "DSH 远程隧道云官方客户端插件：一条命令把本机 DeepSeek Harness 接入云端隧道（设备码绑定、短期令牌、本地门禁代理、HTTP/SSE/WebSocket 反向隧道）。",
-  "releaseNotes": "【v3.1.0】无感登录授权与扫码进入\\n• 面板新增「立即登录授权」：自动申请设备码、浏览器授权、绑定后自动开隧道，无需输入设备码或设置本地口令\\n• 新增扫码入口二维码：https://<控制面>/open/<publicId>，扫码登录 SaaS 账号即可进入隧道\\n• 网关信任头 x-qzsy-gate（HMAC-SHA256，±60 秒）：验签通过即免本地口令，未验签隧道来源一律 401\\n• hello-ack 支持 gate.secret 每连接随机下发；改口令/断线自动清理信任密钥\\n• 本地口令降级为可选「高级」局域网能力",
+  "releaseNotes": "【v3.2.0】授权后显示账号与时长\\n• 面板新增账号卡片：授权成功后显示头像、昵称、邮箱/用户名\\n• 显示剩余时长、本月已用、累计已用与授权时间，每 60 秒自动刷新，也可手动刷新\\n• 控制面新增 POST /api/saas/device/profile（设备凭据鉴权，隔离边界仍为 device.userId）\\n• 头像加载失败回退首字母；相对路径头像由控制面补全为绝对地址",
   "type": "module",
   "main": "lib/index.js",
   "exports": {
@@ -68,7 +68,7 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/qzsy/dsh-remote.git",
+    "url": "git+https://github.com/qzsy/dsh-remote.git",
     "directory": "packages/dsh-bridge"
   },
   "homepage": "https://github.com/qzsy/dsh-remote#readme",