Express上传图片至AWS S3后类型异常，URL无法访问排查

核心问题在于你上传到S3的文件Content-Type被错误设置为application/octet-stream，而非图片对应的image/png或image/jpeg。从你打印的req.file可以看到这一关键错误：

contentType: 'application/octet-stream'

S3依赖这个字段识别文件类型，浏览器也需要它来正确解析并渲染图片，所以才会出现S3里文件类型为空、URL无法正常展示的情况。

解决方案 #

在multerS3的配置中添加contentType选项，让它自动根据上传文件的MIME类型设置正确的Content-Type：

修改你的上传配置代码：

const upload = multer({
  fileFilter,
  storage: multerS3({
    acl: "public-read",
    s3,
    bucket: "yelpcampimage",
    // 添加这一行，自动匹配文件的MIME类型
    contentType: multerS3.AUTO_CONTENT_TYPE,
    metadata: function (req, file, cb) {
      cb(null, { fieldName: "TESTING_METADATA" });
    },
    key: function (req, file, cb) {
      cb(null, Date.now().toString());
    },
  }),
});

另外注意你的路由代码里用了upload2.single("image")，但你导出的变量是upload，如果这是笔误，需要修正为upload.single("image")，否则上传中间件不会生效。

原理说明 #

multer-s3-v2默认不会自动推导文件的Content-Type，会默认使用application/octet-stream（二进制流类型）。通过设置contentType: multerS3.AUTO_CONTENT_TYPE，它会读取上传文件的mimetype，并将其设置为S3对象的Content-Type属性，这样S3就能正确识别文件类型，浏览器访问URL时也能以图片格式渲染。

内容的提问来源于stack exchange，提问作者Not Allan