看起来你遇到的问题确实有点头疼——用curl调用API完全正常，换成XHR提交FormData就报400，而且DevTools里Payload看起来格式是对的，先从几个常见的排查方向入手：

• 别手动设置Content-Type头
  这是XHR提交FormData最容易踩的坑！XHR在发送FormData时，会自动生成带正确boundary的Content-Type（比如multipart/form-data; boundary=----WebKitFormBoundaryxxx）。如果你的代码里不小心加了request.setRequestHeader("Content-Type", "multipart/form-data")，就会丢失boundary参数，导致API解析不了FormData，直接返回400。你当前贴的代码里没写这个，但最好再确认下有没有漏掉的代码片段。

• 校验FormData的字段完整性
  你提到Payload里的extension字段显示“vid...”，看起来像是内容被截断了？先确认这个字段的值是不是完整的文本。另外，API_KEY有没有正确传入？可以在send之前加一段代码打印FormData的所有内容，确保每个字段都没问题：

  // 打印FormData所有键值对，排查字段问题
  for (const [key, value] of formData.entries()) {
    console.log(`字段${key}的值：`, value);
  }
  

  重点看extension是不是完整的字符串，api_key有没有格式错误（比如多余空格、特殊字符）。

• 对比curl和XHR的请求头差异
  有些API会校验请求头的细节，比如User-Agent、Accept或者自定义头。打开Chrome DevTools的Network面板，找到这个XHR请求，切换到Headers标签，把所有请求头和你curl命令里的请求头对比：

  • 比如curl里有没有设置特定的User-Agent？XHR的默认User-Agent可能和curl不一样
  • 有没有自定义的授权头、Accept头？确保XHR和curl的请求头保持一致

• 确认File对象的有效性
  你用的是文件输入框的File对象，先确认这个对象是不是正常的。在append到FormData之前，打印console.log(file)，检查name、size、type这些属性是否符合预期，有没有出现文件为空、类型不匹配的情况。

• 换Fetch API测试，缩小问题范围
  有时候XHR的默认行为可能有隐藏问题，换Fetch API试试能不能成功，代码参考：

  fetch(url, {
    method: 'POST',
    body: formData
  })
  .then(response => {
    if (!response.ok) throw new Error(`HTTP错误：${response.status}`);
    return response.json();
  })
  .then(result => console.log('请求成功：', result))
  .catch(error => console.error('请求失败：', error));
  

  如果Fetch能正常返回，那问题大概率出在XHR的配置上；如果还是400，那就要重点排查FormData的内容或者API的校验逻辑了。

备注：内容来源于stack exchange，提问作者X3R0