c# - 剃刀页面上的 Dropzone 返回 400 状态代码
问题描述
我在 ASP.NET 核心 2.0 的 RAZOR 页面上使用 DropZone,其他表单输入如下 -
DzDemo.cshtml 页面 -
<form method="post" enctype="multipart/form-data">
<input type="text" id="Username" name="Username" />
<div class="dropzone" id="my-dropzone" name="mainFileUploader">
<div class="fallback">
<input name="file" type="file" multiple />
</div>
</div>
</form>
<div>
<button type="submit" id="submit-all"> upload </button>
</div>
JS:-
Dropzone.options.myDropzone = {
url: "/DzDemo?handler=Upload",
autoProcessQueue: false,
uploadMultiple: true,
parallelUploads: 100,
maxFiles: 100,
acceptedFiles: "image/*",
// paramName: myParamName,
init: function () {
var submitButton = document.querySelector("#submit-all");
var wrapperThis = this;
submitButton.addEventListener("click", function () {
wrapperThis.processQueue();
});
this.on('sendingmultiple', function (data, xhr, formData) {
formData.append("UserName", $("#Username").val());
});
this.on('error',
function (file, response) {
console.log(response);
alert(response);
});
}
};
DzDemo.cshtml.cs 页面:-
[HttpPost]
public IActionResult OnPostUpload()
{
var data = Request.Form; //This is
return Page();
}
但我从服务器收到 400 响应,我无法处理上传的文件服务器端也不会Upload
在服务器端使用该方法。请帮忙
解决方案
将 dropzone.js 与 Razor Pages 一起使用会导致 400 的一件事是,如果表单中缺少 AntiforgeryToken。
这通常是自动注入的,但删除 _viewimports 或其 taghelpers 会阻止这种情况。
要验证只需在元素内添加这一行<form/>
或查看调试控制台以获取错误消息。
@Html.AntiForgeryToken()
推荐阅读
- c# - 如何修复错误:“rzc generate exited with code 150”
- highcharts - 突出显示 Highcharts 组织结构图节点
- android - kotlin - 立即应用来自 sharedPreferences 的更改
- xamarin.forms - 对于带有 Xamarin 表单的 Android,Crashlytics 将文件名报告为十六进制,行号为零
- django - 绘图图中缺少数据
- docker - 如何在容器之间配置共享卷
- python - 超链接样式在 xlsxwriter python 中使用 set_column 不起作用
- java - 如何模拟在另一种方法中设置的本地对象属性
- php - xmlhttprequest 文件上传无法在移动设备上运行
- vb.net - 在特定情况下删除特定字符串