miniprogram-v3 首页图片问题修复清单（交小冈）

出品：波波（只读体检 + A端配置侧已修）　日期：2026-09-26 03:30

范围：/Users/lean/dev/kailash-xiaogang/miniprogram-v3 首页（除 hero）

纪律：波波未改本仓库任何文件；以下 3 项归小冈。A端配置侧 2 项波波已修（见文末）。

🔴 P0 · TEMP 测试卡残留在生产首页（用户可见）

位置：components/home/dest-scroll/dest-scroll.wxml 第 42–44 行

      <view class="dest-card-min" style="background:#ddd; flex: none;">
        <image src="https://img.kailashi.cn/assets/miniapp-static/v1/06-glacier.jpg" mode="aspectFill" style="width:100%;height:100%;"/>
      </view>

为什么是 bug：它在 wx:if（第 8 行）/ wx:else（第 16 行）两个 <block> 之外（block 分别在第 15、41 行闭合），所以无条件渲染。

现象：生产首页「大阿里」横滑区，在 3 张真卡（班公湖 / 扎达土林 / 羌塘边缘）后面多出一张灰底 #ddd、无标题无描述的野卡。CSS 注释（dest-scroll.wxss:15）自己写着「TEMP 最小测试卡」。

修法（二选一）：

• 直接删除这 3 行（推荐，测试卡不应进生产）；
• 或移进 wx:else 的 block 内（若确需兜底占位）。

验收：真机/开发者工具打开首页，横滑区不再出现灰底无字卡。

🟠 P1 · 全部 image 缺 lazy-load（弱网首屏慢）

位置：components/home/ 下 15 处 mode="aspectFill" + 1 处 aspectFit，涉及：

• project-grid/project-grid.wxml 第 9、17、22、26、30、34、38 行
• dest-scroll/dest-scroll.wxml 第 10、18、24、30、36、43 行
• hero-section/hero-section.wxml 第 10 行（hero 首屏必需，可不加）

为什么：首屏 8+ 张图并发拉取（v2 五张 + v1 三张 + hero），B/C端 弱网是硬约束。

修法：首屏以下（project-grid、dest-scroll）的 <image> 加 lazy-load：

<image class="card-img" src="{{item.cover}}" mode="aspectFill" lazy-load aria-hidden="true"></image>

hero 那张不加（首屏要立即出图）。

🟠 P1 · 动态 cover 无 binderror 兜底（配错即静默空白）

位置：

• project-grid/project-grid.wxml 第 9 行 src="{{item.cover}}"
• dest-scroll/dest-scroll.wxml 第 10 行 src="{{item.cover}}"

为什么：cover 来自 A端 content_items 配置（home.projects / home.destinations）。静态兜底分支（wx:else）有硬编码 URL，但动态分支没有任何错误处理——A端 一旦配错 URL，该卡静默空白，无任何提示。

修法：加 binderror 回落到内置图：

<image class="card-img" src="{{item.cover}}" mode="aspectFill" lazy-load
       binderror="onCoverError" data-index="{{index}}" aria-hidden="true"></image>

onCoverError(e: any) {
  const i = e.currentTarget.dataset.index
  this.setData({ [`projects[${i}].cover`]: FALLBACK_COVERS[i % FALLBACK_COVERS.length] })
}

（FALLBACK_COVERS 用现有 v1 硬编码那几张即可。）

✅ 波波已修（A端配置侧，无需小冈动）

走正规通道 PUT /api/miniapp/admin/content/items/home.projects（改前已备份 /tmp/home_projects_backup.json，可回滚）：

1. 清双 ?v= 脏数据：culture.jpg?v=3?v=2 → culture.jpg?v=3；healing.jpg?v=3?v=2 一并处理（见下条）
2. 疗愈换图：v2/healing.jpg（720×126 = 5.71:1，放进 1.495:1 卡被裁 74% 且放大 1.75 倍发糊）→ v1/08-onsen.jpg（1024×934 = 1.10:1，裁 27% 且缩小清晰，温泉语义贴切）

线上已复核 PASS（双 ?v= 残留 0 / healing 残留 0）。

📌 附：v2 图压缩是「裁切」不是「压扁」（波波已用眼睛核对，勿再误判）

有人 02:11–02:43 并行压缩了 v2 五张图（.bak 留底）。我对比了原图与压缩版：

• kora：原 2848×1440 → 现 720×284，是居中裁切（雪山/经幡/佛塔比例正常，无变形）
• healing：原 2848×893 → 现 720×126，裁掉了雪山和晚霞，只剩蒸汽+水面（所以换图）

⇒ 压缩没有把图压变形，只是裁掉了上下。若后续要恢复完整构图，.bak 原图还在服务器上（/srv/kailash/nginx/html/*/miniapp-static/v2/*.bak）。