fetch - 多部分/表单数据 POST 中缺少边界

新手上路,请多包涵

我想发送 new FormData() 作为 bodyPOST 请求使用 获取 api

该操作看起来像这样:

 var formData = new FormData()
formData.append('myfile', file, 'someFileName.csv')

fetch('https://api.myapp.com',
  {
    method: 'POST',
    headers: {
      "Content-Type": "multipart/form-data"
    },
    body: formData
  }
)

这里的问题是边界,比如

boundary=----WebKitFormBoundaryyEmKNDsBKjB7QEqu

永远不会进入 Content-Type: 标头

它应该是这样的:

 Content-Type:multipart/form-data; boundary=----WebKitFormBoundaryyEmKNDsBKjB7QEqu

当您使用 new XMLHttpRequest() 尝试“相同”操作时,如下所示:

 var request = new XMLHttpRequest()
request.open("POST", "https://api.mything.com")
request.withCredentials = true
request.send(formData)

标题设置正确

Content-Type:multipart/form-data; boundary=----WebKitFormBoundaryyEmKNDsBKjB7QEqu

所以我的问题是:

  1. 在这种情况下,如何使 fetch 的行为与 XMLHttpRequest 完全一样?
  2. 如果这是不可能的,为什么?

谢谢大家!这个社区或多或少是我取得职业成功的原因。

原文由 James 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 867
2 个回答

该问题的解决方案是将 Content-Type 显式设置为 undefined 以便您的浏览器或您使用的任何客户端都可以设置它并在其中为您添加该边界值。令人失望但真实。

原文由 James 发布,翻译遵循 CC BY-SA 3.0 许可协议

我删除了“Content-Type”并向 http 标头添加了“Accept”,它对我有用。这是我使用的标题,

 'headers': new HttpHeaders({
        // 'Content-Type': undefined,
        'Accept': '*/*',
        'Authorization':
        "Bearer "+(JSON.parse(sessionStorage.getItem('token')).token),
        'Access-Control-Allow-Origin': this.apiURL,
        'Access-Control-Allow-Methods': 'GET, POST, OPTIONS, PUT, PATCH, DELETE',
        'Access-Control-Allow-Headers': 'origin,X-Requested-With,content-type,accept',
        'Access-Control-Allow-Credentials': 'true'

      })

原文由 ravichandra vydhya 发布,翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题