اندازهی قلم متن
تخمین مدت زمان مطالعهی مطلب:
دو دقیقه
در قسمت اول دیدیم که توسط Error boundary میتوان استثناءها را در Blazor مدیریت کرد؛ اما اگر بخواهیم قدری سفارشیتر عمل کرده و علاوه بر نمایش پیغام خطای مناسب به صورت جاوا اسکریپتی، استثنای رخ داده را لاگ کنیم چطور؟
همانطور که مشخص است این کامپوننت سفارشی توسط متد ProcessError میتواند خطاها را با استفاده از logger توکار Blazor لاگ نموده و پیغام خطای جاوااسکریپتی نمایش دهد. بدیهی است که میتوان از لاگ کنندههای دیگری نظیر Serilog، Elmah و حتی لاگ کنندههای سفارشی دیگر نیز برای لاگ کردن در این متد بهره جست.
در حقیقت کامپوننت Router را توسط کامپوننت سفارشی خودمان (Error) محصور میکنیم تا کامپوننت Error به صورت آبشاری به هر کامپوننت برنامه که Error را به صورت [ CascadingParameter ] درنظر بگیرد منتقل شود.
همینطور که ملاحظه مینمایید کامپوننت Error به عنوان یک CascadingParameter تعریف شدهاست و در یک بلاک try catch متد ProcessError کامپوننت Error صدا زده شده و استثنای صادر شده به آن ارسال شدهاست. در مثال من کامپوننت Error فقط یک متد پردازش خطا دارد. بدیهی است که این کامپوننت میتواند چندین متد پردازش خطای سفارشی دیگر نیز برای مقاصد مختلف داشته باشد.
خبر خوب اینکه این مهم نیز به راحتی امکان پذیر است؛ با استفاده از مفهوم CascadingValueها.
یک کامپوننت Error.razor به شکل زیر ایجاد میکنیم:
@using Microsoft.Extensions.Logging @inject ILogger<Error> Logger @inject IJSRuntime jsRuntime <CascadingValue Value="this"> @ChildContent </CascadingValue> @code { [Parameter] public RenderFragment? ChildContent { get; set; } public void ProcessError(Exception ex) { Logger.LogError("Error:ProcessError - Type: {Type} Message: {Message}", ex.GetType(), ex.Message); jsRuntime.ToastrError("متاسفانه خطایی رخ داد"); //StateHasChanged(); } }
از StateHasChanged زمانی استفاده خواهد شد که متد پردازش خطا میخواهد به صورت مستقیم در رندر شدن رابط کاربری کامپوننتی که در آن استثنایی رخ دادهاست، دخالت کند. برای مثال زمانیکه میخواهیم تغییری در عناصر رندر شده صفحه، بعد از خطا ایجاد کنیم (رنگ دکمه ای عوض شود یا رنگ فونت برچسب یا تکست باکس یا ...).
حال کامپوننت App.razor را به شکل زیر ویرایش مینماییم:
<Error> <Router ...> ... </Router> </Error>
حال فقط کافی است برای پردازش خطاها به شکل زیر در کامپوننتهای دیگر عمل نمود:
@code { [CascadingParameter] public Error? Error { get; set; } private void CreatePost() { try { throw new InvalidOperationException("پست ساخته نشد!"); } catch (Exception ex) { Error?.ProcessError(ex); } } }