Попытка отправить zip-файл с веб-интерфейса реагирования, чтобы выразить внутреннему получению «Ошибка: невозможно установить заголовки после их отправки». - PullRequest
0 голосов
/ 31 августа 2018

Я пытаюсь взять входные данные zipfile из интерфейса реагирования и отправить его в экспресс-бэкэнд для последующей загрузки в корзину s3 и сохранения URL-адресов в базе данных mysql.

import React, { Component } from "react";
import axios from "axios";
class Home extends Component {
    state = {
        selectedFile: null
    };
    handleFileChange = e => {
        this.setState({
            selectedFile: e.target.files
        });
    };

    submit = e => {
        e.preventDefault();
        const { description, selectedFile } = this.state;
        let formData = new FormData();
        formData.append("selectedFile", selectedFile);
        console.log(formData);
        const config = { headers: { "Content-Type": "multipart/form-data" } };
        axios.post("http://localhost:3000/", formData, config);
    };
    render() {
        const { selectedFile } = this.state;
        return (
            <div>
                <form encType="multipart/form-data" method="post" name="fileinfo">
                    <input
                        type="file"
                        name="selectedFile"
                        onChange={this.handleFileChange}
                    />
                    <button type="submit" onClick={e => this.submit(e)}>
                        Submit
                    </button>
                </form>
            </div>
        );
    }
}

export default Home;

Файл, кажется, достигает экспресс-бэкэнда. Я использую const formidable = require("express-formidable"); и app.use(formidable()); чтобы иметь возможность получать мультиформные данные. Вот мой экспресс-маршрут, на который поступает вызов axios.

router.post("/", function(req, res) {
    console.log(req.fields.selectedFile);
    res.send("success");
});

При первой попытке отправки на веб-интерфейс я получаю ошибку 500, затем, если я нажимаю ее снова, она проходит без ошибок, и консоль печатает [object FileList] и третий раз и каждый последующий раз после этого, я получаю Error: Can't set headers after they are sent.. Поэтому точно не знаю, почему он не проходит в первый раз, и почему я не могу получить доступ к файлам в моем списке объектных файлов.

...