SignalR چیست و چرا باید از آن استفاده کرد؟

چهارشنبه 19 خرداد 1395

در این مقاله با مفهوم ، کاربرد و نحوه ی استفاده از SignalR آشنا خواهید شد .SignalR یک کتابخانه ای است که می تواند در هر برنامه ASP.NET استفاده شود ، که برای امکان پذیر کردن ارتباطات بلادرنگ (Real-Time) ، می باشد.

SignalR  چیست و چرا باید از آن استفاده کرد؟

یکی از مواردی که می خواهیم انجام دهیم بروز رسانی برنامه بعد ازانجام هر تغییر است ، اگر یک کاربر تغییری ایجاد کند ، باید برای بقیه کاربرها قابل رویت باشد.یک راه کلاسیک برای انجام چنین کارهایی این است که، باید سرور در فاصله زمانی منظمی ، برای گرفتن وضعیت برنامه ، فراخوانی شود ، اما برای داشتن به روزرسانی real-time  ساختگی ، شما باید سرور را مرتبا فراخوانی کنید.

با SignalR  ، سرور می تواند متدهای JavaScript را به صورت مستقل سمت همه ی Client ها زمانی که به روزرسانی ها مورد نیاز باشند ، فراخوانی کند.کتابخانه ، ارتباط مورد نیازبرای این دسترسی  را مدیریت می کند: به صورت پیش فرض از WebSocket استفاده شده است ،در صورت عدم دسترسی به WebSocket در مرورگر ،به صورت خودکار از انواع  Connectionهای قدیمی تر استفاده می کند. همچنین JavaScript میتواند سرور را فراخوانی کند ، که این کار درحال حاضر میتواند با AJAX انجام شود، اما اگر دو راه ارتباطی مورد نیاز باشد، شاید راحت تر و تمیزتر است که این کار را با SignalR انجام دهیم.

بنابراین ،  اگر می خواهید برنامه ای بسازید  که نیاز  به تعامل  بین کاربران دارد را بسازید ، باید از از کتابخانه Real-Time استفاده کنید. از جمله برنامه هایی که از این کتابخانه استفاده می کنند ، شامل:  editorها ، شبکه های اجتماعی ، چت ها یا برنامه ای شبیه به پروژه ی ما  می باشد.

شروع کار با  SignalR  بسیار ساده است .در اینجا یک مثال در کنار پروژه وجود دارد. Session های مربوط به  یک رویداد توسط هر کاربری می توانند ویرایش شوند.، و زمانی که session تغییر کرد این تغییر برای تمامی کاربرانی که به برنامه وارد شده اند ،  قابل رویت است.

در سمت  سرور

ابتدا ، شما باید  Microsoft ASP.NET SignalR را به برنامه ASP.NET خودتان با استفاده از NuGet، همراه با پکیج JQuery(اگر آن را نداشته باشید) ، اضافه کنید.

بعد از این کار ، شما باید یک کلاس که مشتق شده از کلاس Hub است ، ایجاد کنید.تمامی متدهای مربوط به hub می توانند از JavaScript فراخوانی شوند . همچنین ،  این متد ها می توانند ، متدهای JavaScript را سمت client فراخوانی کنند.

namespace EventScheduling
{
public class SessionsHub : Hub
   {
   public void SessionModified(ScheduledSession scheduledSession)
      {
      // Call the JavaScript method sendSessionChanged on all the clients
      Clients.All.sendSessionChanged(scheduledSession);
      }
   }
}

برای فعال کردن ارتباطات بین hub  و JavaScript ، شما همچنین باید SignalR را در متدConfiguration  ، در کلاس Startup   برنامه تان ، فعال کنید.

namespace EventScheduling
{
public class Startup
   {
   public void Configuration(IAppBuilder app)
      {
      app.MapSignalR();
      }
   }
}

در سمتClient  :

در سمت client، شما باید فایل jquery.signalR-2.2.0.js که  حاوی JavaScript برای کتابخانه SignalR  و پکیج ~/signalr/hubs  است را اضافه کنید.این پکیج به صورت خودکار از کلاس های Hub  شما ایجاد می شود که شامل همه ی JavaScript های موردنیاز برای فراخوانی سرور و دریافت پیغام از سمت سرور است.

<script src="/Scripts/jquery-1.10.2.js"></script>

بعد از این کار ، زمانی که صفحه بارگذاری شد و آماده شد ، شما باید توایع JavaScript که توسط کد سمت سرور ، فراخوانی شدهاند را تعریف کنید .بدلیل آن که  کلاس SessionHub ،Hub را فراخوانی کرده است و متد SessionModified  که مربوط به کلاس hub است متد sendSessionChanged را فراخوانی می کند ، این تابع باید در متغیر     connection.sessionsHub.client.sendSessionChanged.$ تعریف شود.

هنگامی که این تابع ایجاد شد ، شما باید برای  وصل شدن بهhub  ها از متد $.connection.hub.start استفاده کنید.همچنین شما می توانید کد دهی اولیه در فراخوانی done() را اضافه کنید که این کد در زمان آغاز ارتباط فراخوانی خواهد شد.

$(document).ready(function () {
   // Create a function that the hub can call to broadcast messages.
   $.connection.sessionsHub.client.sendSessionChanged = function (session) {
      // Display the session again using the new data received from the server
      });
   };

   // Start the connection and create a function that the hub will call when loaded
   $.connection.hub.start().done($("#Sessions").on("click", ".Session", function (event) {
      var that = $(this);
      var currentSession = that.data("session");
      currentSession.Title = currentSession.Title + "Clicked";
      // Call the server, which will notify all clients of the change in the title
      $.connection.sessionsHub.server.sessionModified(currentSession);
   }));
});

در این مثال ، زمانی که hub  ها آغاز به کار کردند، یک click handler به هر session روی صفحه ، اضافه می شود.زمانی که کاربرها یک session را کلیک می کنند، کلمه Clicked به  title مربوط به session اضافه می شود ،  و تمام مرورگرها که در حال نمایش صفحه هستند ، آن را نشان می دهند. بدلیل آنکه متد SessionModified در کلاس SessionsHub  که مربوط به سرور است ، تعریف شده است ، این متد می تواند از JavaScript با استفاده از متد $.connection.sessionsHub.server.sessionModified فراخوانی شود.

تنها با این کد کوچک ، شما هم اکنون ارتباطات دوطرفه بین Client و سرور را دارید.که شما می توانید از آن برای بروزرسانی بلادرنگ(Real-Time)  داده ها برای کاربرانتان استفاده کنید.

 

 

ایمان مدائنی

نویسنده 1299 مقاله در برنامه نویسان

کاربرانی که از نویسنده این مقاله تشکر کرده اند

در صورتی که در رابطه با این مقاله سوالی دارید، در تاپیک های انجمن مطرح کنید