Files

DSH 中文工作台

React 19 + TypeScript + Vite;使用 Tailwind CSS 4、Radix UI 和自定义 CSS 构建响应式界面,Profile 编辑器按需加载 Monaco,没有运行时演示数据。

开发与验证

使用 Node.js 22+,在 web/ 目录执行:

npm ci
npm run dev
npm test
npm run build

开发服务监听 127.0.0.1,默认端口 5173(占用时 Vite 会尝试后续端口);/api 和 /dsh 代理至 127.0.0.1:8088,/dsh 支持 WebSocket 代理。生产产物为 web/dist/,需配置后端静态目录并同源提供;不能直接通过 file:// 使用。

API 与安全

  • 根目录 API.md 是接口契约;公共请求封装和类型位于 src/api.ts,可注入 fetch 进行独立单元测试。业务组件也通过 api.request 调用接口;当前对接说明见 API_REQUEST.md。
  • 使用同源 HttpOnly 认证 Cookie;浏览器写请求从可读的 dsh_csrf Cookie 获取 X-CSRF-Token。启动时通过 /api/me 恢复登录状态,符合条件的 401 会触发 /api/refresh 并重试原请求,支持并发刷新协调。密码、token 不写入 localStorage;工作台所选实例会按用户保存在 localStorage。
  • 操作失败保留错误,不模拟成功;删除、重启、构建等操作二次确认。
  • 已接入 Profile 编辑/预览、加密备份创建/导入/下载/恢复和本地镜像升级;创建备份和升级要求当前登录密码,导入/恢复使用原备份密码。
  • 创建实例和升级只允许 status=available 且 selectable=true 的本地镜像;管理员通过 Git 发布检查与精确 commit 提交构建,并可管理镜像准入策略。
  • 工作区支持文件管理、目录 ZIP 下载、图片预览和带版本校验的文本编辑;管理员页面提供用户、配额、密码重设、审计及孤儿容器回收,本人可修改密码。
  • 单元测试里的 fetch 替身仅用于测试,不打包进生产页面。

测试使用 Vitest,覆盖 API、认证刷新、组件和构建分块等行为;其中构建测试使用不落盘的 Vite 构建。测试或构建通过不等于真实 Docker 生命周期、代理会话及备份恢复已完成端到端验收;部署限制和后端验收范围以根目录 README.md、API.md 和 ACCEPTANCE.md 为准。