FluentValidation یک کتابخانه‌ی اعتبارسنجی اطلاعات سمت سرور است و راهکاری را برای اعتبارسنجی‌های سمت کلاینت ارائه نمی‌دهد؛ اما میتواند متادیتای مورد نیاز
unobtrusive java script validation را تولید کند و به این ترتیب بسیاری از قواعد آن دقیقا همانند روش‌های توکار اعتبارسنجی ASP.NET Core در سمت کلاینت نیز کار می‌کنند؛ مانند:
• NotNull/NotEmpty
• Matches (regex)
• InclusiveBetween (range)
• CreditCard
• Email
• EqualTo (cross-property equality comparison)
• MaxLength
• MinLength
• Length
اما باید دقت داشت که سایر قابلیت‌های این کتابخانه، قابلیت ترجمه‌ی به قواعد unobtrusive java script validation ندارند؛ مانند:
- استفاده‌ی از شرط‌ها توسط متدهای When و یا Unless (برای مثال اگر خاصیت A دارای مقدار 5 بود، آنگاه ورود اطلاعات خاصیت B باید اجباری شود)
- تعریف قواعد اعتبارسنجی سفارشی، برای مثال توسط متد Must
- تعریف RuleSetها (برای مثال تعیین کنید که از یک مدل، فقط تعدادی از خواص آن اعتبارسنجی شوند و نه تمام آنها)
در یک چنین حالت‌هایی باید کاربر اطلاعات کامل فرم را به سمت سرور ارسال کند و در post-back صورت گرفته، نتایج اعتبارسنجی را دریافت کند.
روش توسعه‌ی اعتبارسنجی سمت کلاینت کتابخانه‌ی FluentValidation جهت سازگاری آن با unobtrusive java script validation
باتوجه به اینکه قواعد سفارشی کتابخانه‌ی FluentValidation، معادل unobtrusive java script validation ای ندارند، در ادامه مثالی را جهت تدارک آنها بررسی میکنیم. برای این منظور، معادل مطلب «
ایجاد ویژگی‌های اعتبارسنجی سفارشی در ASP.NET Core 3.1 به همراه اعتبارسنجی سمت کلاینت آنها» را بر اساس ویژگی‌های کتابخانه‌ی FluentValidation پیاده سازی میکنیم.
1) ایجاد اعتبارسنج سمت سرور
می‌خواهیم اگر مقدار عددی خاصیتی بیشتر از مقدار عددی خاصیت دیگری بود، اعتبارسنجی آن با شکست مواجه شود. به همین منظور با پیاده سازی یک PropertyValidator سفارشی، LowerThanValidator را به صورت زیر تعریف میکنیم:
using System;
using FluentValidation;
using FluentValidation.Validators;
namespace FluentValidationSample.Models
{
public class LowerThanValidator : PropertyValidator
{
public string DependentProperty { get; set; }
public LowerThanValidator(string dependentProperty) : base($"باید کمتر از {dependentProperty} باشد")
{
DependentProperty = dependentProperty;
}
protected override bool IsValid(PropertyValidatorContext context)
{
if (context.PropertyValue == null)
{
return false;
}
var typeInfo = context.Instance.GetType();
var dependentPropertyValue =
Convert.ToInt32(typeInfo.GetProperty(DependentProperty).GetValue(context.Instance, null));
return int.Parse(context.PropertyValue.ToString()) < dependentPropertyValue;
}
}
public static class CustomFluentValidationExtensions
{
public static IRuleBuilderOptions<T, int> LowerThan<T>(
this IRuleBuilder<T, int> ruleBuilder, string dependentProperty)
{
return ruleBuilder.SetValidator(new LowerThanValidator(dependentProperty));
}
}
}
- در اینجا dependentProperty همان خاصیت دیگری است که باید مقایسه با آن صورت گیرد. در متد بازنویسی شده‌ی IsValid، میتوان مقدار آن‌را از context.Instance استخراج کرده و سپس با مقدار جاری context.PropertyValue مقایسه کرد.
- همچنین جهت سهولت کار فراخوانی آن، یک متد الحاقی جدید به نام LowerThan نیز در اینجا تعریف شده‌است.
- البته اگر قصد اعتبارسنجی سمت سرور را ندارید، میتوان در متد IsValid، مقدار true را بازگشت داد.
2) ایجاد متادیتای مورد نیاز جهت unobtrusive java script validation در سمت سرور
در ادامه نیاز است ویژگی‌های data-val خاص unobtrusive java script validation را توسط FluentValidation ایجاد کنیم:
using FluentValidation;
using FluentValidation.AspNetCore;
using FluentValidation.Internal;
using FluentValidation.Resources;
using FluentValidation.Validators;
using Microsoft.AspNetCore.Mvc.ModelBinding.Validation;
namespace FluentValidationSample.Models
{
public class LowerThanClientValidator : ClientValidatorBase
{
private LowerThanValidator LowerThanValidator
{
get { return (LowerThanValidator)Validator; }
}
public LowerThanClientValidator(PropertyRule rule, IPropertyValidator validator) :
base(rule, validator)
{
}
public override void AddValidation(ClientModelValidationContext context)
{
MergeAttribute(context.Attributes, "data-val", "true");
MergeAttribute(context.Attributes, "data-val-LowerThan", GetErrorMessage(context));
MergeAttribute(context.Attributes, "data-val-LowerThan-dependentproperty", LowerThanValidator.DependentProperty);
}
private string GetErrorMessage(ClientModelValidationContext context)
{
var formatter = ValidatorOptions.MessageFormatterFactory().AppendPropertyName(Rule.GetDisplayName());
string messageTemplate;
try
{
messageTemplate = Validator.Options.ErrorMessageSource.GetString(null);
}
catch (FluentValidationMessageFormatException)
{
messageTemplate = ValidatorOptions.LanguageManager.GetStringForValidator<NotEmptyValidator>();
}
return formatter.BuildMessage(messageTemplate);
}
}
}
در این کدها، تنها قسمت مهم آن، متد AddValidation است که کار تعریف و افزودن متادیتاهای unobtrusive java script validation را انجام میدهد و برای مثال سبب رندر یک چنین تگ HTML ای می‌شود که در آن پیام اعتبارسنجی و خاصیت دیگر مدنظر ذکر شده‌اند:
<input dir="rtl" type="number"
data-val="true"
data-val-lowerthan="باید کمتر از Age باشد"
data-val-lowerthan-dependentproperty="Age"
data-val-required="'سابقه کار' must not be empty."
id="Experience"
name="Experience"
value="">
3) تعریف مدل کاربران و اعتبارسنجی آن
مدلی که در این مثال از آن استفاده شده، یک چنین تعریفی را دارد و در قسمت اعتبارسنجی خاصیت Experience آن، از متد الحاقی جدید LowerThan استفاده شده‌است:
public class UserModel
{
[Display(Name = "نام کاربری")]
public string Username { get; set; }
[Display(Name = "سن")]
public int Age { get; set; }
[Display(Name = "سابقه کار")]
public int Experience { get; set; }
}
public class UserValidator : AbstractValidator<UserModel>
{
public UserValidator()
{
RuleFor(x => x.Username).NotNull();
RuleFor(x => x.Age).NotNull();
RuleFor(x => x.Experience).LowerThan(nameof(UserModel.Age)).NotNull();
}
}
4) افزودن اعتبارسنج‌های تعریف شده به تنظیمات برنامه
پس از تعریف LowerThanValidator و LowerThanClientValidator، روش افزودن آنها به تنظیمات FluentValidation به صورت زیر است:
namespace FluentValidationSample.Web
{
public class Startup
{
public void ConfigureServices(IServiceCollection services)
{
services.AddControllersWithViews().AddFluentValidation(
fv =>
{
fv.RegisterValidatorsFromAssembly(Assembly.GetExecutingAssembly());
fv.RegisterValidatorsFromAssemblyContaining<RegisterModelValidator>();
fv.RunDefaultMvcValidationAfterFluentValidationExecutes = false;
fv.ConfigureClientsideValidation(clientSideValidation =>
{
clientSideValidation.Add(
validatorType: typeof(LowerThanValidator),
factory: (context, rule, validator) => new LowerThanClientValidator(rule, validator));
});
}
);
}
5) تعریف کدهای جاوا اسکریپتی مورد نیاز
پیش از هرکاری، اسکریپت‌های فایل layout برنامه باید چنین تعریفی را داشته باشند:
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/lib/jquery-validation/dist/jquery.validate.js"></script>
<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
در اینجا مداخل jquery، سپس jquery.validate و بعد از آن jquery.validate.unobtrusive را مشاهده میکنید. در ادامه فایل js/site.js را به صورت زیر تکمیل خواهیم کرد:
$.validator.unobtrusive.adapters.add('LowerThan', ['dependentproperty'], function (options) {
options.rules['LowerThan'] = {
dependentproperty: options.params['dependentproperty']
};
options.messages['LowerThan'] = options.message;
});
$.validator.addMethod('LowerThan', function (value, element, parameters) {
var dependentProperty = '#' + parameters['dependentproperty'];
var dependentControl = $(dependentProperty);
if (dependentControl) {
var targetvalue = dependentControl.val();
if (parseInt(targetvalue) > parseInt(value)) {
return true;
}
return false;
}
return true;
});
در اینجا یکبار اعتبارسنج LowerThan را به validator.unobtrusive معرفی میکنیم. سپس منطق پیاده سازی آن‌را که بر اساس یافتن مقدار خاصیت دیگر و مقایسه‌ی آن با مقدار خاصیت جاری است، به اعتبارسنج‌های jQuery Validator اضافه خواهیم کرد.
6) آزمایش برنامه
پس از این تنظیمات، اگر Viewما چنین تعریفی را داشته باشد:
@using FluentValidationSample.Models
@model UserModel
@{
ViewData["Title"] = "Home Page";
}
<div dir="rtl">
<form asp-controller="Home"
asp-action="RegisterUser"
method="post">
<fieldset class="form-group">
<legend>ثبت نام</legend>
<div class="form-group row">
<label asp-for="Username" class="col-md-2 col-form-label text-md-left"></label>
<div class="col-md-10">
<input dir="rtl" asp-for="Username" class="form-control" />
<span asp-validation-for="Username" class="text-danger"></span>
</div>
</div>
<div class="form-group row">
<label asp-for="Age" class="col-md-2 col-form-label text-md-left"></label>
<div class="col-md-10">
<input dir="rtl" asp-for="Age" class="form-control" />
<span asp-validation-for="Age" class="text-danger"></span>
</div>
</div>
<div class="form-group row">
<label asp-for="Experience" class="col-md-2 col-form-label text-md-left"></label>
<div class="col-md-10">
<input dir="rtl" asp-for="Experience" class="form-control" />
<span asp-validation-for="Experience" class="text-danger"></span>
</div>
</div>
<div class="form-group row">
<label class="col-md-2 col-form-label text-md-left"></label>
<div class="col-md-10 text-md-right">
<button type="submit" class="btn btn-info col-md-2">ارسال</button>
</div>
</div>
</fieldset>
</form>
</div>
در صورتیکه سابقه‌ی کار را بیشتر از سن وارد کنیم، به یک چنین خروجی سمت کلاینتی (بدون نیاز به post-back کامل به سمت سرور) خواهیم رسید:
