SignalR cannot read property client of undefined

Question

I'm trying to add SignalR to my project (ASPNET MVC 4). But I can't make it work.

In the below image you can see the error I'm receiving. I've read a lot of stackoverflow posts but none of them is resolving my issue.

This is what I did so far:

1) Ran Install-Package Microsoft.AspNet.SignalR -Pre
2) Added RouteTable.Routes.MapHubs(); in Global.asax.cs Application_Start()
3) If I go to http://localhost:9096/Gdp.IServer.Web/signalr/hubs I can see the file content
4) Added <modules runAllManagedModulesForAllRequests="true"/> to Web.Config
5) Created folder Hubs in the root of the MVC application
6) Moved jquery and signalR scripts to /Scripts/lib folder (I'm not using jquery 1.6.4, I'm using the latest)

This is my Index.cshtml

<h2>List of Messages</h2>

<div class="container">
    <input type="text" id="message" />
    <input type="button" id="sendmessage" value="Send" />
    <input type="hidden" id="displayname" />
    <ul id="discussion">
    </ul>
</div>

@section pageScripts
{
    <!--Reference the SignalR library. -->
    <script src="@Url.Content("~/Scripts/jquery.signalR-1.0.0-rc1.min.js")" type="text/javascript"></script>
    <!--Reference the autogenerated SignalR hub script. -->
    <script type="text/javascript" src="~/signalr/hubs"></script>
    <script src="@Url.Content("~/Scripts/map.js")" type="text/javascript"></script>
}

This is my IServerHub.cs file (located inside Hubs folder)

namespace Gdp.IServer.Ui.Web.Hubs
{
    using Microsoft.AspNet.SignalR.Hubs;
    [HubName("iServerHub")]
    public class IServerHub : Hub
    {
        public void Send(string name, string message)
        {
            Clients.All.broadcastMessage(name, message);
        }
    }
}

And this is map.js

$(function () {

    // Declare a proxy to reference the hub. 
    var clientServerHub = $.connection.iServerHub;

    // Create a function that the hub can call to broadcast messages.
    clientServerHub.client.broadcastMessage = function (name, message) {
        $('#discussion').append('<li><strong>' + name + '</strong>:&nbsp;&nbsp;' + message + '</li>');
    };

    // Get the user name and store it to prepend to messages.
    $('#displayname').val(prompt('Enter your name:', ''));

    // Set initial focus to message input box.  
    $('#message').focus();

    // Start the connection.
    $.connection.hub.start().done(function () {
        $('#sendmessage').click(function () {
            // Html encode display name and message. 
            var encodedName = $('<div />').text($('#displayname').val()).html();
            var encodedMsg = $('<div />').text($('#message').val()).html();

            // Call the Send method on the hub. 
            clientServerHub.server.send(encodedName, encodedMsg);

            // Clear text box and reset focus for next comment. 
            $('#message').val('').focus();
        });
    });
});

The DLL's I see references for SignalR are:

Microsoft.AspNet.SignalR.Core
Microsoft.AspNet.SignalR.Owin
Microsoft.AspNet.SignalR.SystemWeb

Any ideas how to get it work? Should I make any change because the scripts are in /Script/lib folder?

NOTE I'm following the instruction found here on how to set up Windsor Castle to make it work with SignalR, and again, seems that the proxy cannot be created and I'm getting the same error:

Cannot read property client of undefined

meaning that the proxy to the hub was not created

This is how I have it in the server

public class IncidentServerHub : Hub

and like this in the client

var clientServerHub = $.connection.incidentServerHub;

Again, I can see the dynamically created file here:

/GdpSoftware.Server.Web/signalr/hubs

So, Why the proxy is not created?

Thanks in advance!!! Guillermo.

Same happens, anyways, I see the file content when a browse it from the browser. Should I make any change because the scripts are in /Script/lib folder? — polonskyg, Jan 03 '13 at 21:02

Hodza · Accepted Answer · 2016-11-25T10:48:23.187

82

I fixed that problem by changing my js code from: var myHub = $.connection.SentimentsHub; to var myHub = $.connection.sentimentsHub;

So if you have some hub with class name TestHub you must use testHub(first letter is lowercase) name in js

edited Nov 25 '16 at 10:48

answered Jan 22 '13 at 21:38

Hodza

2,700
21
20

Thanks, this helped me realise my hub names did not quite match. – wiseowl2828 Mar 09 '15 at 16:33
Its mentioned in the documentation "Note In JavaScript the reference to the server class and its members is in camel case. The code sample references the C# ChatHub class in JavaScript as chatHub." https://docs.microsoft.com/en-us/aspnet/signalr/overview/getting-started/tutorial-getting-started-with-signalr – Sandeep Nov 06 '17 at 19:04
Its also called the `Camel Case` style! You made my day! – hiFI Oct 11 '19 at 04:13

