用 Claude Opus 5.5 排查商品照片上传后旋转

让 Claude Opus 5.5 对照图片像素和方向元数据，找出两者从哪一步开始不一致。先检查原图、处理后的文件和浏览器显示，再决定是否旋转。只有一张截图，无法判断照片尚未转正，还是已经被转了两次。

留下同一张照片的三份证据

保留未经处理的相机原图，分别导出原图和页面实际使用的派生图元数据，并记录浏览器预览。材料中应有像素宽高、EXIF Orientation、处理步骤和库版本。每条观察都要对应具体文件；缓存缩略图可能并不是刚上传的新文件。

一则 2024 年 11 月的开发者提问最初怀疑浏览器，后来将重复旋转定位到旧版图片处理库。这是个案自述，不能直接拿来判定你的网站。它提醒我们：既要查像素变换，也要查留下的标签。

先统一方向，再确定裁切坐标

假设原图为 4032 × 3024，Orientation 为 6。按其含义转过四分之一圈后，正向尺寸是 3024 × 4032。居中正方形裁切的边长为 3024，上下各裁去 504 像素。这只是可复算的尺寸关系，不代表商品一定适合这样裁切；细长瓶子可能需要另一种构图。

Sharp 操作文档说明，autoOrient 根据 EXIF 方向完成必要的旋转或镜像，然后移除该方向标签。它处理 EXIF，并不代表其他位置保存的冲突方向信息也已解决。请核对所安装版本的文档和输出文件，不要在自动转正后再无条件旋转 90 度。

静态 JPEG 可以从下面这条候选处理链开始：

const output = await sharp(input)
  .autoOrient()
  .resize({ width: 1600, withoutEnlargement: true })
  .webp()
  .toBuffer();

这里刻意没有裁切。保留原图，另存派生图，再检查方向和尺寸。用 CSS 把预览转正，并不会修复下载文件的像素。MDN 的 image-orientation 文档有助于区分显示行为和文件处理。

可以直接使用的诊断提示词

排查提供的商品照片方向问题。输入包括未经处理的原图、页面实际使用的派生图、两者元数据、浏览器截图、处理代码和已安装库版本。提出修复前，先列出缺少哪些输入。
用表格列出文件、像素尺寸、EXIF Orientation、已经执行的变换和实际显示。区分观察事实与假设，检查像素是否已经旋转或镜像，却仍保留旧方向标签。
提出最小改动，在缩放或裁切之前只统一一次方向。保留原图和商品标签身份，不添加无条件旋转，不声称截图可以证明元数据。说明裁切使用的坐标系。
交付补丁、回退方式，以及正常、旋转、镜像输入的测试。比较预览与下载。如果无法运行处理工具，提供命令并注明未执行。没有检查输出文件就不能宣称成功。

这是一套拟议的 Opus 工作流，不是模型实测。测试图应包含不对称标签，或不影响判断的角落标记，避免瓶身对称导致镜像错误漏检。对每种支持的方向，检查是否转正、文字方向是否正确、预期构图是否保留；再加入没有方向标签的图片和已经规范化的派生图。

排错与交付

**能先删除 EXIF 吗？** 在应用方向信息前删除它，可能留下侧倒的像素，却丢失转正依据。应先根据原始元数据确定变换，再删除相关信息。

**为什么只有一张卡片不对？** 先确认实际图片地址和缓存版本。在单个原图到派生图的链路复现之前，不必重新生成整个目录。

**转正也能修复裁切吗？** 不能。转正只是建立坐标系；响应式图片选择和构图仍要单独检查。

参考图方向确认后，可以带入 Panelly Studio制作完整商品广告图。以修正后的文件作为参考，并检查成图的标签方向。这里不声称 Panelly 已集成 Opus 或上述处理链。

资料与延伸阅读

• 原始资料 · stackoverflow.com
• 原始资料 · sharp.pixelplumbing.com
• 原始资料 · developer.mozilla.org