前言¶
DeepSeek Harness 的 Web 模式主要用於可視化調試智能體。在實際使用中，開發者容易忽略狀態變更（如會話完成、工具申請審批、AI 詢問），且界面缺乏定製化選項，文件變更的查看方式也較爲原始。dsh-web-extras 是一個瀏覽器端插件，通過補充即時通知、外觀定製和按輪次聚合的文件變更視圖，解決這些 Web 界面的痛點。
核心功能¶
該插件提供三個主要功能模塊：
- 完成/審批/提問提醒：針對會話完成、工具申請審批、AI 向你提問三種場景，播放不同的提示音（音效各異，可開關試聽），並彈出立繪圖片。立繪支持上傳、裁剪、翻轉。
- 外觀定製：支持背景圖（URL 或本地）的水平翻轉、縮放、位置調整及透明度設置。可調節側邊欄、氣泡、輸入區、代碼塊的透明度，以及輸入區失焦摺疊。
- 文件變更視圖：按「輪次」聚合 Agent 的文件修改（write / edit / str_replace_editor）。提供行級差異（增行綠色、刪行紅色）和修改前後代碼高亮對比，支持並排查看。
安裝與啓用¶
安裝前需確保已安裝 DSH CLI 並使用 Web 模式 (dsh --profile web)。
dsh plugin --profile web add github:LimBoo233/dsh-web-extras
安裝完成後，重啓 dsh 並刷新瀏覽器頁面即可生效。
典型用法¶
安裝後，瀏覽器設置頁會出現兩個新入口，會話頁籤中會出現「文件變更」頁籤。
- 配置提醒：在設置頁的「提醒設置」中，爲三種事件分別開啓音效和立繪。支持上傳本地圖片，並使用裁剪工具調整立繪大小與位置。若立繪意外消失，點擊「裁剪並保存」即可恢復。
- 定製外觀：在「外觀」設置中，輸入背景圖 URL 或上傳本地圖片，通過實時預覽調整縮放、位置、翻轉及透明度。展開「高級選項」可統一調節界面透明度及輸入區摺疊行爲。
- 查看文件變更：在會話頁籤點擊「文件變更」，按輪次查看文件列表。展開文件後，可同時開啓「行級差異」和「高亮對比」視圖進行左右對比。高亮對比默認只顯示「修改後」，「修改前」可展開。
適用場景與注意¶
- 純瀏覽器端實現：該插件爲 Client 插件，不含 Host 側代碼。所有配置與圖片數據保存在本地瀏覽器（localStorage/IndexedDB），不經過任何服務器。
- 數據隱私：提示音由 Web Audio 實時合成，不依賴音頻文件。數據僅存於本瀏覽器，清除瀏覽器數據或更換設備後丟失。
- 兼容性：背景圖水平翻轉對本地圖片無限制；對 URL 圖片要求服務器允許跨域讀取（CORS），否則會自動降級。
總結¶
dsh-web-extras 通過補充 Web 界面的交互反饋和可視化能力，提升了調試智能體的體驗。適合需要在調試過程中獲得即時通知、自定義界面風格以及清晰文件變更記錄的開發者。
