SignalR 2.0 初次使用说明

时间:2023-11-22 11:11:44

如何使用SignalR 2.0

一:首先通过Nuget安装SignalR 2.0 【本人使用的时候最新版本为2.0】2.0与之前1.X有部分命名空间和配置不同请注意

SignalR 2.0 初次使用说明

二:建一个专门的类库用来负责SignalR 2.0的服务端

SignalR 2.0 初次使用说明

如果之前已经安装好了SignalR 2.0 可能新添加的类库里面没有SignalR 2.0相关代码 那么可以通过以下方式安装进去

SignalR 2.0 初次使用说明

安装语句  install-package Microsoft.AspNet.SignalR

注意在前台的SignalR 版本必须跟服务端的一致 不然会出现无法通信的情况

三:服务端代码示例

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;
using Microsoft.AspNet.SignalR;
using Microsoft.AspNet.SignalR.Hubs; namespace PB.Common.HubLibrery
{
[HubName("myHubPms")]
public class HubPMS : Hub
{ public void send(string msg)
{
Clients.All.addMessage(msg);
} }
}

在前台建立一个Startup类

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Owin;
using Microsoft.Owin;
[assembly: OwinStartup(typeof(PB.UI.BS.Startup))] namespace PB.UI.BS
{
public class Startup
{
public void Configuration(IAppBuilder app)
{
// Any connection or hub wire up and configuration should go here
app.MapSignalR();
} }
}

在MVC的webconfig里面添加一行代码
appSettings里面添加

  <add key="owin:AppStartup" value="PB.UI.BS.Startup, PB.UI.BS" />

这里的格式是这样的

<add key="owin.AppStartup" value="命名空间.Startup,命名空间"/>

好了现在可以看下前台如何调用

在页面上面引入一下JS

<script src="/Scripts/jquery.signalR-2.0.0.min.js" type="text/javascript"></script>
<script src="/signalr/hubs" type="text/javascript"></script>

JS代码 此JS代码为登陆的时候自动向服务端发送消息

$(function () {
$("#d_username").focus();
var IWannaChat = $.connection.myHubPms; $.connection.hub.start().done(function () {
$('#btnLogin').click(function () {
//服务
IWannaChat.server.send($("#d_username").val() + "正在登陆中...");
// Call the Send method on the hub.
chat.server.send($('#displayname').val(), $('#message').val());
// Clear text box and reset focus for next comment.
loginIn();
});
}); $("#btnLogin").click(loginIn);
})

JS2:此JS为接收服务端发送的消息 显示在页面上

$(function () {
var IWannaChat = $.connection.myHubPms; //这个主要是接收后台处理的结果,然后打印到前台来
IWannaChat.client.addMessage = function (message) {
$("#log").append("<li>" + message + "</li>");
}; //开启(长轮训的方式)
$.connection.hub.start();
});