WebAPI的模型校验同ASP.NET MVC的数据校验。
若想在WebAPI加入模型验证,需要三个步骤;
- 1添加需要校验的
- 2添加校验逻辑
- 3 前端测试验证结果
增加模型验证Model
添加用户信息类,添加校验标记。
常用的校验标记有:
. Required:必须满足不为空
. RegularExpression:正则表达式验证
. StringLength:指定字符允许的范围
. DataType:校验数据类型
. Range:指定数字允许的范围
下面是使用了校验标记的用户信息类
/// <summary>
/// 用户信息类
/// </summary>
public class Userinfo
{
/// <summary>
/// 用户编号
/// </summary>
public int id { get; set; }
/// <summary>
/// 姓名
/// </summary>
[Required(ErrorMessage = "用户名称不能为空")]
[MaxLength(6, ErrorMessage = "用户名称不能超过6个字符")]
public string name { get; set; }
/// <summary>
/// 密码
/// </summary>
public string pwd { get; set; }
/// <summary>
/// 年龄
/// </summary>
[Display(Name = "年龄")]
[Range(1, 100,ErrorMessage ="年龄必须介于1到100")]
public int age { get; set; }
/// <summary>
/// 月薪
/// </summary>
[RegularExpression(@"^\d+(\.\d{1,2})?$",ErrorMessage ="月薪需保留两位有效小数")]//保留两位小数
public double salary { get; set; }
/// <summary>
/// 部门编号
/// </summary>
public int deptID { get; set; } = 1;
/// <summary>
/// 部门名称
/// </summary>
public string DapName { get; set; }
/// <summary>
/// 创建时间
/// </summary>
[Display(Name="创建时间")]
[DataType(DataType.Date,ErrorMessage ="创建时间不是时间类型")]
public DateTime createtime { get; set; }
}
添加校验逻辑
WebAPI的校验逻辑是在控制器下的方法中起作用的,如下示例
[HttpGet]
public HttpResponseMessage AddUser(Userinfo model)
{
if (ModelState.IsValid)
{
return Request.CreateResponse(HttpStatusCode.OK, moStudent);
}
return Request.CreateResponse(HttpStatusCode.BadRequest, ModelState);
}
ModelState.IsValid就是用来判断,传入的参数-用户信息类 ,是否通过校验。如果不通过,返回错误信息。
前端显示验证结果
添加一个htmL页面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<div>
<span>姓名</span>
<input type="text" id="name" value="小明"/>
</div>
<div>
<span>密码</span>
<input type="text" id="pwd" value="123"/>
</div>
<div>
<span>年龄</span>
<input type="text" id="age" value="12"/>
</div>
<div>
<span>月薪</span>
<input type="text" id="salary" placeholder="保留两位小数" value="12.23"/>
</div>
<div>
<span>创建时间</span>
<input type="text" id="createtime" value="2017-12-12" />
</div>
<div>
<input type="button" id="btn" value="提交"/>
</div>
<div>
<span>结果:</span>
<span id="result"></span>
</div>
</body>
</html>
<script src="JS/jquery-1.91.min.js"></script>
<script>
$("#btn").click(function () {
var parames = {};
parames.name = $("#name").val();
parames.pwd = $("#pwd").val();
parames.age = $("#age").val();
parames.salary = $("#salary").val();
parames.createtime = $("#createtime").val();
parames.name = $("#name").val();
$.ajax({
type: "GET",
url: "http://localhost:47362/api/Values/AddPage/",
data: parames,
success: function (data) {
//$("#result").html(data.success);
alert(data.success);
},
error: function (a, b, c) {
//$("#result").html(c + a.responseText);
alert(c +": "+ a.responseText);
}
});
});
</script>
运行调试 ,
image.pngimage.png
image.png
image.png
image.png
image.png
网友评论