前言¶
在 DeepSeek Harness (DSH) 的開發流程中，遠程設備配對通常需要打開一個新的瀏覽器標籤頁，或者手動訪問特定的本地端口地址。這種方式會打斷當前的工作流，增加操作步驟。
DSH-QrPairing 插件通過在 WebUI 右下角添加一個懸浮入口，將配對流程集成在應用界面內部。它作爲 dsh-remote-link 網關的配套 UI，提供更連貫的操作體驗。
插件簡介¶
這是由 huaxiren6 維護的一個客戶端 UI 插件。它不直接處理配對邏輯，而是負責將配對入口注入到桌面端 WebUI 中。通過點擊懸浮按鈕，用戶可以在應用內彈出一個浮層，直接查看配對二維碼。
核心功能¶
- 懸浮入口：在 DSH WebUI 右下角顯示懸浮按鈕。
- 內嵌浮層：點擊按鈕後，在當前頁面彈出浮層展示配對二維碼，無需切換標籤頁。
- 環境限制：按鈕僅在通過
127.0.0.1或localhost訪問時顯示。 - 容錯處理：如果系統未檢測到
dsh-remote-link網關，浮層會顯示“未檢測到網關”的提示，而不是報錯或空白。 - 實時數據：浮層內的二維碼和短碼通過同源代理實時獲取。
安裝與啓用¶
在安裝本插件之前，必須確保已安裝 dsh-remote-link 網關插件。
執行以下命令安裝：
dsh plugin --profile web add github:BotonJ/dsh-remote-link
dsh plugin --profile web add dsh-remote-qr-button
典型用法¶
- 確保以本地模式啓動 DSH WebUI。
- 在瀏覽器右下角找到懸浮按鈕並點擊。
- 等待浮層內的倒計時，使用手機掃描二維碼完成配對。
工作原理¶
該插件在 Host 端和 Client 端分別進行了處理：
-
Host 端（配置與代理）：
插件會在當前服務中註冊同源路由。通過GET /dsh-remote-qr-button/config探針實時讀取dsh-remote-link的端口、短碼與 TTL 配置，通過GET /dsh-remote-qr-button/qr.png代理獲取實時的配對二維碼圖片。 -
Client 端（渲染與交互）：
點擊懸浮按鈕後，前端會請求探針接口。頁面會通過同源<img>標籤渲染二維碼，並顯示 6 位短碼和倒計時。倒計時期間會每 5 秒進行一次輪詢。 -
Electron 兼容性：
插件使用<img>而非<iframe>渲染二維碼。這是爲了解決 Electron 桌面應用攔截跨源子框架導航的問題。如果使用 iframe，指向http://127.0.0.1:<port>/qr的內容在 Electron 中會被渲染爲空白。同源代理確保了瀏覽器和 Electron 桌面端都能正常顯示。
注意事項¶
- 前置依賴：必須先安裝
dsh-remote-link網關才能使用本插件。 - 訪問限制：僅支持從
127.0.0.1或localhost訪問時顯示按鈕。 - ID 衝突：本插件的按鈕 ID 與
dsh-remote-link注入的 ID 互斥。如果兩者同時掛載，先掛載者生效，另一個會跳過。 - 運行權限：插件以當前 DSH 進程的權限運行，建議在安裝前檢查源碼與許可證。
總結¶
DSH-QrPairing 通過同源代理和懸浮按鈕設計，解決了遠程配對時頻繁切換標籤頁的問題，特別是在 Electron 桌面端通過 <img> 渲染保證了兼容性。
- GitHub: https://github.com/huaxiren6/DSH-QrPairing
- 社區目錄: https://www.skillhub.cn/plugins/huaxiren6/DSH-QrPairing
