React-Node文件上传器

Question

所以我真的很难让文件上传工作。我认为这不会像以前一样具有挑战性。

所以我将从简单的HTML元素开始：

<input type="file" id="server-avatar-file" className="file-input" accept=".jpg,.jpeg,.png" onChange={this.handleChange} style={{position: "absolute", top: "0px", left: "0px", width: "100%", height: "100%", opacity: "0", cursor: "pointer"}} />

以下是我提交的表单数据：

handleSubmit = (event) => {
        event.preventDefault();

        axios.post('/api/v1/testing/upload',
            this.state.file)
          .then(function (response) {
            console.log(response);
          })
          .catch(function (error) {
            console.log(error);
        });
    };

我使用过busboy，多部分是我能想到的。

但我相信这个问题源于我的前端没有将所有正确的信息发送到我的后端。

这就是this.state.file的值：

我理解Node中的bodyParser不解析文件类型，我不熟悉如何在服务器上解析它们。我想通过上传到我的文件系统进行测试，但是想在生产中转移到CDN，这样我就可以很容易地做到这一点很棒！

Answer 1

busboy，multer和其他多部分解析模块需要格式正确的multipart / form-data请求。使用axios发送此类请求的一种简单方法是将FormData实例而不是原始File或Blob实例作为数据参数传递。