‫۳ سال و ۴ ماه قبل، سه‌شنبه ۳۱ فروردین ۱۴۰۰، ساعت ۱۴:۲۰
یک نکته‌ی تکمیلی: روش اعتبارسنجی مقایسه‌ی مقدار دو ورودی
در برنامه‌های Blazor بهتر است از ویژگی جدید [CompareProperty] بجای [Compare] استفاده شود که جزئی از بسته‌ی Microsoft.AspNetCore.Components.DataAnnotations.Validation است. (این مورد در Blazor 5x جزئی از همان ویژگی Compare اصلی شده و دیگر به آن نیازی نیست )
public class EditEmployeeModel 
{
    public string Email { get; set; }

    [CompareProperty("Email", 
        ErrorMessage = "Email and Confirm Email must match")]
    public string ConfirmEmail { get; set; }
}
‫۳ سال و ۴ ماه قبل، سه‌شنبه ۳۱ فروردین ۱۴۰۰، ساعت ۱۳:۲۹
یک نکته‌ی تکمیلی: دسترسی به Local Storage در برنامه‌های Blazor Server
در مطلب سمت کلاینت جاری، با استفاده از کتابخانه‌ای به نام Blazored.LocalStorage، به Local Storage مرورگر دسترسی پیدا کردیم. که در حقیقت محصور کننده‌ی API استاندارد زیر است:
@inject IJSRuntime JSRuntime  

@code {
  string currentInputValue;

  public async Task Save()
  {
    await JSRuntime.InvokeVoidAsync("localStorage.setItem", "name", currentInputValue);
  }

  public async Task Read()
  {
    currentInputValue = await JSRuntime.InvokeAsync<string>("localStorage.getItem", "name");
  }

  public async Task Delete()
  {
    await JSRuntime.InvokeAsync<string>("localStorage.removeItem", "name");
  }
}
بسته‌ی آزمایشی برای همین منظور جهت استفاده در برنامه‌های Blazor Server نیز به نام Microsoft.AspNetCore.Components.ProtectedBrowserStorage وجود دارد/داشت که اکنون جزئی از NET 5x. است. البته این بسته سمت سرور است و بر اساس ASP.NET Core data protection API کار می‌کند و امکان رمزنگاری و رمزگشایی خودکار اطلاعات ذخیره شده‌ی در local storage را فراهم می‌کند. روش کار کردن با آن نیز به صورت زیر است:
@using Microsoft.AspNetCore.Components.Server.ProtectedBrowserStorage
@inject ProtectedLocalStorage BrowserStorage


@code {
  string currentInputValue;

  public async Task Save()
  {
    await BrowserStorage.SetAsync("name", currentInputValue);
  }

  public async Task Read()
  {
    var result = await BrowserStorage.GetAsync<string>("name");
    currentInputValue = result.Success ? result.Value : "";
  }

  public async Task Delete()
  {
    await BrowserStorage.DeleteAsync("name");
  }
}
این بسته همچنین امکان کار با Session Storage مرورگرها را نیز میسر می‌کند (اطلاعات آن از هر tab، به tab دیگری متفاوت بوده و با بسته شدن آن tab، به صورت خودکار حذف می‌شود) که در قطعه کد فوق، تنها یک سطر زیر آن باید تغییر کند:
@inject ProtectedSessionStorage BrowserStorage
‫۳ سال و ۴ ماه قبل، دوشنبه ۳۰ فروردین ۱۴۰۰، ساعت ۱۴:۰۷
یک نکته‌ی تکمیلی: روش تهیه‌ی ویژگی‌های سفارشی اعتبارسنجی، در برنامه‌های Blazor

اگر ویژگی‌های پیش‌فرض مهیا، پاسخگوی اعتبارسنجی مدنظر نبودند، می‌توان یک attribute سفارشی را تهیه کرد:
using System.ComponentModel.DataAnnotations;

