使用Meta可恢复上传API上传后图片无法显示问题排查

问题概述 #

使用Express.js + Multer内存存储实现Meta可恢复上传API，会话创建成功且返回File Handle，但用该Handle创建消息模板后图片无法显示，提示"图片包含错误"；查询上传会话状态返回file_offset:0，说明文件未实际完成上传。Postman重复相同请求可正常工作。

核心问题分析 #

Postman能正常运行说明API流程无误，代码存在以下潜在问题：

• Authorization头格式混用：创建会话用Bearer认证，初始化上传用OAuth，Meta API统一要求Bearer格式
• 手动设置Content-Type头：手动指定multipart/form-data的boundary可能与FormData实际生成的不一致，导致Meta无法正确解析文件内容
• FormData兼容性问题：Node.js环境需使用form-data库而非浏览器原生FormData实现，否则可能出现数据传输异常

修复后的代码示例 #

1. 安装并导入正确的FormData库 #

npm install form-data

import FormData from 'form-data';

2. 统一Authorization头并移除手动Content-Type设置 #

修改初始化上传会话的函数：

const initiateResumableUploadSession = async (uploadSessionId: string, file: Express.Multer.File ): Promise<{ h: string }> => {
    try {
      const formData = new FormData()

      formData.append('file', file.buffer, {
        filename: file.originalname,
        contentType: file.mimetype
      })

      const result = await axios({
        method: 'post',
        url: `https://graph.facebook.com/${process.env.META_API_VERSION}/${uploadSessionId}`,
        data: formData,
        headers: {
          Authorization: `Bearer ${process.env.META_ACCESS_TOKEN}`, // 统一使用Bearer认证
          ...formData.getHeaders() // 自动获取正确的multipart/form-data头信息
        }
      })
      return result.data
    } catch (err: unknown) {
      throw Error(`Meta API Initiate Resumable Upload Session request failed. error: ${err}`)
    }
}

3. 可选：验证文件完整性 #

在创建上传会话前添加验证，确保文件数据未丢失：

// 在调用createResumableUploadSession前执行
if (file.size !== fileLength) {
  throw new Error('文件大小不匹配，数据可能丢失')
}

验证修复效果 #

修复后重新上传文件，查询会话状态应返回file_offset等于文件总大小，此时用返回的File Handle创建消息模板，图片即可正常显示。

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