标签:
1、参考资料:
http://www.asp.net/signalr/overview/guide-to-the-api/hubs-api-guide-server
http://signalr.net/
http://www.asp.net/signalr/videos/getting-started/signalr-and-web-sockets
2、Demo
第一步:创建hub公共类,注意只有设置为public类和方法才能被客户端调用;服务器端调用客户端方法--Clients.All.addMessage(message);
using System;
using System.Collections.Concurrent;
using System.Linq;
using System.Threading;
using System.Threading.Tasks;
using Microsoft.AspNet.SignalR;
using Microsoft.Owin;
namespace SignalRDemo
{
public class MyChat : Hub
{
/// <summary>
/// Sends the specified message.
/// </summary>
/// <param name="message">The message.</param>
public void Send(string message)
{
// Call the addMessage method on all clients
Clients.All.addMessage(message);
}
}
}
第二步:定义客户端可以连接到你的hub的路由,调用MapSignalR扩展方法
using Microsoft.Owin;
using Owin;
[assembly: OwinStartupAttribute(typeof(SignalRDemo.Startup))]
namespace SignalRDemo
{
public partial class Startup {
public void Configuration(IAppBuilder app) {
app.MapSignalR();
}
}
}
第三步:前端调用hub类方法
1、路由: <script src=‘/signalr/hubs‘></script>
2、创建proxy对象 chat = $.connection.myChat;
3、调用服务器端方法 chat.server.send();
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script src="/Scripts/jquery-1.10.2.js"></script>
<script src="/Scripts/jquery.signalR-2.2.0.js"></script>
<script src=‘/signalr/hubs‘></script>
<title></title>
</head>
<body>
<script>
var chat;
$(function () {
// Created proxy,此处要特别注意,Hub类的首字母是大写MyChat,但前端使用时,首字母要小写
chat = $.connection.myChat;
// Assign a function to be called by the server
chat.client.addMessage = onAddMessage;
// Register a function with the button click
$("#broadcast").click(onBroadcast);
// Start the connection
$.connection.hub.start().done(function (a) {
console.log("成功");
console.log(a);
});
});
function onAddMessage(message) {
// Add the message to the list
$(‘#messages‘).append(‘<li>‘ + message + ‘</li>‘);
};
function onBroadcast() {
chat.server.send($(‘#message‘).val());
}
</script>
<form id="form1" runat="server">
<div>
<input type="text" id="message" />
<input type="button" id="broadcast" value="broadcast" />
<ul id="messages"></ul>
</div>
</form>
</body>
</html>
标签:
原文地址:http://www.cnblogs.com/mingjia/p/5455481.html