namespace CustomValidators
{
    [AttributeUsage(AttributeTargets.Field | AttributeTargets.Property | AttributeTargets.Parameter)]
    public class EmailDomainValidator : ValidationAttribute
    {
        public string AllowedDomain { get; set; }

        protected override ValidationResult IsValid(object value, 
            ValidationContext validationContext)
        {
            string[] strings = value.ToString().Split('@');
            if (strings[1].ToUpper() == AllowedDomain.ToUpper())
            {
                return null;
            }

            return new ValidationResult($"Domain must be {AllowedDomain}",
            new[] { validationContext.MemberName });
        }
    }
}
توضیحات:
- کار با ارث بری از کلاس پایه‌ی ValidationAttribute شروع می‌شود و باید متد IsValid آن‌را بازنویسی کرد.
- اگر متد IsValid، نال برگرداند، یعنی مشکلی نیست؛ در غیراینصورت خروجی آن باید از نوع ValidationResult باشد.
- پارامتر validationContext اطلاعاتی مانند نام خاصیت در حال بررسی را ارائه می‌دهد.
- در اینجا متد ()ValidationContext.GetService نال را بر می‌گرداند؛ یعنی فعلا از تزریق وابستگی‌ها در آن پشتیبانی نمی‌شود.

و در آخر روش استفاده‌ی از آن، همانند سایر ویژگی‌های اعتبارسنجی است:
public class Employee
{
    [EmailDomainValidator(AllowedDomain = "site.com")]
    public string Email { get; set; }
}
‫۳ سال و ۴ ماه قبل، دوشنبه ۳۰ فروردین ۱۴۰۰، ساعت ۱۳:۳۴
یک نکته‌ی تکمیلی: استفاده از fluent validation در برنامه‌های Blazor
کتابخانه‌ی FluentValidation به صورت توکار از Blazor پشتیبانی نمی‌کند؛ اما بسته‌های زیر چنین امکانی را برای آن فراهم کرده‌اند:
‫۳ سال و ۴ ماه قبل، دوشنبه ۳۰ فروردین ۱۴۰۰، ساعت ۱۲:۵۰
یک نکته‌ی تکمیلی: اعتبارسنجی خواص تو در تو

DataAnnotationsValidator ای که در این مطلب معرفی شد، کار اعتبارسنجی خواص تو در تو را انجام نمی‌دهد. برای این موارد، بسته‌ی آزمایشی به نام Microsoft.AspNetCore.Components.DataAnnotations.Validation وجود دارد که پس از نصب، روش استفاده‌ی از آن به صورت زیر است:
public class Employee
{
    [Required]
    public string FirstName { get; set; }

    [Required]
    public string LastName { get; set; }

    [ValidateComplexType]
    public Department Department { get; set; } = new Department();
}

public class Department
{
    [Required]
    public string DepartmentName { get; set; }
}
- ابتدا باید خاصیت تو در تویی که قرار است اعتبارسنجی شود با ویژگی ValidateComplexType مشخص شود.
- سپس تعریف ویژگی‌های اعتبارسنجی بر روی خواص کلاس تو در توی مورد استفاده، همانند قبل خواهد بود و تفاوتی نمی‌کند.
- در آخر جهت انجام عملیات اعتبارسنجی، بجای DataAnnotationsValidator قبلی باید از ObjectGraphDataAnnotationsValidator به صورت زیر استفاده کرد:
<EditForm Model="@Employee">
    <ObjectGraphDataAnnotationsValidator />
    <InputText Id="name" Class="form-control" @bind-Value="@Model.Department.DepartmentName"></InputText>
    <ValidationMessage For="@(() => Model.Department.DepartmentName)" />
</EditForm>
یک نکته‌ی تکمیلی: امکان داشتن متدهایی با خروجی تگ‌دار در برنامه‌های Blazor (یا تعریف کامپوننت‌های پویا)

اگر با React کار کرده باشید، یک چنین کدهایی اساس آن‌را تشکیل می‌دهند:
import React from "react";

