zoumutou/dsh-web-preview

Name: zoumutou/dsh-web-preview
Author: zoumutou

Plugin插件 Native原生 ⭐ 4 MIT Sessions & Context会话与上下文

DeepSeek Harness（DSH）侧边网页预览面板 —— 一个标准 Cordis 插件包（Host + Client 双半），把工作区目录托管成 iframe 预览，并支持项目运行、元素标记批注与链接点击接管。

catalog descriptioncatalog 简介 / catalog description：DeepSeek Harness 侧边网页预览面板：本地静态托管、项目运行、元素标记批注、链接点击接管（Cordis 插件包）

Project Overview项目介绍

Edited by Zhiwei Agent (zhiwei)由知微Agent(zhiwei)编辑

dsh-web-preview is a native plugin built exclusively for DeepSeek Harness (DSH). It is packaged as a standard Cordis plugin with both host and client components, and requires the DSH Web version to run. The plugin adds a glass-style preview panel on the right side of the DSH interface, which is triggered by clicking the play button at the top right of the conversation window. To install the plugin, users first navigate to their profile directory (such as ~/.dsh/profiles/web) and run npm install dsh-web-preview-panel, then add an entry for the plugin in cordis.patch.yml and restart dsh web to activate it.

Once activated, the plugin supports multiple common workflows for developers and content creators. It lets users preview static files from the DSH workspace directly in the panel, including rendered Markdown, syntax-highlighted code, images, and raw HTML. For running projects, the plugin automatically detects project types based on existing configuration files like Cargo, package.json, go.mod, or Python project files. Users can start and stop projects directly from the panel, and send runtime logs to the AI in one click for debugging help. It also supports element annotations, where users can click elements to add comments and send them directly to the conversation window.

The plugin follows session isolation, so each DSH conversation maintains its own independent preview state and root working directory. Users can drag and drop files directly into the DSH conversation dialog, and files are saved to the .dsh-drops directory of the workspace with a maximum size limit of 64MB per file. The plugin’s UI automatically follows DSH’s light and dark theme settings, and all links clicked in the conversation open in the side panel, except when Cmd or Ctrl is clicked to open them in a default browser. It is released under the open source MIT license, so anyone can use, modify, and distribute it freely.

这是一个专门为 DeepSeek Harness（DSH）开发的原生 Cordis 插件，提供侧边网页预览面板功能。它可以将当前工作区目录托管为 iframe 预览，支持静态文件预览、项目运行、元素标记批注、链接点击接管和拖入文件等功能，每个会话都保持独立的预览状态，面板宽度支持拖动调整，UI 会自动跟随 DSH 的白天/夜间主题切换。

用户在对话中点击右上角 ▶ 按钮即可打开右侧预览面板，开发本地项目时可以直接在面板中运行项目，自动识别本地开放端口并加载预览。遇到运行问题还可以将运行日志一键发送给 AI 辅助诊断，也可以对预览元素进行标记批注后发送到对话，非常适合前端开发、文档预览和本地项目调试场景使用。

该插件仅支持 DSH Web 版，安装时需要先在 profile 目录下执行 npm 安装，再在 cordis.patch.yml 中挂载配置，重启 DSH Web 后即可生效。拖入文件单个上限为 64MB，采用 MIT 许可证开源，任何个人和非商业项目都可以免费使用和修改代码。

View on GitHub在 GitHub 查看

Send to your DSH发给你的 DSH 安装

请帮我安装这个 DSH 插件。安装前先完成【兼容性检查 + 安全性检查】，检查通过再动手。

插件：dsh-web-preview（zoumutou/dsh-web-preview）
仓库：https://github.com/zoumutou/dsh-web-preview
本站详情页：https://www.yhbd.top/plugins/zoumutou-dsh-web-preview/
本站登记：类型 plugin · 归类 原生 DSH 插件 · 许可证 MIT · ⭐ 4 · 最近提交 2026-08-22 · 主语言 JavaScript

按下面顺序执行，每步先把结论告诉我，再进入下一步：

【1 兼容性检查】
① 我这边：DSH 版本、Node 版本、操作系统、当前 profile（web / desktop）。
② 读它的 README、package.json、插件 manifest，列出它要求的 DSH 版本 / Node 版本 / 操作系统 / 外部依赖 / 需要另外先装的运行时。
③ 逐条比对，结论只写「满足 / 不满足 / 未知」三种；不满足的给出可行替代方案。
④ 检查是否和我已装的插件冲突：命令名重复、skill / tool 重名、端口占用、重复注册的 MCP server。

【2 安全性检查】
① 仓库可信度：和上面「本站登记」是否一致；star / fork 数、创建时间、最近提交，是否归档或长期停更。
② 安装脚本：逐行看 package.json 的 preinstall / install / postinstall，以及 install.sh、setup.ps1 之类脚本。出现 curl|bash、下载后直接执行、混淆代码、访问与插件功能无关的域名，立刻停下来告诉我，不要继续装。
③ 依赖：列出新增依赖，标出无人维护、或与知名包拼写近似的可疑包（typosquatting）。
④ 权限与副作用：它会读写哪些目录、访问哪些域名、需要哪些 DSH 权限（filesystem / network / shell / clipboard 等），以及怎么卸载和回滚。
⑤ 如果它要求 sudo / 管理员权限，或权限明显超出功能所需，先停下来问我。

【3 安装】
上面两步没有「不满足」和「高危项」时才执行；用官方推荐方式安装，不要自行提权。

【4 汇报】
用表格输出：检查项 / 结论 / 依据 / 是否需要我决策。拿不准的一律写「未知」并说明要我怎么确认——不要猜，也不要替我决定。

