我指的是我的前一篇文章,我有一些连接到SignalR跨域的帮助Here和我使用This示例来构建我的POC。然而,我使用的例子是一个单一的从SignalR交叉域获取没有消息,但ping工作
我仍然在试图弄清楚SignalR的魔法是如何工作的,我想我理解它的大部分,但不知何故,我没有得到这个工作。我的代码很好地连接到集线器,如果我离开它,我将继续从发送的ping获得乒乓结果。
但是,我似乎没有从我的中心得到任何回应。这里是我的全部代码,希望有人能指出我在正确的方向:
Startup.cs:
public partial class Startup
{
public void Configuration(IAppBuilder app)
{
.
.
.
app.UseCors(_CorsOptions.Value);
// Branch the pipeline here for requests that start with "/signalr"
app.Map("/signalr", map =>
{
map.RunSignalR(new HubConfiguration { EnableDetailedErrors = true });
});
}
private static Lazy<CorsOptions> _CorsOptions = new Lazy<CorsOptions>(() =>
{
return new CorsOptions
{
PolicyProvider = new CorsPolicyProvider
{
PolicyResolver = context =>
{
var policy = new CorsPolicy();
foreach (string allowedCOrsOrigin in ConfigurationManager.AppSettings["AllowedCORS-Origins"].Split(',').ToArray())
{
if(!string.IsNullOrEmpty(allowedCOrsOrigin) && !policy.Origins.Contains(allowedCOrsOrigin))
{
policy.Origins.Add(allowedCOrsOrigin);
}
}
policy.AllowAnyMethod = true;
policy.AllowAnyHeader = true;
policy.SupportsCredentials = true;
return Task.FromResult(policy);
}
}
};
});
}
_SignalBase.cs:
public abstract class _SignalRBase<THub> : ApiController where THub : IHub
{
private readonly Lazy<IHubContext> _hub = new Lazy<IHubContext>(
() => GlobalHost.ConnectionManager.GetHubContext<THub>()
);
protected IHubContext Hub
{
get { return _hub.Value; }
}
}
FooHub.cs:
[HubName("foos")]
public class FooHub : Hub { }
FooController.cs:
个[RoutePrefix("api/foo")]
public class FooController : _SignalRBase<FooHub>
{
public IHttpActionResult Bar(FooDTO foo)
{
// notify all connected clients
Microsoft.AspNet.SignalR.GlobalHost.ConnectionManager.GetHubContext<FooHub>()
.Clients.All.newFoo(foo);
return Ok(foo);
}
}
FooDTO.cs:
public class FooDTO
{
public int First { get; set; }
public int Second { get; set; }
}
Sender.html
<div class="container">
<div class="row">
<div class="col-md-12">
<button type="button" ng-click="DoSignalR()" ></button>
</div>
</div>
</div>
<!-- Reference the autogenerated SignalR hub script -->
<script src="//localhost:31374/signalr/hubs"></script>
Receiver.html:
<div class="container">
<div class="row">
<div class="col-md-12">
<div>
<ul>
<li ng-repeat="foo in receivedFoos">
Foo {{foo.First}} & {{foo.Second}}
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Reference the autogenerated SignalR hub script -->
<script src="//localhost:31374/signalr/hubs"></script>
角控制器:
.controller('SignalRCtrl', function ($scope, TESTSignalR, $rootScope) {
$scope.receivedFoos = [];
var newFoo = function(data) {
console.log("newFoo function");
$scope.$apply(function() {
$scope.receivedFoos.push(data);
});
};
TESTSignalR.initialize(newFoo);
// Sender
$scope.DoSignalR = function() {
var FooDTO = {
"First": 1234,
"Second": 3456
};
TESTSignalR.DoSignalR(FooDTO);
};
})
角服务:
.factory('TESTSignalR', function($http, APIPath, $rootScope) {
var proxy = null;
var initialize = function (callback) {
// fetch connection object and create proxy
var connection = $.hubConnection();
this.proxy = connection.createHubProxy('foos');
$.connection.hub.url = "http://localhost:31374/signalr";
// start connection
$.connection.hub.start({ xdomain: true })
.done(function() {
console.log('Connected to signalR. connectionId : ' + $.connection.hub.id);
})
.fail(function() {
console.log('Could not connect to signalR!');
});
var hubConnection = $.connection.foos;
hubConnection.client.newFoo = function(data) {
callback(data);
};
};
var DoSignalR = function (foo) {
var url = "http://localhost:31374/api/foo/bar";
$http.post(url, foo)
.success(function(response) {
console.log(response);
})
.error(function(error) {
console.log(error);
});
}
return {
initialize: initialize,
DoSignalR: DoSignalR
};
})
编辑:我更新了上面的代码,以反映@萨尔 - 德尼罗指出的最新变化。它现在应该都工作正常了
我只是认为这将是更容易理解/保持如果逻辑是在同一个地方,但意见是为了改变,如果它会更符合惯例,那么我宁愿以不同的方式做。这个想法是,如果我在页面上有一个列表(接收者),我希望能够将要删除的对象从发件人发送到该页面。就像酒店房间列表一样,如果由其他人预订,则不再可用。酒吧的行动将是预订行动,我想通知所有房间哪些不再可用的房间 – Ebbs