返回功能列表
开发预览

Web 预览

转发开发端口并在 Redock 内打开本地 Web 服务,在 Agent 工作的同时实时验证修改效果。

功能演示视频Web 预览

转发开发端口并在 Redock 内打开本地 Web 服务,在 Agent 工作的同时实时验证修改效果。

概要说明

Web 预览会通过当前 SSH 连接转发开发服务端口,并在 Redock 中打开页面。预览与运行 dev server、Coding Agent 的终端保持在同一个工作流中。

你可以在同一设备上来回完成实现指令和视觉验证,缩短响应式布局、文案、表单和交互状态的反馈循环。

适用场景

  • 预览 Agent 在远程 Host 上启动的 Vite、Next.js、Astro、Rails、Django 或其他 dev server。
  • 代码修改后立即验证布局、字体、颜色、图片、表单和导航是否符合预期。
  • 直接在控制 Agent 的 iPhone 或 iPad 上检查真实移动端断点和触控体验。
  • 检查加载、空状态、错误状态以及不依赖 Hover 的触控交互,再给出下一轮修改指令。
  • 通过 SSH 工作流访问私有开发端口,避免为了临时预览把 dev server 直接暴露到公网。

闭环完成 Agent 修改与页面验证

让 Agent 修改组件后,直接打开转发的 dev server 查看结果,再带着具体观察回到终端提出修正。整个“实现—预览—反馈”循环都可以在同一个移动工作流中完成。

在真实移动视口检查响应式体验

直接验证断点、触控目标、吸顶元素、输入框聚焦、横向溢出和安全区域,而不是只依赖桌面浏览器模拟手机尺寸。

覆盖正常页面之外的状态

检查加载、空数据、表单校验、权限不足、网络错误和超长内容状态,让下一条 Prompt 能引用已经观察到的具体问题,而不是笼统要求“优化页面”。

使用流程

  1. 在远程 Host 上启动开发服务器。
  2. 通过当前连接转发服务端口。
  3. 打开 Web 预览检查改动,再回到终端给出反馈。

使用建议

让开发服务器监听框架允许的地址,并确认端口正确。检查完成后,及时停止不再使用的服务和端口转发。

把这个功能加入你的移动工作流

用手机控制 Coding Agent,随时进行开发

免费获取 Redock