tnblog
首页
视频
资源
登录
愿你出走半生,归来仍是少年
排名
3
文章
317
粉丝
22
评论
14
bootstrap 栅格布局一小例子
剑轩 : 后端写样式有点痛苦哇
一点flex布局的运用
剑轩 : 后端写样式有点痛苦哇
vue.js常用指令
剑轩 : 可以可以,多总结一点
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2025TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
公网安备:50010702506256
欢迎加群交流技术

signalr入门双向通讯,简单网页聊天

5848人阅读 2020/1/14 11:11 总访问:2060975 评论:0 收藏:0 手机
分类: NET


下载依赖:install-package Microsoft.AspNet.SignalR -version 2.0.3


服务器启动类:

  1. using Microsoft.Owin;
  2. using Owin;
  3. [assembly: OwinStartupAttribute(typeof(Microsoft.AspNet.SignalR.StockTicker.Startup), "Configuration")]
  4. namespace Microsoft.AspNet.SignalR.StockTicker
  5. {
  6.     public static class Startup
  7.     {
  8.         public static void ConfigureSignalR(IAppBuilder app)
  9.         {
  10.             app.MapSignalR();
  11.         }
  12.         public static void Configuration(IAppBuilder app)
  13.         {
  14.             Microsoft.AspNet.SignalR.StockTicker.Startup.ConfigureSignalR(app);
  15.         }
  16.     }
  17. }

创建一个hub用于通讯

  1.     public class MessageHub:Hub
  2.     {
  3.         public void Message(string msg)
  4.         {
  5.             Clients.All.receive(msg);
  6.         }
  7.     }


前端

引用js的注意要引入signalr/hubs是动态加载的

  1. <script src="~/Scripts/jquery-1.9.1.min.js"></script>
  2. <script src="~/Scripts/jquery.signalR-2.0.3.js"></script>
  3. <script src="~/signalr/hubs"></script>
  4. <script>
  5.     //关联集线器(关联谁就能和谁进行通信)
  6.     var chat = $.connection.messageHub;
  7.     //开启客户端服务
  8.     $.connection.hub.start();
  9.     //提供一个前台的方法
  10.     chat.client.receive = function (msg)
  11.     {
  12.         $("#content").append("<li>"+msg+"</li>");
  13.     }
  14.     $(function ({
  15.         $("#sendbut").click(function ({
  16.             //客户端主动调用服务器
  17.             chat.server.message($("#user").html()+":"+ $("#msg").val());
  18.             $("#msg").val("");
  19.         });
  20.     })
  21. </script>
  22. <ul id="content">
  23. </ul>
  24. <label id="user"></label>
  25. <input type="text" id="msg" />
  26. <input type="button" value="发送" id="sendbut" />

注意jquery的版本,这里signalr用的是2.0.3的jquery版本高了会有问题


其他:

集线器的名字可以在这里看到






欢迎加群讨论技术,1群:677373950(满了,可以加,但通过不了),2群:656732739。有需要软件开发,或者学习软件技术的朋友可以和我联系~(Q:815170684)

评价

signalr推送

SignalR推送一、 具体使用1. 建立一个MVC项目2. 安装SignalR步骤:在工具里面找到库程序包管理器,如图所示:然后在控制台输...

signalr 网络通讯

电脑坏境不支持websocket(html5),选用webscoket,这个技术是真正可以做到及时通讯。如果不支持他会他会选择长连接或者轮...

signalr断线重连机制

前言Signalr 即时消息发布到服务器后发现链接老是自动断开,导致无法发送广播后面百度搜了一下,signalr有个超时的机制解决...

.net6 signalr+Vue3 的运用(上)

.net6 Signalr+Vue3 的运用(上)[TOC] 什么是 SignalR?ASP.NET Core SignalR 是一个开放源代码库,可用于简化向应用添加...

.net6 signalr+Vue3 的运用(下)

.net6 Signalr+Vue3 的运用(下)[TOC] 上篇链接:https://www.tnblog.net/hb/article/details/7961SignalR 中的用户 Sig...

.net6 signalr+Vue3 配合Ingress Nginx的运用

.net6 Signalr+Vue3 配合Ingress Nginx的运用[TOC] 结合上篇:https://www.tnblog.net/hb/article/details/7963 项目打...