Asp.Net Core - 无法从 Dropzone JS 上传文件

Question

我正在使用 asp.net 核心 2.2 和 dropzone js。

我正在尝试连同 dropzone js 中包含的文件一起提交表单。

我有一个输入文件字段（可以隐藏或不隐藏）。我想将 dropzone 文件分配给该字段并提交。但是表单字段始终为空。

代码如下：

MVC 控制器：

[HttpPost]
[ValidateAntiForgeryToken]
public IActionResult Add(ViewModels.Photo model)
{
    var files = HttpContext.Request.Form.Files; // this is also empty
    ....
}

MVC 模型：

public class Photo
{
    ...

    public List<IFormFile> Files { get; set; }
}

HTML:

<form asp-action="Add" asp-controller="Photos" method="post" id="addForm" enctype="multipart/form-data">
    <div class="dropzone">
        <input asp-for="Files" type="file" multiple hidden/>
    </div>
    <button type="submit">Submit</button>
</form>

JS:

var e = "#addForm",
var t = new Dropzone(e, {
    maxFilesize: 1,
    acceptedFiles: ".png,.jpg,.jpeg",
    uploadMultiple: false,
    autoProcessQueue: false
});
t.on("addedfile", function (o) {
    $("#Files").files = t.files;
})

Answer 1

您可以使用不同的操作方法签名

[HttpPost]
public ActionResult Add(HttpPostedFileBase file)
{
    //handle file.InputStream
}

这个例子展示了一个一个上传文件：https://gillesleblanc.wordpress.com/2017/01/25/integrating-dropzone-js-into-an-asp-net-mvc-site/

Answer 2

我设法让一切正常运行，这是一个小修复。

我更改了下面的代码

$("#Files").files = t.files;

到

$("#Files").files = t.hiddenFileInput.files;

t.files 是 dropzone 捕获的文件数组，其中 t.hiddenFileInput.files 是 dropzone 捕获的文件的 FileList 对象。

$("#Files").files 也是一个 FileList 对象，这就是 t.files 由于类型不匹配而无法工作的原因。

现在它使用默认提交机制提交表单字段和文件。

Asp.Net Core - 无法从 Dropzone JS 上传文件

Asp.Net Core - Not Able to Upload Files From Dropzone JS

dropzone.js

asp.net-core-mvc

asp.net-core