我在try 使用Axios将图像上载到WhatsApp Cloud API时遇到问题.尽管将扩展名为.png的图像的表单数据的内容类型设置为image/png,但我仍然从WhatsApp收到一条错误消息,指出扩展名为invalid_request.错误消息特别提到了the parameter "file" must be a file with one of the specified MIME types,,但它正在接收类型为"APPLICATION/OCTET-STREAM"的文件.

从WhatsApp收到的错误消息为:

OAuth‘Facebook Platform’‘INVALID_REQUEST’‘(#100)参数文件必须是以下类型之一的文件: 音频/AAC、音频/mp4、音频/mpeg、音频/amr、音频/ogg、音频/opus、应用程序/vnd.ms-Powerpoint、应用程序/msword、application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.openxmlformats-officedocument.presentationml.presentation,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,应用程序/pdf、文本/纯文本、应用程序/vnd.ms-Excel、图像/jpeg、图像/png、图像/wep、视频/mp4、视频/3GPP.收到类型为‘应用程序/八位字节流’的文件

Here is the screen shot of pipdream post request

下面是node.js文件的代码

(async () => {
      const formData = new FormData();
      formData.append("messaging_product", "whatsapp");
      formData.append("type", "image/png");
      const stream = await streamToBlob(
        fs.createReadStream(
          "/filepath"
        )
      );
      formData.append("file", stream);

      console.log("formData", formData);
      let config = {
        method: "post",
        maxBodyLength: Infinity,
        url: `https://graph.facebook.com/v18.0/${phoneNumberId}/media`,
        headers: {
          Authorization:
            `Bearer ${token}`,
          "Content-Type": "multipart/form-data;image/png",
        },
        data: formData,
      };

      axios
        .request(config)
        .then((response) => {
          console.log(JSON.stringify(response.data));
        })
        .catch((error) => {
          console.log(error);
        });
    })();

推荐答案

尽管将扩展名为.png的图像的表单数据的内容类型设置为"IMAGE/PNG

您添加了一个额外的parameter,名称为type,值image/png--这与实际的Content-Type没有任何关系.

而你设定了Content-Type: multipart/form-data;image/png英镑,这根本说不通.request的Content-Type只需为multipart/form-data.image/png只是此多部分请求中parts个请求中的一个的Content-Type.

https://www.npmjs.com/package/stream-to-blob表示streamToBlob有一个可选的第二个参数mimeType--这就是您需要为这里创建的BLOB设置Content-Type的位置.

const stream = await streamToBlob(
        fs.createReadStream(
          "/filepath"
        ),
        "image/png"
      );

Javascript相关问答推荐

具有相同参数的JS类

扫描qr code后出错whatter—web.js

从Node JS将对象数组中的数据插入Postgres表

屏幕右侧屏障上的产卵点""

Chart.js 4.4.2,当悬停在一个数据点上时,如何在工具提示中拥有多个数据点/标签?

无法检测卡片重叠状态的问题

在Three JS中看不到补间不透明度更改效果

查询参数未在我的Next.js应用路由接口中定义

当用户点击保存按钮时,如何实现任务的更改?

让chart.js饼图中的一个切片变厚?

从逗号和破折号分隔的给定字符串中查找所有有效的星期几

匹配一个或多个可选重复的特定模式

将相关数据组合到两个不同的数组中

Clip-Path在网页浏览器(Mozilla、Edge、Chrome)上不能正常工作,但在预览版Visual Code Studio HTML、CSS、JS上却能很好地工作

如何在下一个js中更改每个标记APEXCHARTS图表的 colored颜色

重新渲染过多(&Q).REACT限制渲染次数以防止无限循环.使用REACT下拉菜单时

由于http.get,*ngIf的延迟很大

相对于具有选定类的不同SVG组放置自定义工具提示

如何在css中裁剪成一定Angular 的圆的一部分,而不需要复杂的多边形

Playwright:ReferenceError:browserContext未定义