How to use cross-domain connections (CORS - Access Control Allow Origin) with SignalR

Question

Using persistent connections and an ASP.NET JavaScript client, I am trying to connect to a sub-domain not the same as the one the page was served from.

ASP.Net Page from webserver sub1.mydomain.com wants to connect to SignalR at sub2.mydomain.com. The same code works fine when connecting within the same sub-domain.

I found another post where cross-domain connections were enabled with:

jQuery.support.cors = true;

but this did not work for me.

How can I connect to SignalR in a second sub-domain using persistent connection and a JavaScript client?

Answer 1

You need to do one of the following to make it work:

• Set up $.connection.hub.url = 'http://subdomain.domain.com/signalr';, pointing to your subdomain.

• Enable cross domain on the server:

  RouteTable.Routes.MapHubs(new HubConfiguration()
  {
    EnableCrossDomain = true
  });
  

Answer 2

In the current version of SignalR, using the now separate CORS package, the API for this has changed to:

public void Configuration(IAppBuilder app)
{
    app.Map("/signalr", map =>
    {
        map.UseCors(CorsOptions.AllowAll);
        var hubConfiguration = new HubConfiguration
        {
        };
        map.RunSignalR(hubConfiguration);
    });
}

See ASP.NET SignalR Hubs API Guide - JavaScript Client.

Answer 3

If switching from 0.5.1 to 0.5.2, you may have had the following:

$.connection.hub.start({ transport: 'longPolling', xdomain: true }, function () {...

Which can be changed to:

$.connection.hub.start({ jsonp: true }, function () {...

Answer 4

In Signalr2, you can use the pre-release of Microsoft.Owin.Cors, currently 3.0.0-rc1 as of writing this: Microsoft.Owin.Cors.

More information can be found here:

• http://www.asp.net/signalr/overview/signalr-20/hubs-api/hubs-api-guide-javascript-client
• http://www.asp.net/signalr/overview/signalr-20/getting-started-with-signalr-20/tutorial-getting-started-with-signalr-20

Answer 5

var connection = $.connection('http://somecrossdomainurl/echo')
connection.start({ transport: 'longPolling', xdomain: true });

https://github.com/SignalR/SignalR/wiki/SignalR-JS-Client

Answer 6

What really have solved my issue was:

1 - Add this to global.asax:

RouteTable.Routes.MapHubs(new HubConfiguration() { 
    EnableCrossDomain = true 
});

2- Set up the web.config of my web project to enable the cross-domain:

<system.webServer>
    <httpProtocol>
        <customHeaders>
            <add name="Access-Control-Allow-Origin" value="*" />
            <add name="Access-Control-Allow-Headers" value="Content-Type" />
        </customHeaders>
    </httpProtocol>
</system.webServer>

3- Then I change the implementation on my html, changing the $.connection() to as follow:

var connection = $.hubConnection('http://localhost.my:8081/signalr');
var chatHubProxy = connection.createHubProxy('chatHub');

Versions I'm using:

• signalR-1.1.0

• jquery.signalR-1.1.3.js

• dot.net 4.0