Reactjs 如何使用Axios将多个文件发送到ASP.NET Core的控制器?

Reactjs 如何使用Axios将多个文件发送到ASP.NET Core的控制器?,reactjs,asp.net-core,axios,form-data,Reactjs,Asp.net Core,Axios,Form Data,我尝试过收集和反序列化JSON,但没有任何效果。我不熟悉ASP.NET核心、React和Axios。我正在开发一个功能,用户可以上传多个文件,并提供该事件的详细信息 我使用了以下代码 uploadFiles() { var eventDate = moment(this.state.dateOfEvent).format("DD/MM/YYYY"); var eDate = Date.parse(eventDate) var formData = new FormData

我尝试过收集和反序列化JSON,但没有任何效果。我不熟悉ASP.NET核心、React和Axios。我正在开发一个功能,用户可以上传多个文件,并提供该事件的详细信息

我使用了以下代码

uploadFiles() {
    var eventDate = moment(this.state.dateOfEvent).format("DD/MM/YYYY");
    var eDate = Date.parse(eventDate)
    var formData = new FormData();
    formData.append("Event_name", this.state.eventName);

    var imgArr = [];
    for (var i = 0; i < this.state.chosenImages.length; i++) {
        imgArr.push(this.state.chosenImages[i]);
    }

    var jsonImgs = JSON.stringify(imgArr);
    formData.append("Image_Path", jsonImgs);
    formData.append("Event_Date", eventDate);
    axios({
        method: 'POST',
        url: '/api/Account/UploadGalleryImages',
        contentType: 'application/json',
        data: formData,
    }).then(function (response) {
        if (response.data.status == "SUCCESS") {
            confirmAlert({
                title: 'Gallery',
                message: response.data.message,
                buttons: [
                    {
                        label: 'Okay',
                        onClick: () => window.location.replace('/Reload_Window')
                    },
                ]
            });
        }
        else {
            console.log("Response:", response);
            confirmAlert({
                title: 'Window Title',
                message: response.data.message,
                buttons: [
                    {
                        label: 'Okay',
                    },
                ]
            });
        }
    }.bind(this))

}
ASP.NET核心中控制器的请求对象

    public class GalleryImagesAddRequest
    {
        private string event_name;
        private string event_date;
        private IList<IFormFile> fileCollection;

        public string Event_name { get => event_name; set => event_name = value; }
        public IList<IFormFile> Image_Path { get => fileCollection; set => fileCollection = value; }
        public string Event_Date { get => event_date; set => event_date = value; }
    }

请告诉我在服务器端接收所有图像时哪里出错了?

首先,您不需要序列化文件数组,其次,为了在
ASP.NET Core
中绑定数组,您需要使用相同的键将多个值附加到
FormData
。所以改变这部分代码

var imgArr = [];
for (var i = 0; i < this.state.chosenImages.length; i++) {
    imgArr.push(this.state.chosenImages[i]);
}

var jsonImgs = JSON.stringify(imgArr);
formData.append("Image_Path", jsonImgs);
var imgArr=[];
for(var i=0;i

for(var i=0;i
非常感谢!!!它工作得很好。经过很长时间和这么多天,最终我的控制器收到选定的文件。我想对这个答案投一票以上,但我不能。非常感谢你,亚历山大。
    public class GalleryImagesAddRequest
    {
        private string event_name;
        private string event_date;
        private IList<IFormFile> fileCollection;

        public string Event_name { get => event_name; set => event_name = value; }
        public IList<IFormFile> Image_Path { get => fileCollection; set => fileCollection = value; }
        public string Event_Date { get => event_date; set => event_date = value; }
    }
        [HttpPost("UploadGalleryImages")]
        [Route("api/[controller]/[action]")]
        public string UploadGalleryImages(GalleryImagesAddRequest request)
        {
            Gallery gallery = new Gallery();
            EventDetail eventDetail = new EventDetail();
            Context db = new Context();
            string message = "";

            try
            {
                DateTime dateTime = DateTime.Parse(request.Event_Date).Date;
                eventDetail.event_name = request.Event_name;
                eventDetail.event_date = dateTime;
                db.EventDetail.Add(eventDetail);
                db.SaveChanges();

                message = "SUCCESS";
            }catch(Exception ex)
            {
                new Logger().write(ex);
                message = "failed";
            }

            return message;
        }
var imgArr = [];
for (var i = 0; i < this.state.chosenImages.length; i++) {
    imgArr.push(this.state.chosenImages[i]);
}

var jsonImgs = JSON.stringify(imgArr);
formData.append("Image_Path", jsonImgs);
for (var i = 0; i < this.state.chosenImages.length; i++) {
    formData.append("Image_Path", this.state.chosenImages[i]);
}