1:新建一个empty的MVC项目

2:如果没有安装过signalr过那么要通过Nuget安装signalr

3:新建一个controller 然后建一个view =>index

4:新建一个signalr集线器类叫PersonHub 然后会看到里面有一个hello的默认的方法,,

5:然后在新建一个OWIN Startup类=》Startup1

6:在Startup1里面的Configuration方法里面加入app.MapSignalR();此方法的作用是将 SignalR 集线器映射到“/signalr”处的应用生成器管道

7:建好之后,会发现script文件下面里面,会生产相关的jquery.js和signalr.js

8:打开index.cshtml然后把jquery.js和 jquery.signalR.js 引用进来

9:还需要一个js就是,后台和前台连接的js,这个js是根据集线器里面的后台方法生产的,所以后台如果新加方法或者改变的时候,这个js也会改变,那我们就需要一种方法每次自动生产这个js到我们的script文件夹下面

10:这个方法就是用Microsoft.AspNet.SignalR.Utils工具,

11:Microsoft.AspNet.SignalR.Utils工具是需要从nuget里面获取的,打开nuget控制台,输入命令Install-Package Microsoft.AspNet.SignalR.Utils,

12:找到本项目的packages文件夹下面的Microsoft.AspNet.SignalR.Utils.2.2.1\tools里面的就是我们重新需要的工具

13:然后用我们项目的生产事件来生成我们的js文件(项目=》属性=》生成事件=》编辑后期生产的事件,然后输入如下命令)

13.1:工具的路径和执行=》H:\LianXi\SignalR1\SignalR1\packages\Microsoft.AspNet.SignalR.Utils.2.2.1\tools\signalr.exe ghp /

13.2:bin路径=》/path:H:\LianXi\SignalR1\SignalR1\SignalR1\bin

13.3:生成的js的路径=》/o:H:\LianXi\SignalR1\SignalR1\SignalR1\Scripts\myhub1.js

最中如图下所示

14:重新生产项目,就会看到scripts下面有我们的myhub1文件

15:把myhub1.js引入index.cshtml里面 至此signalr所必须的js就引用完毕了

16:改写PersonHub类下面的hell方法

17:给index.html的的script里面加入相关方法,总的index.cshtml如下所示

@{
ViewBag.Title = "Index";
} <script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.signalR-2.1.2.js"></script>
<script src="~/Scripts/myhub1.js"></script>
<script>
var proxy = $.connection.personHub;
//这个方法是被server调用的
proxy.client.Welcome = function (msg) {
console.log(msg);
}
$.connection.hub.start().done(function (data) {
proxy.server.hello();
}).fail(function () { });
</script>
<div>
sdfsdf
</div>

18:运行项目

19:一个简单的signalr项目就搭建好了,

20:此教程来自“一线码农的”的视频,我练习而已

