juzi/docs/10.09新版H5实施与验收.md

10.09 新版 H5 实施与验收

更新：2026-10-10。

按确认项实现

• 保持 H5，无额外网页导航栏，不仿造系统/微信顶部栏。
• 登录在首页之前；复用现有协议弹层。微信网页授权链路已实现，当前内网使用本机浏览器身份，公网限制与部署见《微信登录接入与公网部署说明》。
• 首页更新口号、背景和品牌图，增加「我的报告」。修正重复入口、出镜错字。
• 我的报告独立页面，数量、日期、查看详情、空/失败状态；读取当前账号最近 5 份后端报告。
• 档案页换用新版背景和五类肤质插画，保留原选择器和校验。
• 相机轮廓与眼鼻定位虚线从 PSD 素材提取，前→右→左流程、自动抓拍、降级、语音和前后摄像头逻辑保持。
• 汇总卡合并，名称为「生物可视年龄」「紧塑力」「透亮感」「稳韧力」，不照抄设计样例中的数值。
• 七项视图分成三个独立 Tab 组：轮廓/皱纹；肤色/平滑度/水分；泛红/痘痘。使用真实检测图层或用户照片，不把设计里的模特检测图当成检测结果。
• 根据 reference/AI测肤报告页话术修改.md 生成新结论和护理建议。无效字段不冒充 0，无图层明确说明。
• 只显示原算法选中的一款主场精华 I / II / III，不可点击，移除「了解更多」占位入口。
• MiSans 官方原始 Web 字体本地提供，未改造字体文件；「我的报告」底部注明字体使用。

文档未定义部分的实施口径

话术文档没有新增计分公式或阈值，因此原六分类/三维度评分、肌龄计算及精华推荐规则不变。旧分档「预警/改善/良好」按低/中/高顺序映射为新文案的「改善/良好/优秀」。肤色和水分拆分展示，但继续共享原 tone 分类的分档，不是新增独立评分算法。

痘痘话术按真实脓包/结节计数决定是否输出中重度皮损说明；没有计数不宣称「未检出」。当真实计数与高分模板冲突时，展示层选择可反映计数的文案，不改变原分数。

护理建议按原六分类得分选取最需要关注的两项，拼接文档对应的「护理 + 生活方式」；若命中肤色水润，分别展示肤色与水分建议，可能为三段。设计里的示例两段不作为截断真实文本的硬限制。

历史详情读取保存时的 vm、presentation、照片、图层，不用当前评分/话术重新生成历史数据。图像合成有渲染版本防护，切换报告时不会串用上一份图片。

验证命令

node h5/js/skin-score.js
node h5/test/regression.js
node h5/test/accounts.js
node h5/test/report-persistence.mjs
node h5/test/wechat-browser.mjs
node h5/test/ui-20261009.mjs
node h5/test/e2e-browser.mjs

浏览器测试需要全局 Playwright 与 Chromium，沿用项目既有环境。ui-20261009.mjs 默认访问本地 8080，可用 H5_BASE_URL 覆盖；report-persistence.mjs 单独启用 18089 临时服务和临时数据目录，不写入日常报告，不调用收费 Face++。

本轮结果：评分模块自测 83 条、真值回归 86 条通过；账号隔离、恢复登录、重启持久化、最近 5 条、OAuth state 防重放/子路径检查通过；模拟上游的完整 HTTP 链路验证七张图片及文案刷新回看完全一致；三连拍与语音端到端检查通过；320/390/480px 宽度无横向溢出，浏览器无脚本异常。

截图位于 design/ui-20261009/verification/。这些是本地 Chromium/样本数据检查，不等于真实手机摄像头或微信公网账号验收。本轮没有触发真实 Face++ 收费请求。

素材再生成

python tools/export_psd_assets.py /你的路径/UI外发版10.09.psd
python tools/prepare_h5_assets.py
python tools/build_report_copy.py

PSD 导出依赖 psd-tools/Pillow/aggdraw；H5 裁剪与相机轮廓提取还使用 numpy/opencv-python。原始导出保留，*-h5.jpg 是去除原生顶栏后的衍生背景；相机几何写入 h5/js/camera-geometry.js。