后端
新建Webapi项目
创建 ChatHub 类,继承于 Hub
public classChatHub : Hub
{public async Task SendMessage(string user,stringmessage)
{await Clients.All.SendAsync("ReceiveMessage", user, message);
}
}
启用ChatHub,将ChartHub映射到路径 /chathub 下(需要前后端约定)
app.UseEndpoints(endpoints =>{
endpoints.MapControllers();
endpoints.MapHub("/chathub");
});
后端启用CORS
8080是前端的端口,前后端分离需要设置跨域,否则无法正常访问
//ConfigureServices
services.AddSignalR();//Configure
app.UseCors(builder =>{
builder.WithOrigins("http://localhost:8080")
.AllowAnyMethod()
.AllowCredentials()
.AllowAnyHeader();
});
通过刚才的代码,我们将 ChatHub 下的方法映射到路径 /chathub 下
前端
前端引入 @microsoft/signalr,使用 npm install进行安装