SignalR .net及时通讯
一：
通过Nuget下载安装Microsoft.AspNet.SignalR（v2.1.1），注： 这个版本的Framework版本是：V4.5
二：
配置service端：
1 using System; 2 using System.Threading.Tasks; 3 using Microsoft.Owin; 4 using Owin; 5 using Microsoft.AspNet.SignalR; 6 using Newtonsoft.Json; 7 using Microsoft.AspNet.SignalR.Hubs; 8 9 [assembly: OwinStartup(typeof(Demo.Chat.MyStartup))] 10 namespace Demo.Chat 11 { 12 public class MyStartup 13 { 14 public void Configuration(IAppBuilder app) 15 { 16 app.MapSignalR(); 17 } 18 19 20 } 21 [HubName("MyChat")] 22 public class MyChat : Hub 23 { 24 public void Send(ShapeModel clientModel) 25 { 26 Clients.AllExcept(clientModel.LastUpdatedBy).sendMessage(clientModel); 27 28 } 29 30 31 } 32 33 public class ShapeModel 34 { 35 [JsonProperty("content")] 36 public string content { get; set; } 37 [JsonProperty("name")] 38 public string name { get; set; } 39 [JsonIgnore] 40 public string LastUpdatedBy { get; set; } 41 } 42 43 }
配置client:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<meta name="viewport" content="width=device-width" />
<title>我的通讯</title>
<script src="/js/jquery-1.8.2.min.js"></script>
<script src="/Scripts/json2.js"></script><!--解决IE8一下版本js错误-->
<script src="/Scripts/jquery.signalR-2.1.1.js"></script>
<script src="/signalr/hubs" type="text/javascript"></script>
<style>
ul {
list-style:none;
}
li {
width:80%;
}
li span {
float:right;
}
</style>
</head>
<body>
<div>
<script type="text/javascript">
Date.prototype.format = function (fmt) {
var o = {
"M+": this.getMonth() + 1, //月份
"d+": this.getDate(), //日
"h+": this.getHours(), //小时
"m+": this.getMinutes(), //分
"s+": this.getSeconds(), //秒
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
"S": this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt))
fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
for (var k in o)
if (new RegExp("(" + k + ")").test(fmt))
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
return fmt;
}
$(function () {
var EFifanChat = $.connection.MyChat;
$shape = $("#shape");
MyChat.client.sendMessage = function (model) {
if (decodeURIComponent(model.content) != "") {
var li = ("<li>" + decodeURIComponent(model.name) + "： <b>" + decodeURIComponent(model.content) + "</b>" + "<span>" + new Date().format("yyyy-MM-dd hh:mm:ss") + "</span></li>")
$shape.prepend(li);
}
};
$.connection.hub.start().done(function () {
$("#broadcast").click(function () {
shapeModel = {
content:encodeURIComponent($("#message").val()),
name: encodeURIComponent($("#name").val())
};
$shape.prepend("<li style='color:Red'>" + decodeURIComponent(shapeModel.name) + "： <b>" + decodeURIComponent(shapeModel.content) + "</b>" + "<span>" + new Date().format("yyyy-MM-dd hh:mm:ss") + "</span>" + "</li>");
MyChat.server.send(shapeModel);
});
});
});
</script>
<input type="hidden" id="name" value="@ViewBag.ClientName" />
<input type="text" style=" background: none repeat scroll 0 0 #fff; border: 1px solid ; height: 21px; line-height: 21px; outline: 0 none; padding: 6px 0; text-indent: 10px; width: 618px;" id="message" />
<input type="button" id="broadcast" value="发送" />
<ul id="shape"></ul>
</div>
</body>
</html>
运行效果:
小川~
