您现在的位置是：首页 > 文章详情

SignalR 跨域解决方案全面

日期：2018-10-17点击：407收藏

SignalR 分：PersistentConnection和Hub 2种模式。

跨域又分：UseCors和JsonP 2种方法

所以例子写了4种。

核心代码：

UseCors

 //PersistentConnection Mode  app.UseCors(CorsOptions.AllowAll); //PersistentConnection Mode app.MapSignalR<MyConnection>("/server", new ConnectionConfiguration() { }); // 有关如何配置应用程序的详细信息，请访问 http://go.microsoft.com/fwlink/?LinkID=316888 //Hub Mode app.MapSignalR("/lcc", new HubConfiguration());

Use JsonP

 //PersistentConnection Mode app.MapSignalR<MyConnection>("/server", new ConnectionConfiguration() { EnableJSONP = true }); // 有关如何配置应用程序的详细信息，请访问 http://go.microsoft.com/fwlink/?LinkID=316888 //Hub Mode app.MapSignalR("/lcc", new HubConfiguration() { EnableJSONP = true });

Cross HUb 前端

// 建立对应server端Hub class的对象，请注意geffChat的第一个字母要改成小写 var chat = $.connection.myHub; $.connection.hub.url = 'http://localhost:2001/lcc'; //把connection打开  $.connection.hub.start().done(function () { chat.server.hello(); }); // 定义client端的javascript function，供server端hub，通过dynamic的方式，调用所有Clients的javascript function chat.client.sendMessage = function (message) { //当server端调用sendMessage时，将server push的message数据，呈现在wholeMessage中 $('#messages').append('<li>' + message + '</li>'); }; $("#broadcast").click(function () { chat.server.sendMessage($('#msg').val()); $('#msg').val(""); }); $("#btnStop").click(function () { $.connection.hub.stop(); });

Cross Connection 前端

 var connection = $.connection("http://localhost:2001/server"); connection.received(function (data) { $('#messages').append('<li>' + data + '</li>'); }); connection.start(); $("#broadcast").click(function () { connection.send($('#msg').val()); }); $("#btnStop").click(function () { connection.stop(); });

JsonP HUb

 // 建立对应server端Hub class的对象，请注意geffChat的第一个字母要改成小写 var chat = $.connection.myHub; $.connection.hub.url = 'http://localhost:16727/lcc'; //把connection打开 $.connection.hub.start({ jsonp: true }).done(function () { chat.server.hello(); }); // 定义client端的javascript function，供server端hub，通过dynamic的方式，调用所有Clients的javascript function chat.client.sendMessage = function (message) { //当server端调用sendMessage时，将server push的message数据，呈现在wholeMessage中 $('#messages').append('<li>' + message + '</li>'); }; $("#broadcast").click(function () { chat.server.sendMessage($('#msg').val()); $('#msg').val(""); }); $("#btnStop").click(function () { $.connection.hub.stop(); });

JsonP connection

 var connection = $.connection("http://localhost:16727/server"); connection.received(function (data) { $('#messages').append('<li>' + data + '</li>'); }); connection.start({ jsonp: true }); $("#broadcast").click(function () { connection.send($('#msg').val()); }); $("#btnStop").click(function () { connection.stop(); });