CODEWITHSUNDEEP
signalrsignalr-hub
user4575494
user4575494

Reputation:

$.hubConnection is not a function(…)

I ran into a problem with my SignalR project. I have created an console to run the SignalR and then trying to use it with my website (all running in localhost mode for now)

SignalRSelfHost

using System;
using Microsoft.AspNet.SignalR;
using Microsoft.Owin.Hosting;
using Owin;
using Microsoft.Owin.Cors;
using Microsoft.AspNet.SignalR.Hubs;

namespace SignalRSelfHost
{
    class Program
    {
        static void Main(string[] args)
        {
            // This will *ONLY* bind to localhost, if you want to bind to all addresses
            // use http://*:8080 to bind to all addresses. 
            // See http://msdn.microsoft.com/en-us/library/system.net.httplistener.aspx 
            // for more information.
            string url = "http://localhost:8080";
            using (WebApp.Start(url))
            {
                Console.WriteLine("Server running on {0}", url);
                Console.ReadLine();
            }
        }
    }
    class Startup
    {
        public void Configuration(IAppBuilder app)
        {
            app.UseCors(CorsOptions.AllowAll);
            app.MapSignalR();
        }
    }
    [HubName("myHub")]
    public class MyHub : Hub
    {
        public void Send(string name, string message)
        {
            Clients.All.addMessage(name, message);
        }
    }
}

Index.Html

<script src="Scripts/jquery-3.1.1.min.js"></script>

<script src="Scripts/jquery.signalR-2.2.1.min.js"></script>

<script src="http://localhost:8080/signalr/hubs"></script>

<script type="text/javascript">
    $(function () {
        //Set the hubs URL for the connection
        //$.connection.hub.url = "http://localhost:8080/signalr";

        //// Declare a proxy to reference the hub.
        //var chat = $.connection.myHub;

        var conn = $.hubConnection("http://localhost:8080/signalr");
        var hubProxy = conn.createHubProxy('myHub');


        conn.start().done(function () {
        });
    });
</script>

Some of the above has been outcomented, because that is something i also tried but didnt work either.

Can anyone tell me why i get the error: $.hubConnection is not a function(…)

Upvotes: 4

Views: 18407

Answers (3)

halllo
halllo

Reputation: 987

I am not sure whether your version of jQuery is supported. I had strange side effects with the wrong version of jQuery being loaded or it being loaded multiple times.
When working with JSPM jspm resolve --only npm:[email protected] helps.

These verisons work:

<script src="jquery-2.1.4.min.js"></script>
<script src="jquery.signalR-2.2.0.min.js"></script>

and

"jquery": "npm:[email protected]",
"ms-signalr-client": "npm:[email protected]",

I also recommend to omit the "/signalr" postfix when specifying the hubConnection. It is added in automatically.

Upvotes: 5

DevNoob
DevNoob

Reputation: 546

I just ran into the same problem. The issue turned out to be that the JQuery script was being run again at the bottom of the page (part of the ASP.NET MVC template I was using), wiping out the SignalR-JQuery registrations. Make sure that you don't have an extra script tag or @Scripts.Render call at the bottom of your HTML page.

Upvotes: 1

Kelso Sharp
Kelso Sharp

Reputation: 972

Hub: 

[HubName("ContosoChatHub")]
public class ChatHub : Hub

Javascript Client: Remove the url, you don't need it.

var connection = $.hubConnection();
var contosoChatHubProxy = connection.createHubProxy('ContosoChatHub');

connection.start()
   .done(function(){ console.log('Now connected, connection ID=' + $.connection.hub.id); })
   .fail(function(){ console.log('Could not Connect!'); });
});

The string in the createHubProxy has to be identical to the string in the HubName attribute.

Upvotes: -1

Related Questions