asp.net core signalR

一、asp.net core使用signalR入门

1,nuget Microsoft.AspNetCore.SignalR 

2,新建ChatHub文件

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

3,生成signalr.js文件

使用npm下载signalr D:\signalr> npm install @aspnet/signalr 

将 D:\signalr\node_modules\@aspnet\signalr\dist\browser\signalr.js 拷贝到项目中 SignalRDemo\wwwroot\lib\signalr\signalr.js 

4,在视图页面使用

@{
    ViewData["Title"] = "Home Page";
}


<input type="text" name="" id="message" class="form-control" value="" required="required" pattern="" title="">

<button type="button" class="btn btn-default" id="send" >发送</button>


<div id="content"></div>

@section Scripts{

    <script src="~/lib/signalr/signalr.js"></script>
    <script>
        const connection=new signalR.HubConnectionBuilder()
                            .withUrl("/chatHub")
                            .build();

        connection.on("ReceiveMessage",(use,message)=>{
            $("#content").append(message+"<br/>");
        });

        connection.start().catch(err=>{alert(err)});

        $("#send").click(function(){
            var msg= $("#message").val();
            connection.invoke("SendMessage","",msg).catch(err=>{alert(err)})
        });

</script>
}
Index.cshtml

 案例下载:https://pan.baidu.com/s/1FEgPEbPZOribtYnLv-XCNQ

二、前后端分离模式

猜你喜欢

转载自www.cnblogs.com/zd1994/p/9134965.html