#javascript #c# #reactjs #axios #.net-5
Вопрос:
Я пытаюсь загрузить файл с несколькими объектами, например, у меня есть студент, который хочет загрузить несколько отсканированных/загруженных файлов. Все должно перетаскиваться, поэтому, когда пользователь перетаскивает файлы, я создаю объекты в приложении react и публикую их через axois с _header[«Тип содержимого»] = «составные/данные формы».
Но я не могу увидеть файл в отправленном объекте. Что я упускаю?
public class CourseFile{ public Guid StudentId{get;set;} public string FileName{get;set;} public boolean IsPdf{get;set;} public IFormFile File{get;set;} }
Студенческий контролер
[Route("upload-files")] [HttpPost] public async Tasklt;IActionResultgt; UploadFiles([FromForm] IListlt;CourseFilegt; models) { var _req = Request; var files = Request.Form.Files; // I can see files here var file = files.First(); var modelProperty = file.Name; // I can see model property here foreach (var courseFile in models) { UploadFiles(courseFile.File) // Always null } }
Реагируйте только на создание кода объекта
private getFormData(data: any, form: FormData, idx = -1, baseKey = "") { if (Array.isArray(data)) data.forEach((item, idx) =gt; this.getFormData(item, form, idx)); Object.keys(data).forEach((key) =gt; { if (!key) return; let _key = idx gt; -1 ? baseKey ? key.indexOf("files") gt;= 0 ? `${baseKey}[][${key}]` : `${baseKey}[${idx}][${key}][]` : `${key}[${idx}]` : key; let itemData = data[key]; if (Array.isArray(itemData)) { itemData.forEach((item, idx) =gt; this.getFormData(item, form, idx, key)); return form; } if (key.indexOf("files") gt;= 0) { form.append(`${baseKey}[${idx}][File][]`, itemData); } else if (itemData) { form.append(_key, itemData); } else { form.append(_key, ""); } }); return form; }
Ответ №1:
Ваша проблема может быть здесь:
form.append(`${baseKey}[${idx}][File][]`, itemData);
Ключ/имя, похоже, довольно привередливы с файлами. В итоге мне пришлось изменить это на следующее, чтобы работать:
form.append(`${baseKey}[${idx}].File`, itemData);
Я сделал упрощенную версию вашего кода (см. Ниже) для тестирования. Я попробовал несколько комбинаций, таких как у вас [File][]
, и [File]
, и, наконец .File
. Последнее было единственным, в результате которого файл был установлен правильно.
*Правка: Похоже, это относится только к IFormFile
ключу. Я мог сделать или [StudentId]
или .StudentId
, и любое из них сработало бы.
код выборки:
const baseKey = 'models'; const data = new FormData(); for (let idx = 0; idx lt; 10; idx ) { const b = new Blob(['This is my blob content ' idx], { type: 'text/plain' }); data.append(`${baseKey}[${idx}].StudentId`, idx); data.append(`${baseKey}[${idx}].File`, b); } fetch('/home/uploadfiles', { method: 'post', body: data });
способ управления:
public class CourseFile { public int StudentId { get; set; } public IFormFile File { get; set; } } public async Tasklt;IActionResultgt; UploadFiles([FromForm] IListlt;CourseFilegt; models) { return Ok(); }
Комментарии:
1. Это сработало, как и ожидалось. Спасибо @David784