.NET Core MVC 中文件输入的远程验证

Remote validation on file input in .NET Core MVC

我已经对文本 属性 实施了远程验证,没有问题,并且远程验证正确触发,但是我还试图在提交表单之前添加对图像上传的验证。理想情况下,我希望在选择本地文件后远程验证文件。有什么办法可以使它正常工作吗?我看不到什么事件实际触发了远程验证,但我猜它不是在文件的输入元素中触发的。 有什么建议么?谢谢

已尝试以下方法:

视图模型:

[Remote(action: "ValidatePhoto", controller: "Photos", ErrorMessage = "Photo width and height must be at least 300 pixels")]
public IFormFile Photo { get; set; }

照片控制器:

public IActionResult ValidatePhoto(IFormFile Photo)
{
    if (Validation.MeetsMinimumImageDimensions(Photo))
    {
        return Json(true);
    }
    return Json(false);
}

查看:

<input id="photoUpload" asp-for="Photo" type="file" accept="image/*" name="Photo" style="display:none" />
<span id="submitError" asp-validation-for="Photo" class="text-danger"></span>

对于内置的Remote验证,它将GetPost方法发送带有字段内容的请求。它不会提交带有表单数据的文件对象。

尝试实现您自己的 ajax 对后端方法的请求。如下所示:

    @section Scripts {
        @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}

        <script type="text/javascript">
            $(document).ready(function () {
                document.querySelector("form input[type=file]").onchange = function (event) {
                    var path = $(this).attr("data-val-remote-url");
                    var field = $(this).attr("id");
                    var errormsg = $(this).attr("data-val-remote");
                    var formdata = new FormData();
                    var file = document.getElementById(field).files[0];
                    formdata.append(field, file)
                    $.ajax({
                        url: path,
                        type: 'POST',
                        data: formdata,
                        processData: false,
                        contentType: false,
                        success: function (data) {
                            if (data == false) {
                                var msg = $("[data-valmsg-for=" + field + "]").first();
                                msg.html(errormsg)
                            }
                        }
                    });
                    return false;
                };
            });
        </script>
    }

使用此方法,它将向操作发送两个请求,使用 Get 方法进行内置验证,并使用 Post 方法进行自定义请求,请尝试更改您的验证方法,例如

    public IActionResult ValidatePhoto(IFormFile Photo)
    {
        if (Request.Method == HttpMethods.Get)
        {
            return Json(true);
        }
        if (Validation.MeetsMinimumImageDimensions(Photo))
        {
            return Json(true);
        }
        return Json(false);
    }