py-web-ssh 0.1.2__tar.gz → 0.1.4__tar.gz

{py_web_ssh-0.1.2 → py_web_ssh-0.1.4}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: py-web-ssh
-Version: 0.1.2
+Version: 0.1.4
 Summary: A Python web SSH client with xterm.js, reconnectable sessions, logs, and file transfer.
 License-Expression: MIT
 License-File: LICENSE
@@ -35,6 +35,8 @@ Description-Content-Type: text/markdown
 - 日志页面：`/sessions/{uuid}/logs` 展示完整连接、认证、错误和文件传输日志。
 - 文件传输：优先 SFTP；SFTP 不可用时参考 `simple-ssh-copy` 思路，使用远端 `base64` shell 命令 fallback 上传/下载。
 - 可选 PIN 门禁：服务端传入 `--pin` 后，网页启动时必须先输入正确 PIN；验证成功后浏览器会保存加盐哈希 cookie，后端会保护 HTTP API、日志页面、文件接口和 WebSocket。
+- 浏览器客户端 session：首次访问时服务端会分配独立的浏览器 session UUID，并写入 HttpOnly cookie；它与 SSH 会话 UUID 分离。
+- 左侧控制面板：连接、会话、文件三个栏目改为互斥折叠面板，一次最多展开一个，也可以全部折叠。
 
 ## 安装
 

{py_web_ssh-0.1.2 → py_web_ssh-0.1.4}/README.md

@@ -12,7 +12,9 @@
 - 终端恢复：服务端保存 SSH 输出流，浏览器定期回传 xterm serialize 快照；重连时先恢复快照，再补放快照之后的输出。
 - 日志页面：`/sessions/{uuid}/logs` 展示完整连接、认证、错误和文件传输日志。
 - 文件传输：优先 SFTP；SFTP 不可用时参考 `simple-ssh-copy` 思路，使用远端 `base64` shell 命令 fallback 上传/下载。
-- 可选 PIN 门禁：服务端传入 `--pin` 后，网页启动时必须先输入正确 PIN；验证成功后浏览器会保存加盐哈希 cookie，后端会保护 HTTP API、日志页面、文件接口和 WebSocket。
+- 可选 PIN 门禁：服务端传入 `--pin` 后，网页启动时必须先输入正确 PIN；验证成功后浏览器会保存加盐哈希 cookie，后端会保护 HTTP API、日志页面、文件接口和 WebSocket。
+- 浏览器客户端 session：首次访问时服务端会分配独立的浏览器 session UUID，并写入 HttpOnly cookie；它与 SSH 会话 UUID 分离。
+- 左侧控制面板：连接、会话、文件三个栏目改为互斥折叠面板，一次最多展开一个，也可以全部折叠。
 
 ## 安装
 

{py_web_ssh-0.1.2 → py_web_ssh-0.1.4}/pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "py-web-ssh"
-version = "0.1.2"
+version = "0.1.4"
 description = "A Python web SSH client with xterm.js, reconnectable sessions, logs, and file transfer."
 readme = "README.md"
 requires-python = ">=3.10"

{py_web_ssh-0.1.2 → py_web_ssh-0.1.4}/webssh/__init__.py

@@ -2,4 +2,4 @@
 
 __all__ = ["__version__"]
 
-__version__ = "0.1.2"
+__version__ = "0.1.4"

{py_web_ssh-0.1.2 → py_web_ssh-0.1.4}/webssh/app.py

@@ -13,6 +13,7 @@ from fastapi.staticfiles import StaticFiles
 from . import __version__
 from . import auth
 from .auth import add_pin_argument, configure_pin
+from .client_session import ensure_client_session_cookie
 from .files import download_file, filename_for_download, upload_file
 from .models import ConnectRequest, CreateSessionResponse, FileTransferResponse
 from .session import SessionManager
@@ -32,9 +33,18 @@ sessions = SessionManager()
 @app.middleware("http")
 async def require_pin_cookie(request: Request, call_next):
     path = request.url.path
-    if path.startswith("/static/") or path in PUBLIC_PATHS or auth.pin_auth.is_request_authorized(request):
-        return await call_next(request)
-    return JSONResponse({"detail": "PIN authentication required."}, status_code=401)
+    if not (
+        path.startswith("/static/")
+        or path in PUBLIC_PATHS
+        or auth.pin_auth.is_request_authorized(request)
+    ):
+        response = JSONResponse({"detail": "PIN authentication required."}, status_code=401)
+        ensure_client_session_cookie(request, response)
+        return response
+
+    response = await call_next(request)
+    ensure_client_session_cookie(request, response)
+    return response
 
 
 @app.get("/", response_class=HTMLResponse)

