SignalR کتابخانه‌ای برای توسعه‌دهندگان ASP.NET Core

SignalR را می‌توان یکی از کتابخانه‌های جدید برای توسعه‌دهندگانی که با ASP.NET کار می‌کنند، دانست. به کمک آموزش SignalR در ASP.NET Core می‌توان توسعه وب را در Real Time ساده‌تر کرد. از سوی دیگر به کمک استفاده از SignalR می‌توان ارتباط دوسویه‌ای بین کلاینت و سرور ایجاد کرد. به دلیل مزایای زیاد این کتابخانه در این قسمت قصد داریم تا به آموزش SignalR در ASP.NET Core بپردازیم.

آموزش SignalR در ASP.NET Core

از جمله کتابخانه‌های جدید برای توسعه‌دهندگانی که با ASP.NET کار می‌کنند، می‌توان به SignalR اشاره کرد. این کتابخانه می‌تواند باعث ایجاد یک رابطه دوطرفه بین کلاینت و سرور شود. همچنین امکان توسعه دادن وب را در زمان واقعی یا Real Time را در اختیار توسعه‌دهندگان قرار می‌دهد. به کمک استفاده از SignalR می‌توان دیتاهای موجود در سرور را به سمت کلاینت یا مشتری متصل کرد.

همچنین باید به این نکته اشاره کرد که کتابخانه signalR می‌تواند از Web Sockets پشتیبانی کرده و ازاین‌رو تکنیک‌های سازگار با مرورگرها را از بین نمی‌برد. به دلیل مزایای زیاد یا این کتابخانه، آموزش signalR در ASP.NET Core اهمیت زیادی پیدا کرده است.

پیش‌نیازهای آموزش SignalR در ASP.NET Core

درصورتی‌که شما هم می‌خواهید با آموزش SignalR در ASP.NET Core همراه شوید، به یک سری پیش‌نیاز، نیازمند خواهید بود؛ به همین دلیل نیاز است تا در ابتدا Visual Studio 2022 با ابزار Web Development را در اختیار داشته باشید. بعد از به‌دست‌آوردن این پیش‌نیازها، آموزش SignalR در ASP.NET Core آغاز خواهد شد.

یک پروژه وب بسازید

در اولین قدم از آموزش SignalR در ASP.NET Core نیاز است تا Visual Studio 2022 را راه‌اندازی کرده و بر روی گزینه Create a New Project کلیک کنید. سپس در پنجره Create a new project بر روی ASP.NET Core Web App کلیک کرده و سپس Next را انتخاب کنید.
حال نیاز است تا در پنجره Configure your new project خود، نام پروژه خود را SignalRChat قرار داده و بر روی Next کلیک کنید. در قسمت نهایی آموزش SignalR در ASP.NET Core  در پنجره Additional information بر وی .NET 6.0 کلیک کرده و گزینه Select را انتخاب کنید.

کتابخانه کلاینت SignalR را اضافه کنید

کتابخانه SignalR به‌صورت از پیش تنظیم شده در فریم‌ورک ASP.NET Core انتخاب شده است. اما کتابخانه سمت مشتری یا کلاینت جاوا اسکریپت به‌صورت از پیش تنظیم شده وجود ندارد. در این آموزش signalR در ASP.NET Core ما از کتابخانه Manager (LibMan) برای دریافت کتابخانه کلاینت از unpkg استفاده خواهیم کرد. Unpkg یک شبکه تحویل محتوای (CDN) سریع و جهانی در npm است.

در ادامه آموزش signalR در ASP.NET Core نیاز است تا در Solution Explorer بر روی پروژه راست کلیک کرده و Add > Client-Side Library را انتخاب کنید. حال در گزینه Add Client-Side Library، unpkg را برای Provider انتخاب کنید. در قسمت Library نیز باید این متن را وارد کنید:

@microsoft/signalr@latest