Send this message to DSH in your current session: it verifies compatibility and security first (answering met / not met / unknown item by item) and only installs once everything checks out — it will stop and ask you if it finds a high-risk item. The box scrolls; the copy is the full prompt. CLI install commands may not be accurate across systems, so DSH is the safer route.把上面这条消息直接发给当前会话里的 DSH：它会先核对兼容性与安全性（逐条给「满足 / 不满足 / 未知」），确认没问题再安装，有高危项会停下来问你。框内可滚动，复制到的是完整提示词；安装命令不一定准确，发给 DSH 更稳。

Pre-install check安装前体检Compatibility · Security兼容性 · 安全性 1 warning1 项注意

Only 4 stars - very few users, little community feedback星标只有 4，几乎没人在用，遇到问题缺少社区反馈

DSH walks through these 9 checksDSH 会逐条核对这 9 项

Compatibility兼容性

DSH, Node, OS and profile requirementsDSH 版本 / Node 版本 / 操作系统 / profile 是否满足要求
External dependencies and runtimes (Electron / Python / Docker, ...)外部依赖与运行时（Electron / Python / Docker 等）是否齐备
Conflicts with installed plugins: command names, skill / tool names, ports, duplicate MCP registration与已装插件是否冲突：命令名、skill / tool 重名、端口占用、重复 MCP 注册

Security安全性

Repo matches the facts registered here; archived or abandoned?仓库是否与页面登记一致，是否归档或长期停更
Safety of preinstall / install / postinstall and install.sh / setup.ps1preinstall / install / postinstall 与 install.sh、setup.ps1 是否安全
curl|bash, download-then-execute, obfuscation, unrelated domains → stop immediatelycurl|bash、下载即执行、混淆代码、无关域名 → 立刻停止
Typosquatting or unmaintained packages among the new dependencies新增依赖里有没有 typosquatting 或无人维护的包
Requested permissions vs. what the feature actually needs申请了哪些权限、是否超出功能所需（filesystem / network / shell / clipboard）
Any sudo / admin requirement, plus uninstall and rollback是否要求 sudo / 管理员权限，以及卸载与回滚方式

Anything uncertain must be marked unknown with a note on how to confirm it. This site's signal screen is a static snapshot, not a security audit.拿不准的必须标「未知」并说明要我怎么确认。本站的信号筛查是静态快照，不能替代安全审计。

Or use CLI install (for developers)或使用命令行安装（适合开发者）

CLI Install命令行安装

dsh plugin --profile web add github:zoumutou/dsh-web-preview

把 zoumutou/dsh-web-preview 加入你的 DSH 配置（web profile）即可启用。

READMEREADME

3.2 KB · 缓存于 2026-08-26 05:38:59 · 3.2 KB

dsh-web-preview-panel

功能

侧边预览：对话右上角 ▶ 按钮打开右侧玻璃卡片式预览面板（每个会话独立状态），地址栏实时同步、可拖动调宽（挤压对话 → 400px 封顶 → 覆盖模式）
本地文件预览：工作区静态文件经 Harness 自身的 HTTP 服务托管（/__dsh-preview/<sessionId>/...）—— Markdown 渲染、代码带行号、图片直显、 HTML 原样
项目运行：自动检测项目类型（Cargo / package.json / go.mod / Python）， ▶ 运行 / ⏹ 停止，日志实时滚动、自动识别 localhost:PORT 并加载预览；「日志→对话」一键把日志发给 AI 辅助诊断
元素标记：🖉 标记模式（悬停手型高亮、点击选取元素、批注气泡、一键发送到对话），选择器/HTML 快照自动剥离内部标记类
对话框直接拖入文件：把文件拖进对话框即保存到工作区 .dsh-drops/ 并以路径引用加入草稿（对话框保持干净，AI 按需读取文件内容，上限 64 MB）；图片单独拖入仍走 DSH 原生图片附件轨，混合拖入时图片同样保存为文件引用
链接点击接管：对话里点击 http(s) 链接、相对/绝对文件路径、纯文本路径（自动转链接，支持 CJK/中文文件名如 docs/候选批准总文档.md） → 全部在侧边打开；Cmd/Ctrl+点击保留浏览器默认行为
主题跟随：面板 UI、输入区气泡、代码/Markdown/文件缺失预览页与标记/批注浮层自动跟随 DSH 白天/夜间主题（body[data-ds-dark-theme] + --dsw-alias-* token，预览页经 html[data-theme] 同步，切换即时生效，默认回退夜间）
会话隔离：每个会话独立的预览状态、根目录（默认当前会话所属工作区）、运行进程

安装

要求 DSH（DeepSeek Harness）Web 版。在 profile 目录（如 ~/.dsh/profiles/web）：

npm install dsh-web-preview-panel

然后在 cordis.patch.yml 中挂载：

- insert:
    - name: dsh-web-preview-panel

重启 dsh web 即生效。

开发

npm run build   # 产出 lib/index.js（host）与 lib/client.js（ModuleLoader bundle）

src/host.js —— Host 半：webServer 路由（静态托管 + POST /api JSON RPC）、 subprocess 项目运行、fs 文件访问
src/client.js —— Client 半：React 面板 UI、标记/批注、点击接管、会话隔离；通过 fetch('/__dsh-preview/api') 与 Host 通信

协议

GET/HEAD /__dsh-preview/<sessionId>/<path> —— 静态文件 / Markdown / 代码 / 图片
POST /__dsh-preview/upload —— 拖入文件落盘（原始字节，头字段 X-Dsh-Sid / X-File-Name / X-File-Size / X-File-Type，保存到 <root>/.dsh-drops/，上限 64 MB）
POST /__dsh-preview/api —— { method, args } JSON RPC： set-root pages resolve-path detect-project run-project project-status stop-project state