asp.net core系列之模型绑定和验证方法

一. 模型绑定

ASP.NET Core MVC 中的模型绑定,是将 HTTP 请求中的数据映射到 action方法参数。   这些参数可能是简单类型的参数,如字符串、整数或浮点数,也可能是复杂类型的参数。  当 MVC 收到 HTTP 请求时,它会将此请求路由定位到控制器的指定 action方法。默认路由模板为   {controller=Home}/{action=Index}/{id?}

//例如:请求URL
http://contoso.com/movies/edit/2

//映射到movies/edit/2
public IActionResult Edit(int? id)

上面Url请求对应movies控制器下的Edit方法,该方法接受名为 id 的可选参数。MVC会将Edit中的id参数绑定到路由值中 具有相同名称 的值。 URL 路由中的字符串不区分大小写。

上面示例绑定的参数是简单类型,如果参数是一个类,例如 Movie 类型,该类包含简单和复杂类型作为属性,MVC的模型绑定仍然可以很好地处理它。它使用反射和递归来遍历寻找匹配的复杂类型的属性(如:Collection、Dictionary)。

如果模型绑定失败,MVC 不会引发错误,参数值会是null。 如果HTTP 请求中的数据是用户输入的值,在action中应使用 ModelState.IsValid 属性检查,不需要手动去检查。

注意:若要实现模型绑定,该类必须具有要绑定的公共默认构造函数和公共可写属性。 发生模型绑定时,在使用公共默认构造函数对类进行实例化后才可设置属性。

模型绑定完成后,将发生模型验证。 对于绝大多数开发方案,默认模型绑定效果极佳。还可以扩展,如果有特殊需求,则可自定义内置行为包括:模型绑定特性、全局自定义模型绑定和验证、绑定请求正文中的带格式数据(JSON、XML 和许多其他格式)、还有高级篇中自定义模型绑定。这里不在说明,请查看文档。

二.模型验证

在将数据存储到数据库之前,应用程序必须先验证数据。在 MVC 中,验证发生在客户端和服务器上。

2.1 验证属性

验证属性是模型验证的一种方法, 概念上类似于对数据库表中字段的验证, 验证属性在属性级别指定,下面是一个示例:

public class Movie
{
  public int Id { get; set; }

  [Required]
  [StringLength(100)]
  public string Title { get; set; }

  [ClassicMovie(1960)]
  [DataType(DataType.Date)]
  public DateTime ReleaseDate { get; set; }

  [Required]
  [StringLength(1000)]
  public string Description { get; set; }

  [Range(0, 999.99)]
  public decimal Price { get; set; }

  [Required]
  public Genre Genre { get; set; }

  public bool Preorder { get; set; }
}

常用的内置验证属性包括: [ CreditCard] 信用卡格式、 [Compare]匹配两个属性、 [ EmailAddress] 邮件格式、 [ Phone] 电话格式、 [Range] 给定范围内、 [RegularExpression] 正则表达式、 [Required]必须属性值、 [StringLength] 最大长度、 [Url] URL格式,还可以包括自定义验证属性(例如 ClassicMovie )。 所有的内置验证属性 参考官网

2.2 自定义验证

上面的验证属性适用于大多数验证需求。 但是,某些验证规则特定于你的业务。在 MVC 中创建自定义验证属性很简单。只需从 ValidationAttribute 继承并重写  IsValid 方法。  IsValid 方法采用两个参数,第一个是名为 value 的对象,第二个是名为 validationContext 的  ValidationContext 对象。 Value 引用自定义验证程序要验证的字段中的实际值。

/// <summary>
  /// 自定义验证
  /// </summary>
  public class ClassicMovieAttribute : ValidationAttribute
  {
    private int _year;

    /// <summary>
    /// 验证规则值
    /// </summary>
    /// <param name="year"></param>
    public ClassicMovieAttribute(int year)
    {
      _year = year;
    }

    protected override ValidationResult IsValid(object value, ValidationContext validationContext)
    {
      Movie movie = (Movie)validationContext.ObjectInstance;

      //用户不能将 1960 年以后发行的电影的流派设置为 Classic
      if (movie.Genre == "Classic" && movie.ReleaseDate.Year > _year)
      {
        return new ValidationResult(GetErrorMessage());
      }

      return ValidationResult.Success;
    }

    private string GetErrorMessage()
    {
      return $"Classic movies must have a release year earlier than {_year}.";
    }
  }

