做了一个小型直播demo，接入阿里云的视频直播，需要统计实时在线人数，使用了SignalR做通讯。
image.png
2、在WebConfig中配置
image.png
3、在程序中添加Owin Startup类，需要在NuGet中引入Owin的相关dll（依赖项会自动添加），并在Configuration方法中配置如下
image.png
4、创建一个集线器类，并继承Hubs，然后需要在Nuget中获取SignalR
image.png
4.1安装 Mictosoft.ASP.NET.SignalR，使用的是2.4.1版本
image.png
4.2 Azure SignalR 需要安装4.1截图中最下面的【Microsoft.Azure.SignalR.AspNet 】
4.3 在安装此控件后，会自动添加相对应的 js 文件
image.png
5、开始使用，以下代码为测试代码
<div>
消息接收
<p id="msg"></p>
<img style="width:300px;" id="PPTImg" src="" />
<input id="UserID" placeholder="用户id" />
<p>在线人数:<span id="OnlineNum"></span></p>
<div id="Users">
</div>
</div>
<script src="~/Scripts/jquery-3.3.1.min.js"></script>
<script src="~/Scripts/jquery.signalR-2.4.1.min.js"></script>
<script src="https://localhost:112313/signalr/hubs"></script>
<script>
function sj() {
//x上限，y下限
var x = 10000;
var y = 0;
var rand = parseInt(Math.random() * (x - y + 1) + y);
return rand;
}
$(function () {
$.connection.hub.url = "https://localhost:112313/signalr";
var hub = $.connection.messageHub;
var i = 0;
var maxc = 10; //最大连接数
hub.client.receiveMassage = function (m) {
$("#PPTImg").prop("src", m);
$("#msg").text(m);
}
//接收在线人数变化
hub.client.pushOnlineNum = function (m) {
$("p>#OnlineNum").text(m);
}
$.connection.hub.disconnected(function (e) {
if ($("#UserID").val() != "") {
$.post("https://localhost:123432/LoginApi/OutOnline", { UserID: $("#UserID").val() }, function (res) {
});
}
console.log("断开连接"); //这里添加断开连接的处理方法
});
// hub连接开启
$.connection.hub.start().done(function () {
//发送上线信息
var init = setInterval(function () {
if (i <= maxc) {
//测试，随机生成UserID
var UserId = sj();
i += 1;
//hub.server.clientLogin(UserId, 1);
$("#Users").append("<p>用户：" + UserId + " 上线了!</p>");
} else {
init = window.clearInterval(init);
}
}, 1000);
});
});
</script>
