dsh-read-image-view:在 DSH Web 界面直接顯示 read_image 生成的本地圖片

在 DeepSeek Harness 中開發工具時,如果使用 read_image 讀取本地文件,生成的工具卡通常會顯示文件名和大小,但沒有視覺反饋。這需要人工去打開圖片。下面介紹的插件直接在 Web 界面的工具卡中渲染這些圖片。

插件定位

這是一個純客戶端插件,用於在 DSH Web 聊天界面中內聯顯示 read_image 生成的圖片,支持縮略圖和 Lightbox。它由 dblate 維護,使用 MIT 許可證。

核心功能

  • 內聯縮略圖:工具卡內聯顯示圖片縮略圖(長邊 240px,寬高比鉗制、不放大),附帶格式、尺寸、體積摘要行。
  • Lightbox 查看:點擊縮略圖打開全屏 Lightbox,支持通過 Esc 鍵、點擊遮罩或關閉按鈕退出。
  • 錯誤處理:加載失敗顯示可重試的錯誤行;工具失敗顯示錯誤摘要。
  • 純客戶端實現:不修改宿主代碼、不新增會話事件、不影響模型上下文。渲染完全來自已記錄的 tool/result 事件,支持會話 resume / fork 後圖片依然顯示。
  • 格式支持:僅支持 PNG / JPEG / WebP / GIF(SVG 被拒絕)。
  • 工具卡接管:工具卡是 keyed read_image 的接管式註冊。如果官方未來內置了 read_image 的圖片卡片,兩者互爲替換(後加載者生效)。

安裝與啓用

使用官方提供的命令安裝:

dsh plugin --profile web add github:dblate/dsh-read-image-view

安裝後重啓 dsh web 生效。僅 patch 層支持熱重載。

開發與熱重載

從源碼構建時,需先安裝依賴並運行構建腳本:

pnpm install
pnpm run build

如果從源碼安裝,pnpm 默認會拒絕執行構建腳本。需要在 profile 的 pnpm-workspace.yaml 中允許構建腳本:

# $DSH_HOME/profiles/web/pnpm-workspace.yaml
allowBuilds:
  dsh-read-image-view: true

注意:pnpm 不同版本打印的鍵格式不同。pnpm 10 使用裸包名,pnpm 11 使用帶 codeload URL 的完整鍵。

免安裝的掛載方式(web profile 支持 patch 熱重載):

# 追加到 $DSH_HOME/profiles/web/cordis.patch.yml
- insert:
    - id: read-image-view
      name: /absolute/path/to/dsh-read-image-view/lib/index.js

使用邊界

  • 路由模型要求:當前會話的路由模型必須聲明支持圖片輸入。這是 read_image 工具自身的既有門禁(純文本模型路由下該工具會拒絕執行,本插件無能爲力)。
  • 格式限制:僅支持 PNG / JPEG / WebP / GIF(附件管道只接受光柵圖;SVG 被拒絕)。
  • 大小限制:圖片大小/尺寸/像素上限跟隨部署的 attachment imageLimits 配置。
  • 日誌隱私:圖片字節不進入會話日誌(事件裏只有附件引用),瀏覽器通過會話授權通道讀取。

兼容性說明

DeepSeek Harness 目前處於 developer preview 階段,破壞性變更多。本插件依賴上游擴展面:

  • tool.call.toolview keyed slot(按 wire 工具名註冊工具卡)
  • ctx.uiConversation.imageUrl / peekImageUrl(會話授權的附件圖片 URL 服務)
  • @deepseek-ai/dsh-client-ui-primitives 基線共享模塊(Modal / StateDot / 圖標)

在這些擴展面上遊發生不兼容變更時需要跟進適配。

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

小夜