运行程序,ReleaseDate是1989年,Genre是Classic,点击Save,验证是在服务端进行,显示错误消息,没有经过前端js验证,如下所示:

2.3 客户端js验证介绍

jQuery 非介入式验证脚本是一个自定义微软前端库,建立在流行的 jQuery Validate 插件。客户端验证原理是: MVC 的标记帮助程序和 HTML 帮助程序则能够使用模型属性中的验证特性和类型元数据,呈现需要验证的表单元素中的 HTML 5 data- 属性。MVC 为内置模型属性和自定义模型属性生成 data- 属性。然后,jQuery 非介入式验证分析  data- 属性并将逻辑传递给 jQuery Validate,从而将服务器端验证逻辑有效地“复制”到客户端。 可以使用相关标记帮助程序在客户端上显示验证错误。

下面示例表单中,asp- 标记帮助程序代码如下:

<div class="form-group">
<label asp-for="ReleaseDate" class="control-label"></label>
<input asp-for="ReleaseDate" class="form-control" />
<span asp-validation-for="ReleaseDate" class="text-danger"></span>
</div>

标记帮助程序将生成以下source html。请注意,HTML 输出中的 data- 属性与  ReleaseDate 属性的验证特性相对应。下面的  data-val-required 属性包含在用户未填写发行日期字段时将显示的错误消息。jQuery 非介入式验证将此值传递给 jQuery Validate required() 方法,该方法随后在随附的 <span> 元素中显示该错误消息。

<form action="/Movies/Create" method="post">
  <div class="form-horizontal">
    <h4>Movie</h4>
    <div class="text-danger"></div>
    <div class="form-group">
      <label class="col-md-2 control-label" for="ReleaseDate">ReleaseDate</label>
      <div class="col-md-10">
        <input class="form-control" type="datetime"
        data-val="true" data-val-required="The ReleaseDate field is required."
        id="ReleaseDate" name="ReleaseDate" value="" />
        <span class="text-danger field-validation-valid"
        data-valmsg-for="ReleaseDate" data-valmsg-replace="true"></span>
      </div>
    </div>
  </div>
</form>

2.4 动态表单添加验证

在创建动态表单后,需要立即对其进行分析。 例如,下面的代码展示如何对通过 AJAX 添加的表单设置客户端验证。

$.get({
  url: "https://url/that/returns/a/form",
  dataType: "html",
  error: function(jqXHR, textStatus, errorThrown) {
    alert(textStatus + ": Couldn't add form. " + errorThrown);
  },
  success: function(newFormHTML) {
    //添加表单newFormHTML
    var container = document.getElementById("form-container");
    container.insertAdjacentHTML("beforeend", newFormHTML);
    //验证第一个表单
    var forms = container.getElementsByTagName("form");
    var newForm = forms[forms.length - 1];
    //分析表单的 data- 属性
    $.validator.unobtrusive.parse(newForm);
  }
})

$.validator.unobtrusive.parse() 方法分析该选择器内表单的  data- 属性。当用户填写表单中的属性值提交时, 这些属性的值传递到 jQuery Validate 插件中,以便表单展示所需的客户端验证规则。

下面用一个简单示例来说明:

