error: Bad content type. Please use multipart

Question

我对文件上传完全陌生....我正在使用 angular-file-upload 创建 XHR outside 的 angularjs 将文件上传到 google 云存储。当我尝试上传时，我不断收到以下错误。我该如何解决这个问题？

400 Bad content type. Please use multipart.

这是我的控制器设置：

var uploader = $scope.uploader = new FileUploader({
      url: 'https://www.googleapis.com/upload/storage/v1/b/bucketsbuckets/o?uploadType=multipart',
      headers : {
            'Authorization': 'Bearer ya29.lgHmbYk-5FgxRElKafV4qdyWsdMjBFoO97S75p4vB0G0d6fryD5LASpf3JUY8Av9Yzhp9cQP8IQqhA', 
            'Content-Type': 'multipart/form-data'
      },
      autoUpload:true
  });

Answer 1

问题是您使用的端点用于分段上传，而不是基于 FORM 的分段上传。如果您将 Content-Type 设置为 "multipart/related" 而不是 "multipart/form-data"，您应该可以继续。

到该端点 "www.googleapis.com/upload/storage/etc?uploadType=multipart" 的分段上传需要一个包含两部分的分段消息，第一部分是 JSON 中对象的元数据，第二部分是数据.

有关这些要求的更多信息，请参见此处：https://cloud.google.com/storage/docs/json_api/v1/how-tos/upload

但是，如果您想以表单提交的方式进行上传，那也是可以的，但规则不同。在这种情况下，您将使用各种适当的表单参数提交 POST 到 "storage.googleapis.com/BUCKET/OBJECT"：https://cloud.google.com/storage/docs/reference-methods#postobject

现在，这一切都假定您出于某种原因尝试将上传作为多部分请求进行。如果您需要在对象上设置一些特定的元数据属性，这可能是必要的，但如果不需要，您可能会让事情变得更难。一个简单的 PUT 到 "storage.googleapis.com/BUCKET/OBJECT" 就可以了（虽然我不熟悉 angular-file-upload 并且不知道它是否支持非表单样式的上传）。

Answer 2

对于那些使用 fetch 的人，只需删除 header 上的 content-type。

我在 github 上发现了这个问题，我引用：

Setting the Content-Type header manually means it's missing the boundary parameter. Remove that header and allow fetch to generate the full content type. It will look something like this:

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

Fetch knows which content type header to create based on the FormData object passed in as > the request body content.

^^ 这个对我有用。

error: Bad content type. Please use multipart

error: Bad content type. Please use multipart

javascript

file-upload

xmlhttprequest

google-cloud-storage

angularjs