我在控制台应用程序中创建了一个简单的SignalR集线器:
class Program { static void Main(string[] args) { using (WebApp.Start<Startup>("http://localhost:1968")) { Console.WriteLine("Server running!"); Console.ReadLine(); } } } public static class UserHandler { public static HashSet<string> ConnectedIds = new HashSet<string>(); } [HubName("echo")] public class EchoHub : Hub { public void Say(string message) { Trace.WriteLine("hub: "+message); Clients.All.AddMessage(message); } public override Task OnConnected() { UserHandler.ConnectedIds.Add(Context.ConnectionId); return base.OnConnected(); } public override Task OnDisconnected() { UserHandler.ConnectedIds.Remove(Context.ConnectionId); return base.OnDisconnected(); } } class Startup { public void Configuration(IAppBuilder app) { app.MapSignalR(); } }
当我尝试从Silverlight应用程序连接它时,它成功:
static Microsoft.AspNet.SignalR.Client.HubConnection signalR { get; set; } public static Microsoft.AspNet.SignalR.Client.IHubProxy signalRhub { get; set; } public static void StartSignalR() { var url = "http://localhost:1968"; signalR = new Microsoft.AspNet.SignalR.Client.HubConnection(url); signalR.Received += signalR_Received; signalRhub = signalR.CreateHubProxy("echo"); signalR.Start().Wait(); signalRhub.Invoke("Say","hub invoked"); }
我的下一步是从jquery连接SignalR集线器:
<script src="../Scripts/jquery-1.6.4.js"></script> <script src="../Scripts/jquery.signalR-2.1.0.js"></script> <script> $(function () { var connection = $.hubConnection("http://localhost:1968"); connection.start() .done(function () { console.log('connected'); connection.send("success?"); }) .fail(function (a) { console.log('not connected'+a); }); }); </script>
当我尝试运行此脚本时,它会给出错误:
"XMLHttpRequest cannot load localhost:1968/signalr/negotiate?clientProtocol=1.4&_=1404978593482. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin <code>http://localhost:55282</code> is therefore not allowed access."
为什么我可以从Silverlight页面连接到集线器(托管在localhost:3926中)
当我运行jquery脚本(托管在localhost:55282)时失败了吗?
如何在jQuery和SignalR集线器之间建立有效连接?
解决方法
更改
$(function () { var connection = $.hubConnection("http://localhost:1968"); connection.start() .done(function () { console.log('connected'); connection.send("success?"); }) .fail(function (a) { console.log('not connected'+a); }); });
至
$(function () { var connection = $.hubConnection("http://localhost:1968"); var hub = connection.createHubProxy("echo"); hub.on("AddMessage",Method); connection.start({ jsonp: true }) .done(function () { console.log('connected'); hub.say("success?"); }) .fail(function (a) { console.log('not connected'+a); }); }); function Method(messageFromHub) { alert(messageFromHub); }
和
class Startup { public void Configuration(IAppBuilder app) { app.MapSignalR(); } }
至
class Startup { public void Configuration(IAppBuilder app) { app.MapSignalR(new HubConfiguration() { EnableJSONP = true });} }
应该这样做.
app.MapSignalR(new HubConfiguration() { EnableJSONP = true });}
和
connection.start({ jsonp: true })
将允许跨站点请求