Finickyflame · Answer 2 · 2014-06-04T03:21:12.507

42

For those who tried to add the generated proxy file path in the bundle.

Do not include the "~/signalr/hubs" in your BundleConfig.cs.

You can have the JQuery.SignalR in the bundle:

bundles.Add(new ScriptBundle("~/bundles/signalr").Include(
                  "~/Scripts/jquery.signalR-{version}.js"));

But you will need to add "/signalr/hubs" it in your view:

@section Scripts {
    @Scripts.Render("~/bundles/signalr")
    @Scripts.Render("/signalr/hubs")
}

I hope this helps.

edited Jun 04 '14 at 03:21

answered Jun 03 '14 at 21:14

Finickyflame

643
7
11

1

I struggled a lot with this. You saved my day. Thanks! – newman Sep 17 '14 at 03:29
The dynamically generated hubs js file *was actually not created* until I properly referenced "/signalr/hubs" – dudeNumber4 Oct 06 '14 at 15:27
MATE! I'd give you a plus 100 for this if I could. – Sentinel Oct 30 '16 at 15:22

score 20 · Answer 3 · answered May 24 '13 at 06:53

I had the same error message and resolved the issue by fixing a typo I had in the [HubName] attribute on the hub class - it was not exactly matching the property in the client-side javascript.

C# hub class:

[HubName("gameHub")]
public class GameHub : Hub
{

client-side javascript:

var foo = $.connection.gameHub;

"gameHub" must be the same.

hth

score 9 · Answer 4 · edited Dec 13 '19 at 11:02

9

For ASP.Net MVC folks:

Check your _Layout.cshtml: If you are calling the jquery bundle after the @RenderBody(), you will get this error.

Resoultion: Just move the @Scripts.Render("~/bundles/jquery") to the head section or write all signalr scripts in the scripts "section"

edited Dec 13 '19 at 11:02

Thomas Ayoub

27,208
15
85
130

answered Jan 11 '16 at 17:42

Tosh

511
7
3

score 5 · Answer 5 · answered Oct 22 '16 at 09:56

5

Your hub classes must be defined as public. For example:

class ChatHub : Hub

should actually be

public class ChatHub : Hub

answered Oct 22 '16 at 09:56

Jide Lawal

51
1
2

Ouch!! That was it. So glad you posted that. Lesson learned. – raddevus May 17 '17 at 17:25

polonskyg · Answer 6 · 2013-01-10T02:56:09.153

Ok, I've found the issue, one thing I needed to do was:

These two references were missing:

Microsoft.AspNet.SignalR.Hosting.AspNet
Microsoft.AspNet.SignalR.Hosting.Common

Now, I included them getting nuget package: WebApiDoodle.SignalR which uses those two. My question is why those Dlls weren't added one I installed the Nuget Package: Microsoft.AspNet.SignalR -Pre?

Bug?

Then I had this in my global.asax.cs

using SignalR;

so

RouteTable.Routes.MapHubs();

was using that one, I needed to remove that using and use this one:

using Microsoft.AspNet.SignalR;

So the MapHubs use that one, and started to work.

Hope this helps others. Guillermo.

score 4 · Answer 7 · answered Jul 23 '17 at 08:16

4

You should put SignalR and jQuery scripts, in correct order :

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

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

<script src="/signalr/hubs"></script>

answered Jul 23 '17 at 08:16

Majid

12,271
14
71
107

score 1 · Answer 8 · answered Apr 19 '20 at 14:39

Make sure you add

app.MapSignalR();

inside startup.cs and Configuration method, like this:

 public partial class Startup
    {
        public void Configuration(IAppBuilder app)
        {
            app.MapSignalR();
        }
    }

For Asp.net Core

Add

services.AddSignalR();

in ConfigureServices methode in your startup.cs

And add

app.UseSignalR(routes =>
            {
                routes.MapHub<ChatHub>("/chatHub");
            });

in Configure methode in your startup.cs

score 0 · Answer 9 · answered Dec 14 '16 at 13:48

0

Making the Hub class "public" solved it for me.

answered Dec 14 '16 at 13:48

Nohim Ys

31
6

score 0 · Answer 10 · edited Jul 17 '19 at 05:32

0

In my case, I lost Microsoft.Owin.Host.SystemWeb.dll & Microsoft.Owin.Security.dll in my project. After adding References to them, that error was solved. it's working now.

edited Jul 17 '19 at 05:32

Salman Zafar

3,079
4
15
35

answered Jul 17 '19 at 02:36

An Mac

1

SignalR cannot read property client of undefined

10 Answers10

Linked