MVC5中使用SignalR20实现实时聊天室.docxVIP

MVC5中使用SignalR2.0实现实时聊天室

有时候需要浏览器和服务端保持实时的通讯（比如在线聊天），SignalR的出现让这一切变得非常简单。它能够让服务端向客户端实时的推送消息。如果用户的浏览器支持Html5，SignalR会使用WebSocket来实习这个功能；如果不支持，则使用其

它技术实现相同的效果。对于使用者来说却不用考虑这些差异。

下面的文字主要翻译自SignalR的文档，一些地方加入了我自己的理解，没有机械式的翻译。

这篇教程将会使用MVC5创建一个基于SignalR2.0的聊天室应用程序，仅供学习。开发环境是vs2013

创建项目

1，在vs中创建一个Asp.netMVC5的项目，取名为SignalRChat，并点击OK。

2,在新建项目对话框中，选择MVC，并且点击“创建项目”。

3，打开NuGet控制台，并运行下面的命令。安装SignalR2.0

install-packageMicrosoft.AspNet.SignalR

4,安装完成后，在解决方案窗口中，展开Scripts文件夹，会发现Signal2.0的脚本文件已经引入了。

5，在项目中点击右键，新建一个名为“Hubs”的文件夹。

6，右键Hubs文件夹，点击新建项，选择VisualC#|Web|SignalR节点，如图所示，并并命名为ChatHub.cs。（如果没有此模板，则直接新建一个类也行）

这个类将会作为SignalR服务端，用来向所有的客户端发送消息。

7，用下面的代码替换ChatHub中的代码：

usingSystem;usingSystem.Web;

usingMicrosoft.AspNet.SignalR;namespaceSignalRChat

{

publicclassChatHub:Hub

{

publicvoidSend(stringname,stringmessage)

{

//CalltheaddNewMessageToPagemethodtoupdateclients.Clients.All.addNewMessageToPage(name,message);

}

}

}

8，打开Startup.cs文件，添加代码如下所示

usingSystem;usingSystem.Web;

usingMicrosoft.AspNet.SignalR;namespaceSignalRChat

{

publicclassChatHub:Hub

{

publicvoidSend(stringname,stringmessage)

{

//CalltheaddNewMessageToPagemethodtoupdateclients.Clients.All.addNewMessageToPage(name,message);

}

}

}

9，在HomeController中添加一个Action,取名为Chat。这个Action将会用来返回加下来要创建的视图。

publicActionResultChat()

{

returnView();

}

10，右键点击刚才创建的Action,选择新建视图。

11，在新建视图对话框中，取名为Chat。

12，在新建的视图中添加如下的代码：

注意：在使用NuGet安装SignalR的时候，有可能引入的是新版本的脚本文件。要保证这些文件已经在视图中被引用。

@{

ViewBag.Title=Chat;

}

h2Chat/h2

divclass=container

inputtype=textid=message/

inputtype=buttonid=sendmessagevalue=Send/

inputtype=hiddenid=displayname/

ulid=discussion

/ul

/div

@sectionscripts{

!--Scriptreferences.--

!--ThejQuerylibraryisrequiredandisreferencedbydefaultin_Layout.cshtml.--

!--ReferencetheSignalRlibrary.--

scriptsrc=~/Scripts/jquery.signalR-2.0.0.min.js/script

!--ReferencetheautogeneratedSignalRhubscript.--

scrip