py_web_ssh-0.1.4/webssh/client_session.py

@@ -0,0 +1,64 @@
+from __future__ import annotations
+
+import secrets
+import threading
+import uuid
+from dataclasses import dataclass, field
+from datetime import datetime, timezone
+
+from fastapi import Request
+from fastapi.responses import Response
+
+
+COOKIE_NAME = "py_web_ssh_client_session"
+
+
+@dataclass
+class ClientSession:
+    session_id: str
+    created_at: datetime = field(default_factory=lambda: datetime.now(timezone.utc))
+    updated_at: datetime = field(default_factory=lambda: datetime.now(timezone.utc))
+
+
+class ClientSessionStore:
+    def __init__(self) -> None:
+        self._lock = threading.RLock()
+        self._sessions: dict[str, ClientSession] = {}
+
+    def get_or_create(self, session_id: str | None) -> tuple[ClientSession, bool]:
+        with self._lock:
+            if session_id and session_id in self._sessions:
+                session = self._sessions[session_id]
+                session.updated_at = datetime.now(timezone.utc)
+                return session, False
+
+            session = ClientSession(session_id=str(uuid.uuid4()))
+            self._sessions[session.session_id] = session
+            return session, True
+
+    def get(self, session_id: str) -> ClientSession | None:
+        with self._lock:
+            return self._sessions.get(session_id)
+
+    def count(self) -> int:
+        with self._lock:
+            return len(self._sessions)
+
+
+client_sessions = ClientSessionStore()
+
+
+def ensure_client_session_cookie(request: Request, response: Response) -> ClientSession:
+    session, created = client_sessions.get_or_create(request.cookies.get(COOKIE_NAME))
+    request.state.client_session_id = session.session_id
+    if created:
+        response.set_cookie(
+            COOKIE_NAME,
+            session.session_id,
+            httponly=True,
+            samesite="lax",
+            secure=False,
+            path="/",
+            max_age=30 * 24 * 60 * 60,
+        )
+    return session

{py_web_ssh-0.1.2 → py_web_ssh-0.1.4}/webssh/static/app.js

@@ -8,6 +8,7 @@ const pinGate = document.querySelector("#pin-gate");
 const pinForm = document.querySelector("#pin-form");
 const pinInput = document.querySelector("#pin-input");
 const pinError = document.querySelector("#pin-error");
