CODEWITHSUNDEEP
c#asp.net-mvcasp.net-mvc-5signalrsignalr-hub
Junior
Junior

Reputation: 11990

How can I connect to my SignalR hub from a different host?

I have an ASP.NET MVC 5 app that is running SignalR 2.2.2 this app is running on hub.domain.com. On another Asp.Net MVC-5-based app (i.e. localhost:15371) I want to interact with the hub.

On my localhost:15371 application, I added the following code

<script>
    var myHubHost = 'http://hub.domain.com/';
</script>
<script src="http://hub.domain.com/Scripts/jquery.signalR-2.2.2.min.js"></script>
<script src="http://hub.domain.com/signalr/hubs"></script>
<script src="http://hub.domain.com/signalr/custom_code.js"></script>

However, I am getting the following error when trying to connect to the hub on app.domain.com but it is working fine when I run it directly from hub.domain.com

Error: Error during negotiation request.

To enable CORS on my hub app by adding the following to my <system.webServer></system.webServer> section in the Web.config file.

<httpProtocol>
    <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
    </customHeaders>
</httpProtocol>

I also, tried to enable JSONP and and the detailed errors on my hub like so

public void Configuration(IAppBuilder app)
{
    ConfigureAuth(app);

    var hubConfiguration = new HubConfiguration();
    hubConfiguration.EnableDetailedErrors = true;
    hubConfiguration.EnableJSONP = true;
    app.MapSignalR(hubConfiguration);
}

What could be causing this error? What else needs to be done to connect to my hub from another app?

The code that is used to connect to the my hub is as follow and found in the custom_code.js file.

$(document).ready(function () {

    // Reference the auto-generated proxy for the hub.
    var app = $.connection.myHubName;

    // The getApiUrl() method return http://hub.domain.com/signalr
    // as the myHubHost variable is set to http://hub.domain.com/
    $.connection.hub.url = getApiUrl('signalr');
    $.connection.hub.error(function (error) {
        console.log(error)
    });

    // Create a function that the hub can call back get the new events
    app.client.updatePanel = function (message) {
        // Do stuff
    }

    // Start the connection.
    $.connection.hub.start();

    // This allows me to set a variable to control the base-url host when including this file on a different app.
    function getApiUrl(uri) 
    {
        var link = "/";

        if (typeof window.myHubHost !== typeof someUndefinedVariableName) {
            link = window.myHubHost;
        }
        return link + uri;
    }
});

UPDATED

I enabled logging as per like so

$.connection.hub.logging = true;

I also installed Microsoft.Owin.Cors package to enable cors as per the documentation. Here is my current configuration

app.Map("/signalr", map =>
{
    map.UseCors(CorsOptions.AllowAll);
    var hubConfiguration = new HubConfiguration
    {
        EnableDetailedErrors = true
    };

    map.RunSignalR(hubConfiguration);
});

Here is the logs that I get in the console. As you can see, the negotiation fails.

SignalR: Auto detected cross domain url.
SignalR: Client subscribed to hub 'myHubName'.
SignalR: Negotiating with 'http://hub.domain.com/signalr/negotiate?clientProtocol=1.5&connectionData=%5B%5D'.
SignalR error: Error: Error during negotiation request.
SignalR: Stopping connection.

Upvotes: 4

Views: 2288

Answers (1)

Junior
Junior

Reputation: 11990

I figured out my problem finally.

I had html base tag in my layout which was causing the problem.

I removed

and my problem was solved!

Upvotes: 1

Related Questions