SignalR简介

  ASP.NET SignalR是为ASP.NET 开发人员提供的一个库,旨在为你的Web应用迅速简便的添加实时通信功能。这个Web通信功能是指:客户端可以实时从服务端代码拉取数据,以达到实时通信的功能。

  你可能知道基于HTML5 API实现的全双工通信技术——WebSockets。SignalR技术将在当前设备支持的情况下优先使用WebSockets实现通信,当当前操作系统环境或浏览器版本较低导致WebSockets不可用时,SignalR将自动切换至其他方式以实现实时通信。

  SignalR提供了一个高等级的简单API,它用于创建服务端到客户端的远程调用(RPC),以便从服务器端的.NET代码中调用客户端浏览器中的JavaScript函数。SignalR还有用于管理连接和为连接分组的各种API。

简单实现

一、建立工程

二、Nuget包引用Microsoft.AspNet.SignalR

三、配置 SignalR 集线器、创建Hub类、编写相关服务、设置路由

  1、在startup.cs中添加服务    services.AddSignalR();

        public void ConfigureServices(IServiceCollection services)
{
services.Configure<CookiePolicyOptions>(options =>
{
// This lambda determines whether user consent for non-essential cookies is needed for a given request.
options.CheckConsentNeeded = context => true;
options.MinimumSameSitePolicy = SameSiteMode.None;
}); services.AddSignalR();
services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_1);
}

  2、创建一个继承自Microsoft.AspNetCore.SignalR命名空间中Hub类的MyHub.cs,并编写SendMessage方法,这里假设传输  userName,time和message三个字段。

using Microsoft.AspNetCore.SignalR;
using System.Threading.Tasks; namespace SignalR
{
public class MyHub:Hub
{
public async Task SendMessage(string userName,string time,string message)
{
await Clients.All.SendAsync("SendMessage", userName, time, message);
}
}
}

3、回到startup.cs文件,添加路由。

 public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
else
{
app.UseExceptionHandler("/Home/Error");
app.UseHsts();
} app.UseHttpsRedirection();
app.UseStaticFiles();
app.UseCookiePolicy(); app.UseMvc(routes =>
{
routes.MapRoute(
name: "default",
template: "{controller=Chat}/{action=Chat}/{id?}");
}); app.UseSignalR(route=> {
route.MapHub<MyHub>("/myHub"
);
});

}

四、安装并使用 SignalR JavaScript 客户端

  在解决方案资源管理器工程下右键,选择添加客户端库

五、编写页面

  添加ChatController,并生成视图文件Chat.cshtml

html代码:

<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<div>
<ul id="messagesList" style="height:300px"></ul>
</div>
<div>
<input type="text" id="userName" placeholder="用户名" />
<input type="text" id="time" placeholder="时间" />
<input type="text" id="message" placeholder="消息" />
<button type="button" id="sendBtn">发送</button>
</div>
<script src="~/js/dist/browser/signalr.js"></script>
<script src="~/js/chat.js"></script>
</body>
</html>

js代码:

var connection = new signalR.HubConnectionBuilder()
.withUrl("/myHub")
.configureLogging(signalR.LogLevel.Information)
.build();
connection.start().catch(err => console.error(err.toString())); connection.on("SendMessage", (user, time, message) => {
var encodedMsg = user + " said " + message +" at "+time;
var li = document.createElement("li");
li.textContent = encodedMsg;
document.getElementById("messagesList").appendChild(li);
document.getElementById('message').value = null;
}); document.getElementById("sendBtn").addEventListener("click", function () {
var user = document.getElementById('userName').value;
var time = document.getElementById('time').value;
var message = document.getElementById('message').value;
connection.invoke("SendMessage", user, time, message).catch(err => console.error(err.toString()));
});

六、运行程序