در ادامه نیاز است تا Choose specific files را انتخاب کرده و در پوشه dist/browser این دو گزینه را انتخاب کنید: signalr.js و signalr.min.js

در نهایت Target Location را بر روی wwwroot/js/signalr/ تنظیم کرده و Install را انتخاب کنید.

SignalR hub را ایجاد کنید

در ادامه آموزش signalR در ASP.NET Core نیاز است تا SignalR hub را انتخاب کنید. هاب کلاسی است که به‌عنوان pipeline سطح بالا می‌تواند ارتباط برقرار شده بین کلاینت و سرور را مدیریت کند؛ ازاین‌رو نیاز است تا در پوشه پروژه SignalRChat، یک پوشه با نام Hubs ایجاد کنید. در این پوشه کلاس ChatHub را به کمک کد زیر پیاده‌سازی کنید:

using Microsoft.AspNetCore.SignalR;
namespace SignalRChat.Hubs
public class ChatHub : Hub
public async Task SendMessage(string user, string message)
await Clients.All.SendAsync("ReceiveMessage", user, message);

آموزش پیکربندی SignalR

در این قسمت از آموزش signalR در ASP.NET Core نیاز است تا پیکربندی SignalR را انجام دهید. باید بدانید که سرور SignalR برای ارسال درخواست‌های SignalR به خود SignalR، پیکربندی شود. برای این کار می‌توانید از کد زیر استفاده کنید:

using SignalRChat.Hubs;
var builder = WebApplication.CreateBuilder(args);
builder.Services.AddRazorPages();
builder.Services.AddSignalR();
var app = builder.Build();
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Error");
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseRouting();
app.UseAuthorization();
app.MapRazorPages();
app.MapHub<ChatHub>("/chatHub");
app.Run();

کد کلاینت SignalR را اضافه کنید

قدم بعدی در آموزش SignalR در ASP.NET Core این است که کد مشتری SignalR را اضافه کنید. برای این کار می‌توانید قطعه کد زیر را جایگزین محتوای Pages/Index.cshtml کنید:

@page
<div class="container">
<div class="row">&nbsp;</div>
<div class="row">
<div class="col-2">User</div>
<div class="col-4"><input type="text" id="userInput" /></div>
</div>
<div class="row">
<div class="col-2">Message</div>
<div class="col-4"><input type="text" id="messageInput" /></div>
</div>
<div class="row">&nbsp;</div>
<div class="row">
<div class="col-6">
<input type="button" id="sendButton" value="Send Message" />
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<hr />
</div>
</div>
<div class="row">
<div class="col-6">
<ul id="messagesList"></ul>
</div>
</div>
<script src="~/js/signalr/dist/browser/signalr.js"></script>
<script src="~/js/chat.js"></script>

به کمک این کد می‌توانید

•  تکست‌باکس‌های متن و دکمه ارسال را بسازید.
• یک لیست به آیدی messagesList برای نشان‌دادن آن دسته از پیام‌هایی که از SignalR Hub ارسال می‌شود، تولید کنید.
•  شامل ارجاعات جاوا اسکریپت به SignalR است

برنامه را اجرا کنید

اکنون به پایان آموزش signalR در ASP.NET Core رسیدیم و می‌توانید برنامه را کنید. برای این کار کلیدهای CTRL+F5 را فشار دهید.

نتیجه‌گیری

SignalR از جمله کتابخانه‌های ASP.NET بوده که برای توسعه‌دهندگان وب مزایای بسیار زیادی دارد. از مهم‌ترین این مزایا می‌توان به ساده‌تر کردن توسعه وب در زمان واقعی و همچنین ایجاد یک رابطه دوسویه بین کلاینت و سرور اشاره کرد. ما در این مطلب به‌صورت کامل در خصوص آموزش signalr در aspnet core صحبت کردیم. همچنین مشاهده کردید که به کمک آموزش signalr در asp netcore چگونه می‌توان از این کتابخانه استفاده کرد.