消息推送SignalR简单实例

消息推送SignalR:一个ASP .NET 下的类库,可以在ASP .NET 的Web项目中实现实时通信。

功能:当所连接的客户端变得可用时服务器代码可以立即向其推送内容,而不是让服务器等待客户端请求新的数据。

可参考:http://www.cnblogs.com/ssk-bak/p/5799976.html

前台关键之处:

1首先获取客户端页面的名字;

2然后通过 $.connection.chat 建立对应服务器端 Hub 类的代理对象 chat;

3服务器通过 dynamic 方式调用客户端的该方法以实现推送功能。在这里每当收到服务器推送来的消息,就在客户端页面的 discussion 列表追加该消息。

4当点击发送所有用户按钮时,客户端通过代理对象调用服务器端的 send 方法以实现向服务器发送消息。当点击发送给指定用户按钮,并填写在线的用户时,客户端通过代理对象调用服务器端的 send 方法以实现向服务器发送消息给指定用户,可同时开启两个窗口测试。

5通过 $.connection.hub.start(); 语句打开链接。

实现代码:

后台:

1.先登录,登录后用户名会记录在一个Dictionary容器中:

        /// <summary>
        /// 用户的connectionID与用户名对照表
        /// </summary>
        private readonly static Dictionary<string, string> UserDictionary = new Dictionary<string, string>();
        /// <summary>
        /// 用户上线函数
        /// </summary>
        /// <param name="name"></param>
        public void sendLogin(string name)
        {
            if (!UserDictionary.Keys.Contains(name))
            {
                //这里便是将用户名和连接ID存入
                UserDictionary.Add(name, Context.ConnectionId);
            }
            else
            {
                //每次登陆id会发生变化
                UserDictionary[name] = Context.ConnectionId;
            }
        }

2.将信息发送给所有用户或指定用户:

        //发送信息到指定用户
        public void Send(string fromName, string toName, string message)
        {
            if (UserDictionary[toName] != null)
            {
                Clients.Client(UserDictionary[toName]).broadcastMessage(fromName, message);
            }
        }
        //广播所有信息
        public void Send(string name, string message)
        {
            Clients.All.broadcastMessage(name, message);
        }

前台:

<body>
    <div class="container">
        当前用户:<input type="text" id="displayname" hidden="hidden" /><label id="uName"></label>
        <br /><br />
        发送消息:<input type="text" id="message" />
        <input type="button" id="sendmessage" value="发送给所有用户" />&nbsp;&nbsp;
        <input type="text" id="toUser" name="toUser" />
        <input type="button" id="sendTouser" value="发送给指定用户" />
        <br />
        <div>
            接收信息:
        </div>
        <ul id="discussion"></ul>
    </div>
    <!--Script引用-->
    <script src="Scripts/jquery-1.6.4.min.js"></script>
    <script src="Scripts/jquery.signalR-2.2.1.min.js"></script>
    <script src="signalr/hubs"></script>
    <!--更新页面并发送消息-->
    <script type="text/javascript">
        $(function () {
            //启用日志记录
            $.connection.hub.logging = true;
            // Declare a proxy to reference the hub.
            var chat = $.connection.chatHub;
            // 创建回调函数
            chat.client.broadcastMessage = function (name, message) {
                // 显示namemessage.
                var encodedName = $('<div />').text(name).html();
                var encodedMsg = $('<div />').text(message).html();
                //在页面中显示
                $('#discussion').append('<li><strong>' + encodedName + '</strong>:&nbsp;&nbsp;' + encodedMsg + '</li>');
            };

            // 页面开始时输入用户名,保存来显示该用户相关信息(实际用户登入系统是自动设置)
            $('#displayname').val(prompt('输入用户名:', ''));
            document.getElementById("uName").innerHTML = $('#displayname').val();
            // 将初始焦点设置为消息输入框。
            $('#message').focus();

            //开启客户端(web)与服务器端连接
            $.connection.hub.start().done(function () {
                var username = $('#displayname').val();
                chat.server.sendLogin(username);
                $('#sendmessage').click(function () {
                    // 调用发送方法,发送给所有用户
                    chat.server.send($('#displayname').val(), $('#message').val());
                    $('#message').val('').focus();
                });
                $('#sendTouser').click(function () {
                    // 调用发送方法,发送给指定用户
                    var touser = $('#toUser').val();
                    chat.server.send(username, touser, $('#message').val());
                });
            });
        });
    </script>
</body>

效果图:

image

image

转载于:https://www.cnblogs.com/CIreland/p/6748359.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
WPF SignalR是一种实时Web应用程序框架,可用于在浏览器和服务器之间实现双向通信。在WPF中,您可以使用SignalR来实现实时通信,并将状态更改推送到客户端。以下是一个简单的WPF SignalR实例,展示如何在WPF应用程序中使用SignalR。 1. 创建WPF应用程序 首先,您需要创建一个WPF应用程序。使用Visual Studio,选择“文件”>“新建”>“项目”,然后选择“WPF应用程序”。在创建项目向导中,选择“桌面应用程序(.NET Framework)”作为项目类型。 2. 安装SignalR 使用NuGet包管理器,安装SignalR客户端库和SignalR服务器库。 3. 添加SignalR客户端代码 在WPF应用程序中,打开MainWindow.xaml.cs文件,并添加以下代码: ```csharp using Microsoft.AspNet.SignalR.Client; public partial class MainWindow : Window { private HubConnection connection; private IHubProxy hubProxy; public MainWindow() { InitializeComponent(); connection = new HubConnection("http://localhost:8080/"); hubProxy = connection.CreateHubProxy("myHub"); // 接收消息 hubProxy.On<string>("broadcastMessage", message => { Dispatcher.Invoke(() => { // 将消息添加到ListBox中 listBox.Items.Add(message); }); }); // 连接SignalR服务器 connection.Start().Wait(); } private void Button_Click(object sender, RoutedEventArgs e) { // 发送消息 hubProxy.Invoke("Send", "WPF Client", textBox.Text); } } ``` 在上面的代码中,我们首先创建了一个SignalR连接,并使用连接创建了一个代理。然后,我们使用代理的On方法订阅了“broadcastMessage”事件,并在事件中接收到消息时将其添加到ListBox中。最后,我们使用代理的Invoke方法发送消息。 4. 添加SignalR服务器代码 在WPF应用程序中,打开“解决方案资源管理器”,右键单击项目,选择“添加”>“新建项”,并创建一个新的SignalR Hub类。在这个类中,添加以下代码: ```csharp using Microsoft.AspNet.SignalR; public class MyHub : Hub { public void Send(string name, string message) { Clients.All.broadcastMessage(name, message); } } ``` 在上面的代码中,我们创建了一个名为“myHub”的Hub,并在Hub中添加了一个名为“Send”的方法。当客户端调用此方法时,它将使用Clients.All.broadcastMessage方法将消息广播到所有连接的客户端。 5. 运行应用程序 现在,您已经准备好运行应用程序了。首先,启动SignalR服务器。然后,启动WPF应用程序。在WPF应用程序中,输入消息文本并单击“发送”按钮。您应该能够在SignalR服务器和WPF应用程序之间看到实时通信。 以上就是一个简单的WPF SignalR实例。您可以使用这个实例作为起点来构建更复杂的实时Web应用程序。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值