前言¶
在 DeepSeek Harness 里做前端或全栈开发时，改完代码往往要切到外部浏览器：新开标签、输入 localhost 端口或测试环境地址，再切回对话窗口核对效果。窗口一多，视线和上下文容易被打断。DSH 右侧栏本来就有文件预览等能力；若能把 http / https 页面也放在同一侧栏里加载，验证页面时就不必反复跳出宿主。
下面介绍社区插件 dsh-web-preview（维护者 nubeslove，分类：客户端）：在右侧栏增加「网页预览」标签页，用地址栏打开本地开发服务器或任意网址，页面在 iframe 中展示，无需单独开外部浏览器窗口。
这是什么¶
dsh-web-preview 是 DeepSeek Harness 的客户端侧栏插件。README 将其概括为：在右侧栏直接打开本地开发服务器或任意 http / https 页面，不用跳出 DSH 去开外部浏览器（In-sidebar web preview for DeepSeek Harness）。
插件走 DSH 官方侧栏扩展点，不自绘整块面板、不覆盖既有 UI。宿主侧仅提供只读健康检查 /api/web-preview/health，不读文件、不落盘、README 写明没有对外网络请求。许可证为 MIT；package.json 中版本为 0.1.0，要求 Node >=22.19。Badge 标明兼容 DeepSeek Harness 0.2.0-rc.1+。
- 目录页：https://www.skillhub.cn/plugins/nubeslove/dsh-web-preview
- 源码与文档：https://github.com/nubeslove/dsh-web-preview
核心功能¶
侧栏「网页预览」标签页¶
- 在右侧栏 tab 条点击添加按钮，在引导页选择 网页预览。
- 在地址栏输入例如
localhost:5173或https://example.com，回车即可加载。 - 地址栏右侧三个按钮：重新加载、在外部浏览器打开、复制地址。
地址会自动补协议：localhost:5173 使用 http://，裸域名使用 https://；若已写明协议则按输入处理。
资源 tab 与导航¶
每个预览 URL 对应独立的资源 tab；同一地址重复打开会聚焦已有 tab，不会堆叠重复页。tab 标题取目标站点的 host。客户端通过 ctx.sidebarRight.openResource('dsh-resource://web/<encodeURIComponent(url)>') 等方式完成导航（详见 README「实现方式」）。
安全边界（README 原文要点）¶
- iframe 仅接受
http/https，其它协议拒绝。 - 拒绝将 DSH 自身 origin 作为预览目标，避免把 DSH 页面嵌进自身造成同源脚本互扰。
- 不向被预览页注入脚本、不读取页面内容、不上报数据；预览运行在 iframe 独立文档上下文中，父页面拿不到其 DOM。
已知限制¶
- 跨域页面父页面无法读 DOM，当前版本只能「看」，不能「批注」。
- 站点设置
X-Frame-Options或 CSPframe-ancestors拒绝嵌入时可能白屏，需用地址栏 在外部浏览器打开。 - 需要登录态的页面在侧栏里可能没有 cookie，取决于目标站点的 SameSite 策略。
- 尚未注册模型工具，地址由用户手动输入。
路线图提到二期批注（Playwright + CDP 等），属规划内容，非当前版本能力。
安装与启用¶
插件以当前 DSH 进程权限运行；安装前建议阅读仓库源码与 MIT 许可证，自行判断是否适用。
一条命令安装¶
dsh plugin --profile desktop add "github:nubeslove/dsh-web-preview"
然后在 $DSH_HOME/profiles/desktop/package.json 的 dsh.profile.bundles 里追加 "dsh-web-preview"，重启 DSH。
README 注明：纯 JS、无构建步骤、无运行时依赖；实测 pnpm 11.9 从 GitHub 拉取约 3.9 秒完成安装。
本地开发（link）¶
改插件源码时可用 link 指向工作副本：
dsh plugin --profile desktop add "link:/absolute/path/to/dsh-web-preview"
路径含空格时需按 README 在 package.json 的 dependencies 与 dsh.profile.bundles 手工配置，并在 profiles/desktop/node_modules/ 下建立指向本目录的 Junction，然后重启 DSH。
典型用法¶
经过上面的安装与 bundle 配置并重启 DSH 后：
- 启动本地前端（例如 Vite 默认
localhost:5173）。 - 在 DSH 右侧栏添加 网页预览 tab。
- 地址栏输入
localhost:5173并回车，侧栏内应显示开发服务器页面。 - 需要完整浏览器环境或站点禁止 iframe 嵌入时，使用 在外部浏览器打开。
实现概要（供排查与二次开发）¶
README 列出的主要文件：
lib/index.js：宿主侧健康检查路由与 URL 规范化lib/client.js：客户端 tab 类型注册、地址栏与 iframe 正文scripts/verify.mjs：自检（覆盖元数据、patch、客户端语法、同源防护、URL 规范化用例、路由与健康检查等，共 14 项）
仓库内可执行：
node scripts/verify.mjs
反馈¶
装不上、报错或行为与文档不一致，README 建议发邮件 1992335297@qq.com（附插件 package.json 版本、dsh --version、完整报错或截图），也可在 GitHub Issues 反馈。
结尾¶
dsh-web-preview 把本地 dev server 与常见网页预览收进 DSH 右侧栏，减少在对话、编辑器和外部浏览器之间的切换。它是社区目录中的客户端类插件，与 DeepSeek / 幻方无官方从属关系；生态上 DSH 强调「一切皆插件」，SkillHub 等目录为独立站点。
