Передача файла из Dropzone.js в бэкенд .NET Core

Question

Код на стороне бэкенда

[HttpPost]
public async Task<IActionResult> OnPostUploadAsync(IFormFile files)
{
    Console.WriteLine("POST OK " + files.FileName);

    if (files.Length > 0)
    {
        var filePath = Path.GetTempFileName();
        Console.WriteLine(filePath.ToString());
        Console.WriteLine("FILENAME " + files.FileName);
        using (var stream = System.IO.File.Create(@"C:\Users\dm" + files.FileName))
        {
            await files.CopyToAsync(stream);
        }
    }

    return Ok();
}

Код на стороне фронта - плагин Dropzone.js, перетаскиваешь туда файл и он его отправляет на /upload-files

Я сделал роут upload-files и метод OnPostUploadAsync(IFormFile files) успешно вызывается, о чем свидетельствует срабатывание Console.WriteLine("POST OK " + files.FileName);

К сожалению срабатывает он нульрефом и говорит что IFormFile files равен null

Вопрос - в каком формате передает Dropzone.js? Какой формат аргумента подставить?

В официальной документации написано

Dropzone не предоставляет реализацию обработки файлов на стороне сервера, но способ загрузки файлов идентичен простым формам загрузки файлов:

<form action="" method="post" enctype="multipart/form-data">
  <input type="file" name="file" />
</form>

Тогда какие аргументы мне нужно написать на стороне сервера?

Answer 1

Ваш код на стороне бэкенда по сути правильный, за исключением одного нюанса.

Название аргумента OnPostUploadAsync(IFormFile files) должно соответствовать названию передаваемого параметра.

В вашем случае название аргумента указано как files, а dropzone.js по умолчанию использует paramName: "file"

Чтобы решить проблему вы либо меняете имя аргумента в бэкенде:

public async Task<IActionResult> Upload(IFormFile file) {
    Console.WriteLine("POST OK " + file.FileName);

    if (file.Length > 0)
    {
        var filePath = Path.GetTempFileName();
        Console.WriteLine(filePath.ToString());
        Console.WriteLine("FILENAME " + file.FileName);
        using (var stream = System.IO.File.Create(@"C:\Users\dm" + file.FileName))
        {
            await file.CopyToAsync(stream);
        }
    }

    return Ok();
}

Либо меняете имя параметра dropzone в JS:

Dropzone.options.myForm = {
    paramName: "files"
};

Где myForm - id вашей html формы:

<form action="" method="post" enctype="multipart/form-data" id="my-form">
  <input type="file" name="file" />
</form>

БЛОГ НА HUSL

Передача файла из Dropzone.js в бэкенд .NET Core

Ответы (1 шт):