SignalR从。。。到。。。


Signal搭建一个聊天室。

Signal框架学习

1.引入NuGut包
ASPNET.net.Signal.Hubs

新建一个owin startup类
代码:

 public void Configuration(IAppBuilder app)
        {
            // 有关如何配置应用程序的详细信息,请访问 http://go.microsoft.com/fwlink/?LinkID=316888
           // ConfigureAuth(app);
            var hubConfiguration = new HubConfiguration();

            hubConfiguration.EnableDetailedErrors = true;
            GlobalHost.Configuration.DisconnectTimeout = TimeSpan.FromSeconds(8);
            app.MapSignalR(hubConfiguration);
        }

2.新建一个集线器signalR类

思路:
服务端写法 :


   public void Send(@1) (string Message)
   {
       //发送给所有客户端
       Client.All.broadcastMessage(@2)(message);
   }

客户端调用方法:

 new 一个 IHubProxy  hub;

 ///创建一个连接
 var connection = new HubConnection("Hub服务地址(调试的时候一般为 localhost:端口)”);

 ///调用服务端方法的接口
 hub = connection.Create("Hub类名");  


 客户端调用方式:
 ///这部分相当于注册事件
 hub.On("@2",(返回数据)=>{ 返回数据的处理 });

 hub.Invoke("@1",参数);//这步相当于触发事件。

服务端代码

  public class ChatHub : Hub
    {


        public static List<string> Onlineusers = new List<string>();

        public static List<string> messageCache = new List<string>();
        /// <summary>
        /// 广播消息
        /// </summary>
        /// <param name="username"></param>
        /// <param name="message"></param>     
        
        public void Send(string SendID,string message)
        {
            Clients.All.broadcastMessage(Context.ConnectionId, message);
            messageCache.Add(Context.ConnectionId + message);
            //Clients.All.refresh()
           // Clients.All.addMessage(username + message);
            
        }


        public void p2p(string ReciveID,string SendID,string SendMessage)
        {

            
            Clients.Client(ReciveID).sendP2pMessage(ReciveID, SendMessage);
            messageCache.Add(SendID + "发送了" + SendMessage + "给" + ReciveID);
            
        }


        /// <summary>
        /// 获取信息列表。详细看客户端。
        /// </summary>
        /// <param name="clinetID"></param>
        public void GetMesList(string clinetID)
        {
            StringBuilder sb = new StringBuilder();
            foreach (var item in messageCache)
            {
                sb.AppendLine(item);

            }
            Clients.Client(clinetID).SendList(sb.ToString());

        }
        /// <summary>
        /// 获取用户列表
        /// </summary>
        /// <returns></returns>

        public void GetOnline(string ClientID)
        {
            StringBuilder sb = new StringBuilder();
            foreach (var item in Onlineusers)
            {
                sb.Append("*"+item);
            }
            Clients.Client(ClientID).SendUserList(sb.ToString());
        }
        public override Task OnConnected()
        {
            Onlineusers.Add(Context.ConnectionId);
            Clients.All.broadcastMessage(Context.ConnectionId, "加入了服务器");

            StringBuilder sb = new StringBuilder();
            foreach (var item in Onlineusers)
            {
                sb.Append("*" + item);
            }
            Clients.All.SendUserList(sb.ToString());
            Clients.All.broadcastMessage("当前在线人数", Onlineusers.Count + "人");
            return base.OnConnected();
        }

        public override Task OnDisconnected(bool stopCalled)
        {
            Onlineusers.Remove(Context.ConnectionId);
            Clients.All.broadcastMessage(Context.ConnectionId, "离开了服务器");
            StringBuilder sb = new StringBuilder();
            foreach (var item in Onlineusers)
            {
                sb.Append("*" + item);
            }
            Clients.All.SendUserList(sb.ToString());
            Clients.All.broadcastMessage("当前在线人数", Onlineusers.Count + "人");
            return base.OnConnected();
        }



    }

客户端代码:

 public partial class Form1 : Form
    {


        /// <summary>
        /// hub句柄
        /// </summary>
        IHubProxy hub;
        string name = "";

        public Form1()
        {
            InitializeComponent();
            

        }
    

        private void button1_Click(object sender, EventArgs e)
        {
            var connection = new HubConnection(textBox1.Text);
            hub = connection.CreateHubProxy(textBox2.Text);

            connection.Error += error => MessageBox.Show(error.ToString());
            try
            {
                connection.Start().Wait();
                name = connection.ConnectionId;
                hub.On<string, string>("broadcastMessage", (m, s) =>
                {
                  
                        textBoxRecive.Invoke(new MethodInvoker(() => { this.textBoxRecive.AppendText(m +"说:"+s + "\r\n"); }));
                });

                hub.On<string, string>("sendP2pMessage", (c, m) =>
                {
                    textBoxRecive.Invoke(new MethodInvoker(() => { this.textBoxRecive.AppendText(c+"说:"+m + "\r\n"); }));
                });



                hub.On<string>("SendUserList", (listvalue) =>
                {
                    textBoxRecive.Invoke(new MethodInvoker(() =>
                    {
                      
                        string[] str = listvalue.Trim().Split('*');
                        List<string> values = new List<string>();
                        textBoxDic.AppendText("当前在线用户 :" + "\r\n");
                        foreach (var item in str)
                        {
                            if(item!="")
                            {
                                values.Add(item);
                                textBoxDic.AppendText(item + "\r\n");
                            }

                        }
                        
                        comboBox1.DataSource = values;
                        comboBox1.SelectedIndex = 0;
                        
                    }));

                });

                ///这里是触发该次回调的调用过程。
                hub.Invoke("GetOnline", name);

                // hub.Invoke("Send", "", name);

                MessageBox.Show("连接成功!");
                label4.Text = name;
            }
            catch(Exception ex)
            {
                MessageBox.Show(ex.ToString());
            }

        }



        /// <summary>
        /// 表示调用信息列表。
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void button4_Click(object sender, EventArgs e)
        {
            

            ///这里可以理解为注册回调。 listValue为回调的接收data.
            hub.On<string>("SendList", (listvalue) =>
             {
                 textBoxRecive.Invoke(new MethodInvoker(() =>
                 {
                     textBoxDic.AppendText("缓存数据" + "\r\n" + listvalue+"\r\n");
                 }));

             });

            ///这里是触发该次回调的调用过程。
           hub.Invoke("getMesList",name);


        }

        private void button2_Click(object sender, EventArgs e)
        {
            if (radioButton2.Checked)
            {
                ///发送点对点消息 第一个参数 接收者ID 第二个参数 发送ID 第三个参数 发送内容。
                hub.Invoke("p2p", comboBox1.Text, name, textBoxSend.Text);

            }
            else
            {
                hub.Invoke("Send", name, this.textBoxSend.Text);
            }
           
        }

        private void button3_Click(object sender, EventArgs e)
        {
            hub.Invoke("Send", "测试数据");
        }


       
    }

Web页面客户端简单实现:

<!DOCTYPE html>
<html>
<head>
    <title>SignalR Simple Chat</title>
    <style type="text/css">
        .container {
            background-color: #99CCFF;
            border: thick solid #808080;
            padding: 20px;
            margin: 20px;
        }
    </style>
</head>
<body>
    <div class="container">
        <input type="text" id="message" />
        <input type="button" id="sendmessage" value="Send" />
        <input type="hidden" id="displayname" />
        <div id="mineID"></div>
        <ul id="discussion"></ul>
    </div>
    <script src="Scripts/jquery-1.6.4.js"></script>
    <script src="Scripts/jquery.signalR-2.2.1.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.

            //var name = chat.client.connection.oncl
            //$('#mineID').append("<p>" + name + "</p>");

            var name;
            chat.client.broadcastMessage = function (username, message) {
                // Html encode display name and message.
                var encodedName = $('<div />').text(username).html();
                var encodedMsg = $('<div />').text(message).html();
                // Add the message to the page.
                $('#discussion').append('<li><strong>' + encodedName
                    + '</strong>:  ' + encodedMsg + '</li>');
            };

          

             
           
            // Get the user name and store it to prepend to messages.
            //$('#displayname').val(prompt('Enter your name:', ''));
            // Set initial focus to message input box.
            //$('#message').focus();
            // Start the connection.
            $.connection.hub.start().done(function () {
                $('#sendmessage').click(function () {
                    // Call the Send method on the hub.
                    chat.server.send($('#displayname').val(), $('#message').val());
                    // Clear text box and reset focus for next comment.
                    $('#message').val('').focus();
                });
            });
        });
    </script>
</body>
</html>

————————————————————————————————我是有底线的———————————————————————————————————————

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 205,132评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,802评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,566评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,858评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,867评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,695评论 1 282
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,064评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,705评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 42,915评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,677评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,796评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,432评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,041评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,992评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,223评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,185评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,535评论 2 343

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,598评论 18 139
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,475评论 25 707
  • 1. Java基础部分 基础部分的顺序:基本语法,类相关的语法,内部类的语法,继承相关的语法,异常的语法,线程的语...
    子非鱼_t_阅读 31,577评论 18 399
  • 嗨,米娜!话说今儿个一早,宝宝的朋友圈就被出行高峰给霸屏了,然而,对于想要脱单甚至已经脱单的我们来说,这点阻碍算什...
    咖呗橙阅读 363评论 2 3
  • 很多事情只有在具体的实践当中才能真正明白其中的含义,很多人只有经历过很多伤痛之后才能真正明白其中的道理,没有谁可以...
    千夜凡尘阅读 565评论 0 0