如何将文件发送到 api 上传服务器？ [复制]答案

【问题标题】：How do I send a file to the api upload server? [duplicate]如何将文件发送到 api 上传服务器？ [复制]
【发布时间】：2021-07-06 03:11:32
【问题描述】：

我正在尝试通过外部 API 上传文件。我可以通过 API 调用检索上传服务器 URL。现在我需要将文件发送给它。 API 文档说我必须发送带有文件的 POST 请求。但是我的请求被 CORS 阻止了。我是这样发送的：

var request = new XMLHttpRequest();
request.open('POST', data["response"]["upload_url"], true);
request.overrideMimeType("multipart/form-data")

request.onload = function () {
    // ...
};

request.send({"file": f});

如何正确发送请求？

【问题讨论】：

您需要提供有关您的服务器、您的客户端代码和服务器代码的更多信息。或者，您可以read about CORS
@Rojo API 是外部的，不是我的。我编辑了问题以明确这一点。
如果您遇到 CORS 问题，很有可能是相关 API 的提供者不打算在基于浏览器的上下文中使用它。
如果外部 API 不允许您通过 CORS 使用它，那么您就不能从客户端代码中使用它。
也就是说，除了你的 CORS 问题，你的 JS 上传文件是完全错误的。您不能将简单对象传递给 send 方法，overrideMimeType 用于覆盖 response 上的 mime 类型，因此您可以以不同方式解析 response。

标签： javascript post cors

【解决方案1】：

我会使用 fetch 来发送请求，body 应该是 FormData 的一个实例

 var form = new FormData();
 form.append('file', f);

 fetch('upload-url', {
    method: 'POST', 
    body: form
 }).then(function(res){
    console.log(res)
 }).catch(function(err){
    console.log(err)
 })

【讨论】：

这个答案将极大地受益于解释它如何解决 OP 当前的 CORS 问题（我不确定它是否有效）。
@esqew 之前，我正在发送设置为 multipart/form-data 的内容类型标头，并且我遇到了 cors 问题，当我消除了内容类型标头时，它工作得很好。