跳到主要內容

SignalR SendMessage

標籤：

using System;
using System.Threading.Tasks;
using Microsoft.Owin;
using Owin;

//路由組態


[assembly: OwinStartup(typeof(SignalRTest.Startup))]

namespace SignalRTest
{
    public class Startup
    {
        public void Configuration(IAppBuilder app)
        {
            // 如需如何設定應用程式的詳細資訊，請參閱  http://go.microsoft.com/fwlink/?LinkID=316888
            app.MapSignalR(); 

        }
    }
}


-----------------------------------------------------------------------------------------------------

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

using Microsoft.AspNet.SignalR;
using Microsoft.AspNet.SignalR.Hubs;

using Microsoft.Owin;
using Owin;

//工具/管理NuGet的方案套件/安裝SingalR
//1.建立Startup.cs  app.MapSignalR();
//2.建立Hub
//3.頁面呼叫


//伺服端HUB類別
namespace SignalRTest
{

    //[HubName("MyHub")]
    //public class MyHub : Hub
    //{
    //    public void Send(string name, string message)
    //    {
    //        Clients.All.sendMsg(name, message);
    //        //伺服端若要送資料到用戶端，可以使用Hubs類別的Clients屬性
    //        //透過Clients屬性的All屬性，取得所有已連線的用戶端
    //        //Clients屬性的型別(sendMsg)為dynamic
    //        //定義在用戶端的sendMsg方法讓用戶端可以更新頁面
    //        //用戶端的網頁便可以叫用伺服端的這個public Send方法，來傳送訊息給伺服端

    //    }


        public class ChatHub : Hub
        {
            public void Send(string name, string message)
            {
                // Call the broadcastMessage method to update clients.
                Clients.All.broadcastMessage(name, message);
            }
        }

}
-----------------------------------------------------------------------------------------------------

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SendMessage.aspx.cs" Inherits="SignalRTest.SendMessage" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <script src="Scripts/jquery-1.6.4.min.js"></script>    
    <script src="Scripts/jquery.signalR-2.2.3.min.js"></script>    
    <script src="/signalr/hubs"></script>

    <title></title>
</head>


<body>
    <form id="form1" runat="server">
    
    
        <div class="container">
            <input type="text" id="txtMessage" />
            <input type="button" id="btnSendmessage" value="Send" />
            <input type="hidden" id="hidDisplayname" />
            <ul id="discussion"></ul>
        </div>     
    
        <script type="text/javascript">
        $(function () {
            var chat = $.connection.chatHub;   //public class ChatHub : Hub

            //從server取回資料
            chat.client.broadcastMessage = function (name, message) {   //Clients.All.broadcastMessage
                var encodedName = $('<div />').text(name).html();
                var encodedMsg = $('<div />').text(message).html();
                $('#discussion').append('<li><strong>' + encodedName
                    + '</strong>:&nbsp;&nbsp;' + encodedMsg + '</li>');
            };

            $('#hidDisplayname').val(prompt('Enter your name:', ''));  //取得輸入性名

            $('#txtMessage').focus();

            //將資料送至server
            $.connection.hub.start().done(function () {
                $('#btnSendmessage').click(function () {     //按鈕click事件
                    chat.server.send($('#hidDisplayname').val(), $('#txtMessage').val());   //public void Send
                    $('#txtMessage').val('').focus();
                });
            });

            //$.connection.hub.disconnected(function () {
            //    $('#hidDisplayname').val() + " Leave";
            //    if (tryingToReconnect) {
            //        //notifyUserOfDisconnect();  // Your function to notify user.                   
            //    }
            //});

        });
    </script>



    </form>
</body>
</html>