(1)  创建dynamic-form-validate.js文件,模拟动态生成表单,以及点击(#idbtn)按钮时验证:

var newFormHTML = "<form action=\"create\" method=\"post\">";
newFormHTML += "<div class=\"form-group\">";
newFormHTML += "<label asp-for=\"Title\" class=\"control- label\"></label>";
newFormHTML += "<input type=\"text\" data-val=\"true\" data-val-required=\"The Title field is required.\" id = \"Title\" name= \"Title\">";
newFormHTML += "<span class=\"text- danger field- validation - valid\" data-valmsg-for=\"Title\" data-valmsg-replace=\"true\"></span>";
newFormHTML += "</div>";
newFormHTML += "<div class=\"form-group\" >";
newFormHTML += "<input type=\"submit\" value=\"Save\" class=\"btn btn-primary\" />";
newFormHTML += "</div >";
newFormHTML += "</form>";

$("#idbtn").click(function () {
  var container = document.getElementById("form-container");
  container.insertAdjacentHTML("beforeend", newFormHTML);

  var forms = container.getElementsByTagName("form");
  var newForm = forms[forms.length - 1];
  //分析表单的 data- 属性
  $.validator.unobtrusive.parse(newForm);
});

(2) 新建create页

@model StudyMVCDemo.Models.Movie
@{
  ViewData["Title"] = "Create";
}
<h1>Create</h1>

<div class="row">
  <input value="动态加载表单" type="button" id="idbtn" />
  <div id="form-container" class="col-md-4">

  </div>
</div>
<div>
  <a asp-action="Index">Back to List</a>
</div>
@section Scripts {
  @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
  <script src="~/js/dynamic-form-validate.js"></script>
}

运行程序,点击"动态加载表单" 调用js将html表单添加到form-container元素容器中,点击save提示该字段不能为空,效果如下所示:

2.5 动态控件添加验证

当向表单动态添加控件(比如:  <input/> 和  <select/> )时,需要更新表单上的验证规则。做法是应当先删除现有的验证数据,然后重新分析整个表单,如下js代码所示:

$.get({
  url: "https://url/that/returns/a/control",
  dataType: "html",
  error: function(jqXHR, textStatus, errorThrown) {
    alert(textStatus + ": Couldn't add control. " + errorThrown);
  },
  success: function(newInputHTML) {
     //向表单动态添加Input控件
    var form = document.getElementById("my-form");
    form.insertAdjacentHTML("beforeend", newInputHTML);
     //移除现有的验证
    $(form).removeData("validator")  // Added by jQuery Validate
        .removeData("unobtrusiveValidation");  // Added by jQuery Unobtrusive Validation
     //重新分析整个表单
    $.validator.unobtrusive.parse(form);
  }
})

2.6  IClientModelValidator

在上面2.2自定义验证中,继承了ValidationAttribute进行服务端验证,还可以结合实现IClientModelValidator接口实现客户端验证,该接口用来控制要添加哪些 data- 属性。实现接口如下所示:

/// <summary>
  /// 自定义验证
  /// </summary>
  public class ClassicMovieAttribute : ValidationAttribute,IClientModelValidator
  {
    private int _year;

    /// <summary>
    /// 年份参考值
    /// </summary>
    /// <param name="year"></param>
    public ClassicMovieAttribute(int year)
    {
      _year = year;
    }

    protected override ValidationResult IsValid(object value, ValidationContext validationContext)
    {
      Movie movie = (Movie)validationContext.ObjectInstance;

      //用户不能将 1960 年以后发行的电影的流派设置为 Classic
      if (movie.Genre == "Classic" && movie.ReleaseDate.Year > _year)
      {
        return new ValidationResult(GetErrorMessage());
      }

      return ValidationResult.Success;
    }

    private string GetErrorMessage()
    {
      return $"Classic movies must have a release year earlier than {_year}.";
    }

    public void AddValidation(ClientModelValidationContext context)
    {
      if (context == null)
      {
        throw new ArgumentNullException(nameof(context));
      }

      MergeAttribute(context.Attributes, "data-val", "true");
      MergeAttribute(context.Attributes, "data-val-classicmovie", GetErrorMessage());

      var year = _year.ToString(CultureInfo.InvariantCulture);
      MergeAttribute(context.Attributes, "data-val-classicmovie-year", year);
    }

    private bool MergeAttribute(IDictionary<string, string> attributes, string key, string value)
    {
      if (attributes.ContainsKey(key))
      {
        return false;
      }

      attributes.Add(key, value);
      return true;
    }
  }

生成的源html代码如下所示:

<input class="form-control" type="date"
data-val="true"
data-val-classicmovie="Classic movies must have a release year earlier than 1960."
data-val-classicmovie-year="1960"
data-val-required="The ReleaseDate field is required."
id="ReleaseDate" name="ReleaseDate" value="1989-02-12">

在上面虽然实现了IClientModelValidator接口,但jQuery不了解规则或消息,还需要自定义 classicmovie 客户端验证方法,添加到jQuery  validator 对象。脚本如下所示:

//添加验证方法
$.validator.addMethod('classicmovie',function (value, element, params) {
     //value ,是当前验证的元素的值。
     //element 元素本身。
     //params 是传入的参数(options.rules)
    var genre = $("#form1").find("#Genre").val(),
      year = params[0],
      date = new Date(value);
    if (genre.length > 0 && genre === 'Classic') {
      // Since this is a classic movie, invalid if release date is after given year.
      return date.getFullYear() <= year;
    }
    return true;
  });

//注册一个适配器,参数1是适配器名称,参数2是验证规则的名称
$.validator.unobtrusive.adapters.add('classicmovie',['year'],function (options) {
    //适配器规则绑定到jquery validation上面
    options.rules['classicmovie'] = [parseInt(options.params['year'])];
    options.messages['classicmovie'] = options.message;
  });

运行程序,ReleaseDate是1989年,Genre是Classic,点击Save,客户端验证返回false,提示错误信息,如下所示:

参考文献

模型绑定

模型验证

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • ASP.NET Core MVC/WebApi基础系列1

    >前言 最近发表的EF Core貌似有点多,可别误以为我只专攻EF Core哦,私下有时间也是一直在看ASP.NET Core的内容,所以后续会穿插讲EF Core和ASP.NET Core,别认为你会用ASP.NET Core就自认为你很了解ASP.NET Core,虽说是基础系列但也是也有你不知道的ASP.NET Core. UseStaticFiles.UseDefaultFiles.UseDirectoryBrowser.UseFileServer 当我们创建默认.NET Core We

  • ASP.NET Core 2.2中的Endpoint路由详解

    Endpoint路由 在ASP.NET Core 2.2中,新增了一种路由,叫做 Endpoint (终结点)路由.本文将以往的路由系统称为 传统路由 . 本文通过源码的方式介绍传统路由和 Endpoint 路由部分核心功能和实现方法,具体功能上的差异见 官方文档 . 在升级到ASP.NET Core 2.2后,会自动启用 Endpoint 路由.如果要恢复以往的实现逻辑,需要加入以下代码: services.AddMvc(options => options.EnableEndpointRou

  • Docker容器运行ASP.NET Core的实现步骤

    最近要学习的知识太多,都不知道先学哪些了,原本计划这篇博客是写xamarin.forms中的listview用法,关于listview的用法简书上有一篇介绍的也比较详细,所以暂时先缓一缓,属于次要任务,等以后再写.本周在万能的淘宝找了写关于区块链的教程,同时了解了下.net core.最近一两年对C#技术跟进不多,侧重点是Java,之前出.net core1.0的时候觉得.net core还不完善,所以就没学,没想到.net core这么快已经要到3.0了.毕竟自己是C#出身,一精多转,不能忘本

  • ASP.NET Core MVC/WebApi基础系列2

    >前言 好久没冒泡了,算起来估计有快半年没更新博客了,估计是我第一次停更如此之久,人总有懒惰的时候,时间越长越懒惰,但是呢,不学又不行,持续的惰性是不行dei,要不然会被时光所抛弃,技术所淘汰,好吧,进入今天的主题,本节内容,我们来讲讲.NET Core当中的模型绑定系统.模型绑定原理.自定义模型绑定.混合绑定.ApiController特性本质,可能有些园友已经看过,但是效果不太好哈,这篇是解释最为详细的一篇,建议已经学过我发布课程的童鞋也看下,本篇内容略长,请保持耐心,我只讲你们会用到的或者

  • ASP.NET Core中自定义路由约束的实现

    路由约束 ASP.NET Core中,通过定义路由模板,可以在Url上传递变量,同时可以针对变量提供默认值.可选和约束. 约束的使用方法是在属性路由上添加指定的约束名,用法如下: // 单个使用 [Route("users/{id:int}")] public User GetUserById(int id) { } // 组合使用 [Route("users/{id:int:min(1)}")] public User GetUserById(int id) {

  • asp.net core系列之模型绑定和验证方法

    一. 模型绑定 ASP.NET Core MVC 中的模型绑定,是将 HTTP 请求中的数据映射到 action方法参数.   这些参数可能是简单类型的参数,如字符串.整数或浮点数,也可能是复杂类型的参数.  当 MVC 收到 HTTP 请求时,它会将此请求路由定位到控制器的指定 action方法.默认路由模板为   {controller=Home}/{action=Index}/{id?} //例如:请求URL http://contoso.com/movies/edit/2 //映射到mo

  • ASP.NET Core 中的模型绑定操作详解

    ASP.Net Core的模型绑定是一个非常有用的功能.一般我们控制器处理Http请求的数据,是通过路由数据提供一个记录键,然后发布的表单域为模型提供一个值,这个过程很繁琐,并且容易出错.而模型绑定会自动化该过程,减少出错的概率.本文介绍下模型绑定中常用的一些操作指南. [BindProperty] .[BindProperties]属性.第一个属性是用于控制器或 PageModel 类的公共属性,从而使模型绑定以该属性为目标:第二个属性是.Net 2.1及以上版本所有,可以使模型绑定以该类的所

  • asp.net core 修改默认端口的几种方法

    一般情况下,aspnetcore发布后的默认端口是5000,这个大家都知道,而且默认骨架代码中没有看到任何让你输入的ip地址和端口号,但作为程序员的我们,不希望 被框架所管制,那如何实现默认端口的修改呢? 骨架代码: public class Program { public static void Main(string[] args) { CreateWebHostBuilder(args).Build().Run(); } public static IWebHostBuilder Cre

  • ASP.NET Core中Razor页面的Handlers处理方法详解

    简介 在前一篇文章中,我们讨论了Razor页面.今天我们来谈谈处理方法(Handlers). 我们知道可以将代码和模型放在 .cshtml 文件里面或与 .cshtml 匹配的 .cshtml.cs 文件中. Razor页面处理程序或处理方法将用户请求匹配到我们的方法:请求来自 **.cshtml **文件. Razor页面遵循特定的命名约定.从上一篇文章可以看出,.NET Core开发工具自动生成了很多处理方法,例如下面这些: OnGet OnPost OnGetAsync OnPostAsy

  • ASP.NET Core整合Zipkin链路跟踪的实现方法

    前言     在日常使用ASP.NET Core的开发或学习中,如果有需要使用链路跟踪系统,大多数情况下会优先选择SkyAPM.我们之前也说过SkyAPM设计确实比较优秀,巧妙的利用DiagnosticSource诊断跟踪日志,可以做到对项目无入侵方式的集成.其实还有一款比较优秀的链路跟踪系统,也可以支持ASP.NET Core,叫Zipkin.它相对于SkyWalking来说相对轻量级,使用相对来说比较偏原生的方式,而且支持Http的形式查询和提交链路数据.因为我们总是希望能拥有多一种的解决方

  • asp.net core中如何使用cookie身份验证

    背景 ASP.NET Core Identity 是一个完整的全功能身份验证提供程序,用于创建和维护登录名. 但是, cookie 不能使用基于的身份验证提供程序 ASP.NET Core Identity . 配置 在 Startup.ConfigureServices 方法中,创建具有 AddAuthentication 和 AddCookie 方法的身份验证中间件服务: services.AddAuthentication(CookieAuthenticationDefaults.Auth

  • asp.net core 实现一个简单的仓储的方法

    一直有自己写个框架的想法,但是一直没有行动起来,最近比较闲,正好可以开工了. 现在已经完成了两部分.1.一个简单仓储,实现使用的是ef 2.IOC部分,这里是把内置的ioc替换成了aotofac,这部分感觉还是有一点缺陷的.下面说 仓储部分 这里主要是接口是实现,目前使用ef实现了仓储的接口.看一下代码 public interface IRepository<TEntity, TPrimaryKey> where TEntity : class { #region Select/Get/Qu

  • ASP.NET Core 2.1 使用Docker运行的方法步骤

    1.新建一个 ASP.NET Core 2.1 项目 然后运行一下项目,确保我们刚刚建立的项目可以正常运行. 2.编写 Dockerfile 新建一个文本文件,命名为 Dockerfile FROM microsoft/dotnet:2.1-aspnetcore-runtime WORKDIR /app COPY . . EXPOSE 80 ENTRYPOINT ["dotnet", "AspNetCore.Docker.dll"] 这里我们需要用到官方的镜像:mi

  • ASP.NET Core中预压缩静态文件的方法步骤

    前言 Web应用程序的优化是非常重要,因为使用更少的CPU,占用更少的带宽可以减少项目的费用. 在ASP.NET Core中我们可以很容易的启用响应压缩,但是针对预压缩文件,就需要做一些额外的功能了. 这篇博客文章展示了如何在ASP.NET Core中预压缩静态文件. 下面话不多说了,来一起看看详细的介绍吧 为什么需要预压缩文件? 虽然在从服务器请求文件时, 我们可以动态压缩文件,但这意味这Web服务器需要做更多的额外工作. 其实只有在新的应用程序部署时才会更改要压缩的文件. 越好的压缩效果需要

  • Asp.Net Core中基于Session的身份验证的实现

    在Asp.Net框架中提供了几种身份验证方式:Windows身份验证.Forms身份验证.passport身份验证(单点登录验证). 每种验证方式都有适合它的场景: 1.Windowss身份验证通常用于企业内部环境,Windows Active Directory就是基于windows平台的身份验证实现: 2.Forms身份验证是Asp.Net框架中提出的另一种验证方式: 3.passport身份验证是微软提供的基于自己的lives账号实现的单点认证服务. Asp.net Core验证码登录遇到

随机推荐