const Rentals = () => {
  return <h1>Rentals</h1>;
};

export default Rentals;
در اینجا کامپوننتی به نام Rentals تعریف شده‌است که خروجی آن ... یک تگ HTML ای است و برای تشکیل آن نیازی به استفاده از "" و چسباندن رشته‌ها نبوده‌است. دقیقا شبیه به یک چنین کاری را می‌توان در برنامه‌های Blazor نیز انجام داد که به آن «Razor template syntax» و یا «templated components» هم گفته می‌شود:
@page "/razor"

@template
@ItemTemplate(emp)

@code {

    RenderFragment template = @<p>The time is @DateTime.Now.</p>;
    RenderFragment<Employee> ItemTemplate = (item) => @<p>Employee name is @item.Name.</p>;

    Employee emp = new Employee { Name = "Test" };

    public class Employee
    {
        public string Name;
    }
}
در اینجا همانطور که مشاهده می‌کنید، امکان انتساب یک قالب HTML ای شروع شده‌ی با @ به یک RenderFragment وجود دارد که حتی می‌تواند جنریک هم باشد و وهله‌ای از این شیء جنریک را به صورت یک lambda expression دریافت کند. روش درج آن‌ها را در صفحه نیز مشاهده می‌کنید که همانند فراخوانی متدها است و برای نمونه ItemTemplate جنریک، وهله‌ای از فیلد emp تعریف شده‌ی در قسمت code را دریافت کرده و در صفحه نمایش می‌دهد.
یا حتی می‌توان از RenderFragment برای وهله سازی پویای یک کامپوننت مانند SurveyPrompt، مقدار دهی خاصیت Title آن و درج آن در صفحه به صورت زیر هم استفاده کرد:
 @page "/"
  
 @CreateDynamicComponent()

 @code {
     RenderFragment CreateDynamicComponent() => builder =>
     {
         builder.OpenComponent(0, typeof(SurveyPrompt));
         builder.AddAttribute(1, "Title", "Some title");
         builder.CloseComponent();
     };
 }
یک نکته‌ی تکمیلی: روش دیگری برای انتقال اطلاعات بین کامپوننت‌هایی که در یک سلسله مراتب قرار ندارند
‫۳ سال و ۴ ماه قبل، شنبه ۲۸ فروردین ۱۴۰۰، ساعت ۱۷:۱۹
یک نکته تکمیلی: امکان انتقال کدهای #C یک کامپوننت، به یک فایل مجزای code behind نیز وجود دارد

روال متداول کار با کامپوننت‌های Razor، قرار دادن کدهای #C مربوط به آن‌ها، در قسمت {}code@ همان فایل، با پسوند razor. است. می‌توان جهت بالا بردن قابلیت نگهداری کدهای کامپوننت‌ها، برخوردار شدن از intellisense بهتری و همچنین کاهش حجم فایل‌های razor. که در نهایت به خوانایی بیشتر و ساده‌تر آن‌ها منتهی می‌شود، قطعه‌ی {}code@ را به یک فایل سی‌شارپ مجزا منتقل کرد؛ با این شرایط و نکات خاص:
- اگر برای مثال نام یک کامپوننت، login.razor است، فایل code behind آن باید با همان نام شروع شود و ختم به cs. شود؛ یعنی در این مثال باید دقیقا نام login.razor.cs را داشته باشد و محتوای ابتدایی آن اکنون به صورت زیر خواهد بود:
namespace ProjectName.Folder1.Folder2
{
    public class Login
    {

    }
}
- پس از آن، یک چنین قطعه کدی، کامپایل نخواهد شد؛ چون کامپوننت login.razor که در پوشه‌ی folder1/folder2 واقع شده‌است نیز توسط کامپایلر به یک چنین کلاسی ترجمه می‌شود. برای رفع این مشکل، باید کلاس را به صورت partial تعریف کرد تا کدهای آن جزئی از کدهای کامپوننت login.razor شوند:
namespace ProjectName.Folder1.Folder2
{
    public partial class Login
    {

    }
}
- اکنون جهت انتقال کدهای قطعه {}code@، فقط کافی است آن‌ها را انتخاب و cut کرده و سپس در بدنه‌ی کلاس فوق، paste کنیم. در این حالت نیازی نیست سطوح دسترسی قسمت‌های مختلف کد، مانند private و protected را تغییر داد و همه چیز مانند قبل خواهد بود.