创建一个简单的signalr项目的更多相关文章

  1. 用 Eclipse 创建一个简单的web项目

    Eclipse neon 汉化版 ; 1;右击新建 -->  选择 动态Web项目 2:  填写 项目名 项目位置 ; 选择 Dynamic web module version 和 tomca ...

  2. 创建一个简单的Django项目

    1.首先,启动pycharm,点击File->New Project,如下图所示. 2.在New Project对话框中,选择Django,在Location中设置项目路径以及项目名称,在App ...

  3. 2. 创建一个简单的Maven项目

    ☞ 创建项目 选定一个目录,如E:\workspace\maven,新建的项目将放在这个目录. 运行CMD,切换到该目录. 执行mvn archetype:generate直到输出"Choo ...

  4. maven创建一个简单的web项目

    1.确认maven插件和配置在eclipse中已经完成 如果没完成,可参考这篇博客:http://www.cnblogs.com/mmzs/p/8191979.html 2.在eclipse中用mav ...

  5. IDEA快速创建一个简单的SpringBoot项目(需要联网)

    一.点击File-New-Project,选择Spring initializr ,选择jdk1.8及以上 二.填写相关信息,点击Next 3.选择Web -Spring Web,点击Next 4.输 ...

  6. 用Eclipse 创建一个 简单的 Maven JavaWeb 项目

    使用Maven 创建一个简单的 javaWeb 项目: 本篇属于 创建 JavaWeb 项目的第三篇: 建议阅读本篇之前 阅读 用 Eclipse 创建一个简单的web项目  ;本篇是这这篇文章的基础 ...

  7. Python框架学习之用Flask创建一个简单项目

    在前面一篇讲了如何创建一个虚拟环境,今天这一篇就来说说如何创建一个简单的Flask项目.关于Flask的具体介绍就不详细叙述了,我们只要知道它非常简洁.灵活和扩展性强就够了.它不像Django那样集成 ...

  8. Windows 8.1 应用再出发 (WinJS) - 创建一个简单项目

    前面几篇我们介绍了如何利用 C# + XAML 完成Windows Store App 功能的实现,接下来的几篇我们来看看如何利用 Html + WinJS 来完成这些功能. 本篇我们使用WinJS ...

  9. 软件----- idea 配置创建一个简单javase项目

    1.显示工具栏和工具按钮,勾选上 如图,在左侧会增加对应的 2.设置项目结构,选择jdk 点击new  选择需要jdk 3.创建一个简单的java文件,和eclipse与myeslipse 差不多, ...

  10. 简单创建一个SpringCloud2021.0.3项目(四)

    目录 1. 项目说明 1. 版本 2. 用到组件 3. 功能 2. 上三篇教程 3. 日志处理 1. 创建日志公共模块 2. Eureka引入日志模块 4. 到此的功能代码 5. 注册中心换成naco ...

随机推荐

  1. 年羹尧奏摺专集(下).PDF

    书本详情 年羹尧奏摺专集(下)作者: 国立故宫博物院出版社: 国立故宫博物院出版年: 1971页数: 1180装帧: 精装ISBN: 9788017310909

  2. java对excel的操作

    1.对比任意两张excel表是否有不同行 并输出哪一行那一列不同 2.包含解析合并单元格方法 3.比较主要思路 a.解析excel: b.遍历第一张表数据所有行 c.遍历第二张表数据所有行 d.遍历第 ...

  3. ApiPost前后端人员可以使用的接口测试工具还带生成文档

    整体界面都是全中文非常适合过来使用,在本来使用过 对比来说这个工具调试和界面优化以及生成文档方面都是无可挑剔的 接口请求的参数描述也可以按自己的需求来设置后生成文档,方便了后端接口人员测试后回馈给前端 ...

  4. Markdown的在线使用

    欢迎使用 Markdown在线编辑器 MdEditor Markdown是一种轻量级的「标记语言」 Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容 ...

  5. Linux 第四节(shell脚本,IF,do,for)

    Shell脚本 1.批处理式: 2.交互式: 脚本声明   #!/bin/bash 脚本注释   #fakba;kb 脚本命令   ls pwd bash test.sh   //执行test.sh脚 ...

  6. AcWing 839. 模拟堆 2022/5/30

    关键代码: void head_swap(int a, int b){ swap(ph[hp[a]], ph[hp[b]]); swap(hp[a], hp[b]); swap(h[a], h[b]) ...

  7. linuxz中压缩解压缩文件

    压缩解压缩.tar格式文件: 把文件打包为tar.gz命令: tar -zcvf 文件名.tar.gz 要压缩的文件/文件夹                                      ...

  8. uniapp 中获取微信小程序的原生导航栏高度

    const custom = wx.getMenuButtonBoundingClientRect() // console.log(custom) that.yuansheng= custom.he ...

  9. Shell-通过expect工具脚本的自动交互及实例

    安装expect工具 expect是建立在tcl基础上的一个自动化交互套件, 在一些需要交互输入指令的场景下, 可通过脚本设置自动进行交互通信. 其交互流程是: spawn启动指定进程 -> e ...

  10. xd p4 WEB源码拓展

    WEB 源码在安全测试中是非常重要的信息来源,可以用来代码审计漏洞也可以用来做信息突破口,其中 WEB 源码有很多技术需要简明分析. 知识点 关于 WEB 源码目录结构 后台目录.模板目录.数据库目录 ...