使用TypeScript通过axios.post调用WhatsApp Cloud API时遇400错误的技术求助

嘿，我帮你找到了导致axios.post调用返回400错误的关键问题，咱们一步步来解决：

核心问题：请求体结构错误 #

你在axios.post的第二个参数里把payload包在了额外的{payload}对象中，这会让API收到的请求体变成如下结构：

{
  "payload": {
    "messaging_product": "whatsapp",
    // ... 其他字段
  }
}

而WhatsApp Cloud API要求messaging_product、recipient_type等核心字段必须直接放在请求体的根层级——这和你用axios(config)时的data结构完全一致。这种结构不匹配就是触发400错误的主要原因。

另外，你的params是空对象，完全可以从调用中移除，简化代码（WhatsApp API支持请求头Authorization: Bearer {{token}}的认证方式，你的写法是没问题的）。

修正后的代码 #

let url = "https://graph.facebook.com/{{Version}}/{{Phone-Number-ID}}/messages"
let payload = { 
  messaging_product: "whatsapp", 
  recipient_type: "individual", 
  to: {{Recipient-Phone-Number}}, 
  text: {body: "Welcome back my friend"}, 
}
let headers = {"Content-Type": "application/json", "Authorization":"Bearer {{token}}" }
try { 
  // 直接传递payload作为请求体，无需额外包裹
  const resp = await axios.post(url, payload, {headers}); 
  log("POST RESP", resp) 
} catch(error) { 
  // 建议打印错误响应详情，WhatsAPI会返回具体的错误原因
  console.error("Error details:", error.response?.data);
  throw error; 
}

额外排查建议 #

如果后续还是遇到错误，一定要在catch块中打印error.response?.data，WhatsApp Cloud API会返回非常具体的错误描述（比如哪个字段缺失、格式不正确），能帮你快速定位问题。

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