+const panelToggles = document.querySelectorAll(".panel-toggle");
 
 const term = new Terminal({
   cursorBlink: true,
@@ -56,6 +57,7 @@ if (activeSessionId) {
 }
 
 checkPinGate();
+bindControlPanels();
 
 window.addEventListener("resize", () => {
   fitAddon.fit();
@@ -162,15 +164,31 @@ document.querySelector("#upload-form").addEventListener("submit", async (event)
   setStatus(response.ok ? "上传完成" : "上传失败");
 });
 
-document.querySelector("#download-form").addEventListener("submit", (event) => {
+document.querySelector("#download-form").addEventListener("submit", async (event) => {
   event.preventDefault();
   const remotePath = valueOf("#download-path");
   if (!activeSessionId || !remotePath) {
     appendLogLine("下载需要会话 UUID 和远端路径。");
     return;
   }
-  window.location.href =
-    `/api/sessions/${activeSessionId}/files/download?remote_path=${encodeURIComponent(remotePath)}`;
+  setStatus("下载中...");
+  const response = await fetch(
+    `/api/sessions/${activeSessionId}/files/download?remote_path=${encodeURIComponent(remotePath)}`,
+  );
+  if (!response.ok) {
+    appendLogLine(`下载失败: ${await response.text()}`);
+    setStatus("下载失败");
+    return;
+  }
+  const blob = await response.blob();
+  const link = document.createElement("a");
+  link.href = URL.createObjectURL(blob);
+  link.download = filenameFromResponse(response, remotePath);
+  document.body.appendChild(link);
+  link.click();
+  link.remove();
+  URL.revokeObjectURL(link.href);
+  setStatus("下载完成");
 });
 
 document.querySelectorAll(".tab").forEach((button) => {
@@ -185,6 +203,42 @@ document.querySelectorAll(".tab").forEach((button) => {
   });
 });
 
+function bindControlPanels() {
+  panelToggles.forEach((button) => {
+    button.addEventListener("click", () => {
+      const panelId = button.getAttribute("aria-controls");
+      const isOpen = button.getAttribute("aria-expanded") === "true";
+      closeControlPanels();
+      if (!isOpen) {
+        openControlPanel(panelId);
+      }
+    });
+  });
+
+  document.querySelectorAll("[data-open-panel]").forEach((button) => {
+    button.addEventListener("click", () => {
+      openControlPanel(button.dataset.openPanel);
+    });
+  });
+}
+
+function openControlPanel(panelId) {
+  closeControlPanels();
+  const panel = document.querySelector(`#${panelId}`);
+  const toggle = document.querySelector(`[aria-controls="${panelId}"]`);
+  if (!panel || !toggle) return;
+  panel.hidden = false;
+  toggle.setAttribute("aria-expanded", "true");
+}
+
+function closeControlPanels() {
+  panelToggles.forEach((button) => {
+    button.setAttribute("aria-expanded", "false");
+    const panel = document.querySelector(`#${button.getAttribute("aria-controls")}`);
+    if (panel) panel.hidden = true;
+  });
+}
+
 function connectWebSocket(sessionId) {
   if (ws) {
     sendSnapshot();
@@ -329,6 +383,13 @@ function checked(selector) {
   return document.querySelector(selector).checked;
 }
 
+function filenameFromResponse(response, fallbackPath) {
+  const disposition = response.headers.get("Content-Disposition") || "";
+  const match = disposition.match(/filename="([^"]+)"/);
+  if (match) return match[1];
+  return fallbackPath.split("/").filter(Boolean).pop() || "download.bin";
+}
+
 function bytesToBase64(bytes) {
   let binary = "";
   const size = 0x8000;

py_web_ssh-0.1.4/webssh/static/index.html

@@ -0,0 +1,156 @@
+<!doctype html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>py-web-ssh</title>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@xterm/xterm@5.5.0/css/xterm.css" />
+    <link rel="stylesheet" href="/static/styles.css" />
+  </head>
+  <body>
+    <div id="pin-gate" class="pin-gate" aria-live="polite">
+      <form id="pin-form" class="pin-box">
+        <h2>PIN required</h2>
+        <label>
+          PIN
+          <input id="pin-input" type="password" autocomplete="current-password" />
+        </label>
+        <button class="primary" type="submit">Unlock</button>
+        <p id="pin-error" class="pin-error"></p>
+      </form>
+    </div>
+    <main class="app-shell">
+      <aside class="sidebar">
+        <header class="brand">
+          <h1>py-web-ssh</h1>
+          <p>Web SSH client</p>
+        </header>
+
+        <section class="panel collapsible-panel">
+          <button class="panel-toggle" type="button" aria-expanded="false" aria-controls="connect-panel">
+            连接
+          </button>
+          <div id="connect-panel" class="stack panel-body" hidden>
+            <div class="section-tabs" aria-label="连接栏目">
+              <button class="section-tab active" type="button">连接</button>
+              <button class="section-tab" type="button" data-open-panel="session-panel">会话</button>
+              <button class="section-tab" type="button" data-open-panel="files-panel">文件</button>
+            </div>
+            <form id="connect-form" class="stack">
+              <label>
+                目标服务器
+                <input id="host" name="host" required autocomplete="off" placeholder="192.168.1.10" />
+              </label>
+              <div class="grid-2">
+                <label>
+                  端口
+                  <input id="port" name="port" type="number" min="1" max="65535" value="22" required />
+                </label>
+                <label>
+                  用户名
+                  <input id="username" name="username" required autocomplete="username" />
+                </label>
+              </div>
+              <label>
+                口令
+                <input id="password" name="password" type="password" autocomplete="current-password" />
+              </label>
+              <label>
+                私钥文件
+                <input id="private-key-file" name="private-key-file" type="file" />
+              </label>
+              <label>
+                私钥口令
+                <input id="private-key-passphrase" name="private-key-passphrase" type="password" />
+              </label>
+              <div class="checks">
+                <label><input id="legacy-algorithms" type="checkbox" checked /> legacy 算法</label>
+                <label><input id="allow-agent" type="checkbox" /> SSH agent</label>
+                <label><input id="look-for-keys" type="checkbox" /> 服务端本机密钥</label>
+                <label><input id="strict-host-key" type="checkbox" /> known_hosts 校验</label>
+              </div>
+              <button class="primary" type="submit">连接</button>
+            </form>
+          </div>
+        </section>
+
+        <section class="panel collapsible-panel">
+          <button class="panel-toggle" type="button" aria-expanded="false" aria-controls="session-panel">
+            会话
+          </button>
+          <div id="session-panel" class="stack panel-body" hidden>
+            <div class="section-tabs" aria-label="会话栏目">
+              <button class="section-tab" type="button" data-open-panel="connect-panel">连接</button>
+              <button class="section-tab active" type="button">会话</button>
+              <button class="section-tab" type="button" data-open-panel="files-panel">文件</button>
+            </div>
+            <label>
+              UUID
+              <input id="session-id" autocomplete="off" spellcheck="false" />
+            </label>
+            <div class="button-row">
+              <button id="reconnect" type="button">重连</button>
+              <button id="disconnect" type="button">断开 SSH</button>
+            </div>
+            <a id="logs-link" class="quiet-link" href="#" target="_blank" rel="noreferrer">打开完整日志</a>
+          </div>
+        </section>
+
+        <section class="panel collapsible-panel">
+          <button class="panel-toggle" type="button" aria-expanded="false" aria-controls="files-panel">
+            文件
+          </button>
+          <div id="files-panel" class="panel-body" hidden>
+            <div class="section-tabs" aria-label="文件栏目">
+              <button class="section-tab" type="button" data-open-panel="connect-panel">连接</button>
+              <button class="section-tab" type="button" data-open-panel="session-panel">会话</button>
+              <button class="section-tab active" type="button">文件</button>
+            </div>
+            <form id="upload-form" class="stack">
+              <label>
+                上传到远端路径
+                <input id="upload-path" placeholder="/tmp/file.txt" />
+              </label>
+              <label>
+                本地文件
+                <input id="upload-file" type="file" />
+              </label>
+              <button type="submit">上传</button>
+            </form>
+            <form id="download-form" class="stack compact">
+              <label>
+                下载远端路径
+                <input id="download-path" placeholder="/tmp/file.txt" />
+              </label>
+              <button type="submit">下载</button>
+            </form>
+          </div>
+        </section>
+      </aside>
+
+      <section class="workspace">
+        <div class="toolbar">
+          <div>
+            <strong id="status">未连接</strong>
+            <span id="session-label"></span>
+          </div>
+          <div class="tabs" role="tablist">
+            <button class="tab active" data-tab="terminal" type="button">终端</button>
+            <button class="tab" data-tab="logs" type="button">日志</button>
+          </div>
+        </div>
+        <div id="terminal-pane" class="pane active">
+          <div id="terminal"></div>
+        </div>
+        <div id="logs-pane" class="pane">
+          <pre id="logs"></pre>
+        </div>
+      </section>
+    </main>
+
+    <script src="https://cdn.jsdelivr.net/npm/@xterm/xterm@5.5.0/lib/xterm.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/@xterm/addon-fit@0.10.0/lib/addon-fit.min.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/@xterm/addon-serialize@0.13.0/lib/addon-serialize.min.js"></script>
+    <script src="/static/app.js"></script>
+  </body>
+</html>

{py_web_ssh-0.1.2 → py_web_ssh-0.1.4}/webssh/static/styles.css

@@ -136,7 +136,51 @@ label {
 
 .panel {
   display: grid;
-  gap: 12px;
+  gap: 8px;
+}
+
+.panel-toggle {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  min-height: 38px;
+  font-weight: 700;
+}
+
+.panel-toggle::after {
+  content: "+";
+  color: var(--muted);
+}
+
+.panel-toggle[aria-expanded="true"]::after {
+  content: "-";
+}
+
+.panel-body {
+  display: grid;
+  gap: 10px;
+}
+
+.panel-body[hidden] {
+  display: none;
+}
+
+.section-tabs {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 6px;
+}
+
+.section-tab {
+  min-height: 30px;
+  padding: 0 6px;
+  font-size: 12px;
+}
+
+.section-tab.active {
+  border-color: var(--accent);
+  color: var(--accent);
 }
 
 .panel h2 {

py_web_ssh-0.1.2/webssh/static/index.html

@@ -1,131 +0,0 @@
-<!doctype html>
-<html lang="zh-CN">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>py-web-ssh</title>
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@xterm/xterm@5.5.0/css/xterm.css" />
-    <link rel="stylesheet" href="/static/styles.css" />
-  </head>
-  <body>
-    <div id="pin-gate" class="pin-gate" aria-live="polite">
-      <form id="pin-form" class="pin-box">
-        <h2>PIN required</h2>
-        <label>
-          PIN
-          <input id="pin-input" type="password" autocomplete="current-password" />
-        </label>
-        <button class="primary" type="submit">Unlock</button>
-        <p id="pin-error" class="pin-error"></p>
-      </form>
-    </div>
-    <main class="app-shell">
-      <aside class="sidebar">
-        <header class="brand">
-          <h1>py-web-ssh</h1>
-          <p>Web SSH client</p>
-        </header>
-
-        <section class="panel">
-          <h2>连接</h2>
-          <form id="connect-form" class="stack">
-            <label>
-              目标服务器
-              <input id="host" name="host" required autocomplete="off" placeholder="192.168.1.10" />
-            </label>
-            <div class="grid-2">
-              <label>
-                端口
-                <input id="port" name="port" type="number" min="1" max="65535" value="22" required />
-              </label>
-              <label>
-                用户名
-                <input id="username" name="username" required autocomplete="username" />
-              </label>
-            </div>
-            <label>
-              口令
-              <input id="password" name="password" type="password" autocomplete="current-password" />
-            </label>
-            <label>
-              私钥文件
-              <input id="private-key-file" name="private-key-file" type="file" />
-            </label>
-            <label>
-              私钥口令
-              <input id="private-key-passphrase" name="private-key-passphrase" type="password" />
-            </label>
-            <div class="checks">
-              <label><input id="legacy-algorithms" type="checkbox" checked /> legacy 算法</label>
-              <label><input id="allow-agent" type="checkbox" /> SSH agent</label>
-              <label><input id="look-for-keys" type="checkbox" /> 服务端本机密钥</label>
-              <label><input id="strict-host-key" type="checkbox" /> known_hosts 校验</label>
-            </div>
-            <button class="primary" type="submit">连接</button>
-          </form>
-        </section>
-
-        <section class="panel">
-          <h2>会话</h2>
-          <div class="stack">
-            <label>
-              UUID
-              <input id="session-id" autocomplete="off" spellcheck="false" />
-            </label>
-            <div class="button-row">
-              <button id="reconnect" type="button">重连</button>
-              <button id="disconnect" type="button">断开 SSH</button>
-            </div>
-            <a id="logs-link" class="quiet-link" href="#" target="_blank" rel="noreferrer">打开完整日志</a>
-          </div>
-        </section>
-
-        <section class="panel">
-          <h2>文件</h2>
-          <form id="upload-form" class="stack">
-            <label>
-              上传到远端路径
-              <input id="upload-path" placeholder="/tmp/file.txt" />
-            </label>
-            <label>
-              本地文件
-              <input id="upload-file" type="file" />
-            </label>
-            <button type="submit">上传</button>
-          </form>
-          <form id="download-form" class="stack compact">
-            <label>
-              下载远端路径
-              <input id="download-path" placeholder="/tmp/file.txt" />
-            </label>
-            <button type="submit">下载</button>
-          </form>
-        </section>
-      </aside>
-
-      <section class="workspace">
-        <div class="toolbar">
-          <div>
-            <strong id="status">未连接</strong>
-            <span id="session-label"></span>
-          </div>
-          <div class="tabs" role="tablist">
-            <button class="tab active" data-tab="terminal" type="button">终端</button>
-            <button class="tab" data-tab="logs" type="button">日志</button>
-          </div>
-        </div>
-        <div id="terminal-pane" class="pane active">
-          <div id="terminal"></div>
-        </div>
-        <div id="logs-pane" class="pane">
-          <pre id="logs"></pre>
-        </div>
-      </section>
-    </main>
-
-    <script src="https://cdn.jsdelivr.net/npm/@xterm/xterm@5.5.0/lib/xterm.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/@xterm/addon-fit@0.10.0/lib/addon-fit.min.js"></script>
-    <script src="https://cdn.jsdelivr.net/npm/@xterm/addon-serialize@0.13.0/lib/addon-serialize.min.js"></script>
-    <script src="/static/app.js"></script>
-  </body>
-</html>