Axios multipart/form-data请求返回"request is not -form multipart/form-data“

Question

我想使用Shopify api。我想用这个接口上传视频。所以像这样的官方文档：

https://shopify.dev/api/examples/product-media#videos-3d-models-post-request

因此，我创建了一个axios配置，并尝试发送请求。我的代码是这样截取的：

        let fd = new FormData();
        fd.append("bucket", bucket);
        fd.append("key", key);
        fd.append("policy", policy);
        fd.append("cache-control", cacheControl);
        fd.append("x-amz-signature", xAmzSignature);
        fd.append("x-amz-algorithm", xAmzAlgorithm);
        fd.append("x-amz-date", xAmzDate);
        fd.append("file", fs.createReadStream('./milk.mp4'));


        const config: AxiosRequestConfig = {
            url: "https://shopify-video-production-core-originals.s3.amazonaws.com/",
            data: fd,
            method: "POST",
            headers: { "Content-Type": "multipart/form-data" }
        }

        try {
            const videoPost = await axios(config);
        }
        catch (err) {
            console.log(err)
        }

所以，我得到了一个类似这样的错误：

   ....
   ....
   [Symbol(kOutHeaders)]: [Object: null prototype]
    },
    data: '<?xml version="1.0" encoding="UTF-8"?>\n' +
      '<Error><Code>MalformedPOSTRequest</Code><Message>The body of your POST request is not well-formed multipart/form-data.</Message><RequestId>184VT99AXG4J6FWW</RequestId><HostId>1IBK7dCgApORGZnaGxS/n22Ftgw0fRBW1EnMuhFpEPek5R3iwsa2T9MH2q8A31l1AU9lhAb2WYA=</HostId></Error>'
  },
  isAxiosError: true,
  toJSON: [Function: toJSON]
}

为什么我会得到这个错误？我该如何解决这个问题呢？请帮帮忙

Answer 1

正如documentation所说，formdata语法有两个版本。

按如下所述更改代码：

fd.append("file", fs.createReadStream('./milk.mp4'));

...

const config: AxiosRequestConfig = {
    url: "https://shopify-video-production-core-originals.s3.amazonaws.com/",
    data: fd,
    method: "POST",
    headers: { "Content-Type": "multipart/form-data" }
}

至

fd.append("file", fs.createReadStream('./milk.mp4'), {filename: 'milk.mp4'});

...

const config: AxiosRequestConfig = {
    url: "https://shopify-video-production-core-originals.s3.amazonaws.com/",
    data: fd,
    method: "POST",
    headers: fd.getHeaders()
}

Answer 2

以下是解决方案

const config: AxiosRequestConfig = {
            url: "https://shopify-video-production-core-originals.s3.amazonaws.com/",
            data: fd,
            method: "POST",
            headers: { ...fd.getHeaders() }  // <-- This is the Fix.
}