چند نکته:
- سرویس‌هایی که با دایرکتیو inject@ تعریف می‌شوند، در اینجا به صورت زیر توسط Attributes تعریف خواهند شد:
namespace ProjectName.Folder1.Folder2
{
    public partial class Login
    {
        [Inject]
        public NavigationManager NavigationManager { set; get; }

        // ...
    }
}
- فایل سراسری Imports.razor_ که جهت تعریف فضاهای نام تکراری مورد استفاده قرار می‌گرفت، در اینجا کاربردی نداشته و نیاز است فضاهای نام را همانند کدهای متداول #C، در ابتدای فایل cs. جاری ذکر کرد.
- جهت بهبود Intellisense متناظر با قابلیت‌های Blazor، بهتر است کلاس partial تعریف شده، از کلاس پایه ComponentBase نیز ارث بری کند:
namespace ProjectName.Folder1.Folder2
{
    public partial class Login : ComponentBase
    {
        [Inject]
        public NavigationManager NavigationManager { set; get; }

        // ...
    }
}
‫۳ سال و ۴ ماه قبل، یکشنبه ۲۲ فروردین ۱۴۰۰، ساعت ۱۶:۴۶
- این مورد در فایل csproj هم قابل تنظیم است:
<PropertyGroup>
  <AspNetCoreHostingModel>InProcess</AspNetCoreHostingModel>
</PropertyGroup>
البته از زمان ASP.NET Core 3.1 به بعد دیگر نیازی به تنظیم آن نیست و حالت پیش‌فرض است.
- همچنین دیگر نیازی هم به ذکر UseIIS نیست؛ چون جزئی از متد CreateDefaultBuilder است.
‫۳ سال و ۴ ماه قبل، شنبه ۲۱ فروردین ۱۴۰۰، ساعت ۱۴:۰۱
یک نکته‌ی تکمیلی: ساده‌تر شدن به روز رسانی برنامه‌ها در ASP.NET Core 6x
تا پیش از دات نت 6، فایل‌های باینری برنامه‌های ASP.NET Core توسط IIS قفل می‌شوند و امکان جایگزینی آن‌ها بدون متوقف کردن برنامه، میسر نیست. برای رفع این مشکل، پشتیبانی از shadow copy به ASP.NET Core Module for IIS جدید، اضافه شده که روش فعالسازی آن با انجام تغییراتی در Web.Config به صورت زیر است:
<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <!-- To customize the asp.net core module uncomment and edit the following section. 
  For more info see https://go.microsoft.com/fwlink/?linkid=838655 -->

  <system.webServer>
    <handlers>
      <remove name="aspNetCore"/>
      <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModulev2" resourceType="Unspecified"/>
    </handlers>
    <aspNetCore processPath="%LAUNCHER_PATH%" arguments="%LAUNCHER_ARGS%" stdoutLogEnabled="false" stdoutLogFile=".\logs\stdout">
      <handlerSettings>
        <handlerSetting name="experimentalEnableShadowCopy" value="true" />
        <handlerSetting name="shadowCopyDirectory" value="../ShadowCopyDirectory/" />
        <!-- Only enable handler logging if you encounter issues-->
        <!--<handlerSetting name="debugFile" value=".\logs\aspnetcore-debug.log" />-->
        <!--<handlerSetting name="debugLevel" value="FILE,TRACE" />-->
      </handlerSettings>
    </aspNetCore>
  </system.webServer>
</configuration>