SignalR在Asp.NetCore中的使用的更多相关文章

  1. AutoMapper在asp.netcore中的使用

    # AutoMapper在asp.netcore中的使用  automapper 是.net 项目中针对模型之间转换映射的一个很好用的工具,不仅提高了开发的效率还使代码更加简洁,当然也是开源的,htt ...

  2. Asp.NetCore 中Aop的应用

    前言 其实好多项目中,做一些数据拦截.数据缓存都有Aop的概念,只是实现方式不一样:之前大家可能都会利用过滤器来实现Aop的功能,如果是Asp.NetCore的话,也可能会使用中间件: 而这种实现方式 ...

  3. 壹佰文章最全总结| 《关于ASP.NETCore的分享之路》

    学习路线图 (关于学习ASP.NET Core需要了解和掌握的知识点图) 一言不合就来图,各位博客园小伙伴大家好,感觉好久没有写文章了,自从春节开始,中间经历种种,慢慢的就开始微信公众号发文了,原因有 ...

  4. asp.netcore 深入了解配置文件加载过程

    前言     配置文件中程序运行中,担当着不可或缺的角色:通常情况下,使用 visual studio 进行创建项目过程中,项目配置文件会自动生成在项目根目录下,如 appsettings.json, ...

  5. ASP.NETCore学习记录(一)

    ASP.NETCore学习记录(一) asp.net core介绍  Startup.cs  ConfigureServices  Configure  0. ASP.NETCore 介绍 ASP.N ...

  6. Asp.NetCore源码学习[2-1]:配置[Configuration]

    Asp.NetCore源码学习[2-1]:配置[Configuration] 在Asp. NetCore中,配置系统支持不同的配置源(文件.环境变量等),虽然有多种的配置源,但是最终提供给系统使用的只 ...

  7. Asp.NetCore Web开发之会话技术

    这节讲一下会话技术,首先了解一下什么是会话,会话是指浏览器打开到关闭的过程中,多次与服务器发送接收数据的过程. 由于HTTP是无状态协议,一次请求响应过后,产生的数据就随之释放了,可是在某些情况下,我 ...

  8. Asp.NetCore Web应用程序中的请求管道和中间件

    你是否会迷惑当我们请求一个ASP.NetWeb应用程序以后,它是怎么处理这些请求的,后台是怎么工作的,今天就讲一下Asp.NetCore Web应用程序中的请求处理过程. 上一节,我们讲到,Start ...

  9. 轻松搞定Vue 使用SignalR与Asp.net Core通讯

    前言 针对于Web与其他应用的的通讯,在.Net中,SignalR是一个不错的选择,在前后端没有分离的时候,直接引用对应的signalr.js文件即可: 这里主要记录Vue与Asp.netcore 前 ...

随机推荐

  1. Python3.7源码在windows(VS2015)下的编译和安装

    Python3.7源码在windows(VS2015)下的编译和安装 下载官方源码,使用vs2015(WIN10SDK),最python3.7.0的源码进行编译,编译出不同的版本(release,de ...

  2. 缓存,热点key

    热点Key问题的发现与解决 https://help.aliyun.com/document_detail/67252.html 缓存击穿.失效以及热点key问题 https://www.jiansh ...

  3. mac 开发环境安装

    0: 安装brew : mac终端输入: /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/ ...

  4. 20165223 《信息安全系统设计基础》 改进ls的实现

    课下作业:改进ls的实现 一.作业要求 参见附图,改进你的ls的实现.提交代码运行截图和码云链接.

  5. flink部署操作-flink standalone集群安装部署

    flink集群安装部署 standalone集群模式 必须依赖 必须的软件 JAVA_HOME配置 flink安装 配置flink 启动flink 添加Jobmanager/taskmanager 实 ...

  6. @WebFilter注解

    @WebFilter @WebFilter 用于将一个类声明为==过滤器==,该注解将会在部署时被容器处理,容器将根据具体的属性配置将相应的类部署为过滤器.该注解具有下表给出的一些常用属性 ( 以下所 ...

  7. Chart控件,鼠标选择区域,可以局部放大缩小

    例子: 代码设置部分: chartArea1.CursorX.Interval = 0D; chartArea1.CursorX.IntervalOffsetType = System.Windows ...

  8. CMakeList.txt(1):cmake error

    cmake_symlink_library: System Error: Operation not supported 1/创建链接不成功,要确认当前帐户下是否有权限在编译的目录中有创建链接的权限 ...

  9. 关于java环境变量配置出现javac命令无法运行的解决办法

    昨天一时兴起给电脑刷了机,想着给电脑装个Win10+Linux的双系统, 结果双系统没装好,所有的东西又得重新弄一遍 今天在配置java的时候又出问题了 java,java-version运行成功了, ...

  10. 编写高质量的Python代码系列(四)之元类及属性

    元类(metaclass)及动态属性(dynamic attribute)都是很强大的Python特性,然后他们也可能导致及其古怪.及其突然的行为.本节讲解这些机制的常见用法,以确保各位程序员写出来的 ...