Question

我正在尝试将文件上传到S3，文件已成功上传，但是下载时包含WebKitFormBoundary

------WebKitFormBoundaryrTBzWaHQntWAtZLX
Content-Disposition: form-data; name="file"

hello world
------WebKitFormBoundaryrTBzWaHQntWAtZLX--

使用axios上传

const formData = new FormData();
formData.append('file', this.file);

this.axios.put(this.formUrl,
                formData,
                {
                    headers: {
                        // 'Content-Type': `multipart/form-data`,
                        'Content-Type' : 'application/octet-stream',
                    },
                })
                .then((res) => {

console.log（res） }）。catch（（e）=> { console.error（e） }）;

如何删除边界

Answer 1

我遇到了同样的问题。但是解决方案很简单。这是我用来上传文件的代码

axios({
    method: "PUT",
    url: url,
    data: fileToUpload,  // NOTE - this is the file not the FormData Object
    headers: { 
        "Content-Type": "multipart/form-data" }
    })
    .then(res => {
        this.setState({
            uploadSuccess: "File upload successfull",
                error: undefined
            });
     })
    .catch(err => {
       console.log(err) 
    });

真正发生的是将文件附加到FormData时，FormData被序列化并且序列化的数据存储在S3中。这就是文件损坏的原因。

在解决方案中，我们不要将文件包装在FormData对象中。我们要做的是直接将文件添加到数据属性。因此，除了文件本身之外，没有其他东西会被序列化并存储在S3中。

希望这个答案会有所帮助

WebKitFormBoundary使用axios FormData将文件上传到S3

1 个答案: