شروع کار با SignalR در ASP.NET
Loading...
شروع کار با SignalR

شروع کار با SignalR در ASP.NET ، در این مقاله یاد می گیریم که چگونه کار با signalR را شروع کرده و چگونه پیام ها را بین چندین کاربر مبادله نماییم.

SignalR چیست: یک کتابخانه سرور ASP.NET برای اضافه کردن عملکرد بلادرنگ به یک اپلیکیشن وب می باشد. این شامل کتابخانه های سمت کلاینت برای جاوا اسکریپت و دیگر کلاینت ها نیز می باشد.

شروع کار

  • ویژوال استودیو را باز می کنیم.
  • یک website جدید ایجاد می کنیم.
  • نام و محل ذخیره مناسبی برای آن انتخاب می نماییم.
  • روی Next کلیک می کنیم.

حالا یک کلاس SignalR Hub اضافه کرده و نامی به آن اختصاص داده و روی Add کلیک می کنیم.

نکته: احتمالا زمانی که این کلاس را اضافه می کنید، پیغام زیر را دریافت خواهید کرد:

“This template attempted to load component assembly ‘NuGet.VisualStudio.Interop, Version=*, Culture=neutral, PublicKeyToken=*”

این قالب سعی در بارگذاری کامپوننت اسمبلی “NuGet.VisualStudio.Interop Version=*, Culture=neutral, PuublicKeyToken=*” دارد.

یا می توانید SignalR را با باز کردن Tools | Library Package Manager | Package Manager Console و اجرای دستور: “install-packageMicrosoft.AspNet.SignalR” به پروژه اضافه نمایید. حالا دوباره کلاس SignalR را اضافه می کنیم.

شروع کار با SignalR

شروع کار با SignalR

همانطور که مشاهده می کنید، اسمبلی های SignalR بسیاری به فولدر Bin اضافه شدند، بنابراین تا اینجا کار را خوب انجام دادیم.

شروع کار با SignalR

حالا وقت آن است که روی HubClass کار کنیم.

ابتدا فضای نام زیر را اضافه می کنیم.

using Microsoft.AspNet.SignalR;

و حالا متد زیر را به آن اضافه می نماییم:

public class ChatHub : Hub
{
    public void Send(string name, string message)
    {        
        Clients.All.broadcastMessage(name,message);
    }        
}

حالا فضای نام های زیر را در فایل global.asax اضافه می کنیم:

<%@ Import Namespace="System.Web.Routing" %>
<%@ Import Namespace="Microsoft.AspNet.SignalR" %>

و کد زیر را در رویداد “application_start” اضافه می نماییم:

RouteTable.Routes.MapHubs();

حالا یک صفحه HTML اضافه کرده و نامی برای آن انتخاب کرده و OK را کلیک می کنیم.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>SignalRارسال همگانی پیام با </title> 
</head>
<body>
      <div style="background-color: #C0C0C0">
        <input type="text" id="messagetext" />
        <input type="button" id="btnsendmessage" value="ارسال همگانی پیام" />
        <input type="hidden" id="displayname" />
        <ul id="loadmessages">
        </ul>
    </div>
    <!--Script references. -->
    <!--Reference the jQuery library. -->
    <script src="/Scripts/jquery-1.8.2.min.js" ></script>
    <!--Reference the SignalR library. -->
    <script src="/Scripts/jquery.signalR-1.0.0.js"></script>
    <!--Reference the autogenerated SignalR hub script. -->
    <script src="/signalr/hubs"></script>
    <!--Add script to update the page and send messages.--> 
    <script type="text/javascript">
        $(function () {
            // Declare a proxy to reference the hub. 
            var chat = $.connection.chatHub;
            // Create a function that the hub can call to broadcast messages.
            chat.client.broadcastMessage = function (name, message) {
                // Html encode display name and message. 
                var encodedName = $('<div />').text(name).html();
                var encodedMsg = $('<div />').text(message).html();
                // Add the message to the page. 
                $('#loadmessages').append('<li><strong>' + encodedName
                    + '</strong>:&nbsp;&nbsp;' + encodedMsg + '</li>');
            };
            // Get the user name and store it to prepend to messages.
            $('#displayname').val(prompt('نام خود را وارد نمایید:', ''));
            // Set initial focus to message input box.  
            $('#messagetext').focus();
            // Start the connection.
            $.connection.hub.start().done(function () {
                $('#btnsendmessage').click(function () {
                    // Call the Send method on the hub. 
                    chat.server.send($('#displayname').val(), $('#messagetext').val());
                    // Clear text box and reset focus for next comment. 
                    $('#messagetext').val('').focus();
                });
            });
        });
    </script>
</body>
</html>

 

حالا زمان آن رسیده که برنامه را اجرا کنیم.

شروع کار با SignalR

همانطور که مشاهده می کنید، دو پنجره باز می شود، یکی برای محتوای HTML و دومی برای پرسیدن یک نام. آدرس مرورگر را کپی کرده و آن را در پنجره دیگری از مرورگر وارد کرده سپس نامی برای آن انتخاب کرده و روی OK کلیک می کنیم.

حالا آدرس را در پنجره دیگری کپی می کنیم.

شروع کار با SignalR

حالا برای این TextBox نامی فراهم کرده و روی OK کلیک می کنیم.

بنابراین سردرگم نشوید، نام متفاوتی برای پنجره ها انتخاب می نماییم، به این صورت:

شروع کار با SignalR

حالا پیامی از پنجره اول تایپ نموده و از پنجره دیگر پاسخ می گیریم.

شروع کار با SignalR

همانطور که مشاهده می کنید، هر دو پنجره در حال بارگذاری پیام ها بدون تاخیر در نامی که برای آن ها فراهم کردیم، هستند.



 دانلود فايلهاي پروژه
  • پسورد: www.mspsoft.com


avatar فاطمه زکایی

فاطمه زکایی هستم. فارغ التحصیل کارشناسی مهندسی نرم افزار، مدت سه سال هست که در زمینه توسعه اپلیکیشن های تحت وب و اندروید و همچنین تولید محتوای تخصصی برنامه نویسی تحت وب و اندروید در مجموعه mspsoft در خدمت شما هستم.

آخرین مطالب و تخفیفات در کانال تلگرام :) کانال تلگرام ام اس پی سافت
مطالب مرتبط
ديدگاه خود را ارسال کنيد


محبوب ترين ويدئو هاي انلاين
دوره برنامه نویسی فروشگاه اینترنتی
  • تعداد اعضا 80k
  • قيمت دوره۱۰۰,۰۰۰ تومان
  • امتيازدهي
    1 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 5( 5٫00 از 1 رای )
    Loading...
دوره آموزشی سیستم ثبت سفارش آنلاین
  • تعداد اعضا 80k
  • قيمت دوره۵۰,۰۰۰ تومان
  • امتيازدهي
    1 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 5( 5٫00 از 1 رای )
    Loading...
دوره طراحی سیستم مدیریت مشتریان
  • تعداد اعضا 80k
  • قيمت دوره۵۰,۰۰۰ تومان
  • امتيازدهي
    1 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 51 vote, average: 5٫00 out of 5( 5٫00 از 1 رای )
    Loading...