SignalR + MVC5 简单示例

原文:SignalR + MVC5 简单示例

本文和前一篇文章很类似,只不过是把 SignalR 应用在了 MVC

 

新建项目,选择 MVC 模板

 

  安装 SignalR

Install-Package Microsoft.AspNet.SignalR

  在项目中添加文件夹 Hubs

  Hubs 文件夹中添加 SignalR Hub Class (V2)

 

  代码如下

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Microsoft.AspNet.SignalR;

namespace SignalRChatMVC5.Hubs
{
    public class ChatHub : Hub
    {
        public void Send(string name, string message)
        {
            // Call the addNewMessageToPage method to update clients.
            Clients.All.addNewMessageToPage(name, message);
        }
    }
}

 

  添加OWIN Startup Class

 

  代码如下

using System;
using System.Threading.Tasks;
using Microsoft.Owin;
using Owin;

[assembly: OwinStartup(typeof(SignalRChatMVC5.Startup))]
namespace SignalRChatMVC5
{
    public class Startup
    {
        public void Configuration(IAppBuilder app)
        {
            // Any connection or hub wire up and configuration should go here
            app.MapSignalR();
        }
    }
}

 

  在 HomeController 中添加方法 Chat

public ActionResult Chat()
{
    return View();
}

  右击添加 View

 

  代码如下

@{
    ViewBag.Title = "Chat";
}
<h2>Chat</h2>
<div class="container">
    <input type="text" id="message" />
    <input type="button" id="sendmessage" value="Send" />
    <input type="hidden" id="displayname" />
    <ul id="discussion"></ul>
</div>
@section scripts {
    <!--Script references. -->
    <!--The jQuery library is required and is referenced by default in _Layout.cshtml. -->
    <!--Reference the SignalR library. -->
    <script src="~/Scripts/jquery.signalR-2.2.0.min.js"></script>
    <!--Reference the autogenerated SignalR hub script. -->
    <script src="~/signalr/hubs"></script>
    <!--SignalR script to update the chat page and send messages.-->
    <script>
        $(function () {
            // Reference the auto-generated proxy for the hub.
            var chat = $.connection.chatHub;
            // Create a function that the hub can call back to display messages.
            chat.client.addNewMessageToPage = function (name, message) {
                // Add the message to the page.
                $('#discussion').append('<li><strong>' + htmlEncode(name) + '</strong>: ' + htmlEncode(message) + '</li>');
            };
            // Get the user name and store it to prepend to messages.
            $('#displayname').val(prompt('Enter your name:', ''));
            // Set initial focus to message input box.
            $('#message').focus();
            // Start the connection.
            $.connection.hub.start().done(function () {
                $('#sendmessage').click(function () {
                    // Call the Send method on the hub.
                    chat.server.send($('#displayname').val(), $('#message').val());
                    // Clear text box and reset focus for next comment.
                    $('#message').val('').focus();
                });
            });
        });
        // This optional function html-encodes messages for display in the page.
        function htmlEncode(value) {
            var encodedValue = $('<div />').text(value).html();
            return encodedValue;
        }
    </script>
}

 

  运行效果(开启两个浏览器窗口)

时间: 2024-11-06 03:30:43

SignalR + MVC5 简单示例的相关文章

SignalR 简单示例

原文:SignalR 简单示例 一.什么是 SignalR ASP.NET SignalR is a library for ASP.NET developers that simplifies the process of adding real-time web functionality to applications. Real-time web functionality is the ability to have server code push content to connec

MVC5 + EF6 简单示例

原文 MVC5 + EF6 简单示例 本文所使用的软件及环境: Visual Studio Ultimate 2013 (下载地址:http://www.visualstudio.com/downloads/download-visual-studio-vs); MVC5 + EF6 + .NET Framework 4.5 + LocalDB; Windows 7 x64 Professional 说明: 在EF (Entity Framework,以下简称EF6)框架下,操作数据的方式有三种

PHP静态推延绑定简单示例

  PHP静态延迟绑定简单示例 没怎么用过这个新特性,其实也不算新啦,试试吧,现在静态类的继承很方便了 class A { protected static $def = '123456'; public static function test() { echo get_class(new static); } public static function test2() { echo static::$def; } } class B extends A { protected static

spark sql简单示例

运行环境 集群环境:CDH5.3.0 具体JAR版本如下: spark版本:1.2.0-cdh5.3.0 hive版本:0.13.1-cdh5.3.0 hadoop版本:2.5.0-cdh5.3.0 spark sql的JAVA版简单示例 spark sql直接查询JSON格式的数据 spark sql的自定义函数 spark sql查询hive上面的表 import java.util.ArrayList; import java.util.List; import org.apache.sp

PHP实现WebService的简单示例和实现步骤

 这篇文章主要介绍了PHP实现WebService的简单示例和实现步骤,本文直接给出示例代码并分步骤讲解,需要的朋友可以参考下     前段时间在webservice的问题上纠结了很长时间,本来想写在thinkphp的框架里面,可是怎么也实现不了,目前为止也仅仅是学会的没有框架的接口的开发. 在此资源共享一下步骤: 首先我创建的文件有: api.php api的接口类文件 api.wsdl 我创建产生的最后要调用的接口文件 cometrue.php 注册service api类内容的所有内容的执

在c#使用IOCP(完成端口)的简单示例

这次给大家演示一下利用IOCP的在线程间传递数据的例子,顺便打算讲一些细节和注意的地方. 概述:这里主要使用IOCP的三个API,CreateIoCompletionPort,PostQueuedCompletionStatus,GetQueuedCompletionStatus,第一个是用来创建一个完成端口对象,第二个是向一个端口发送数据,第三个是接受数据,基本上用着三个函数,就可以写一个使用IOCP的简单示例. 其中完成端口一个内核对象,所以创建的时候会耗费性能,CPU得切换到内核模式,而且

安卓UI设计与开发教程 顶部标题栏(一)ActionBar详细概述和简单示例

一.ActionBar介绍 在Android 3.0中 除了我们重点讲解的Fragment外,Action Bar也是一个非常重要的交互元素,Action Bar取代了传统的tittle bar和menu,在程序运行中一直置于顶部,对于Android平板设备来说屏幕更大它的标题使用Action Bar来设计 可以展示更多丰富的内容,方便操控. 二.ActionBar的功能 用图的方式来讲解它的功能 开发教程 顶部标题栏(一)ActionBar详细概述和简单示例-actionbar隐藏标题栏"&g

添加和删除HTML节点的简单示例

 添加和删除HTML节点的简单示例 <input type="button" onclick="appendnode()" value="添加节点"> <input type="button" onclick="removenode()" value="删除节点"> <div id="result"></div> <

php 5.6版本中编写一个PHP扩展的简单示例

 这篇文章主要介绍了php 5.6版本中编写一个PHP扩展的简单示例,本文给出扩展实现代码.编译方法.配置方法和使用例子等内容,需要的朋友可以参考下     有时候在php本身没有满足需求的api时候,需要自己写相应的扩展,扩展写完之后进行编译,即可加入自己的开发环境中,扩展php的功能. 这里实现一个连接字符串和int型数的连接操作的简单扩展. 首先,下载最新的php源码安装包,进入ext/目录,新建extstrcat.def: 代码如下: string extstrcat(string st