Search code examples
asp.netsignalrsignalr-hubsignalr.client

$.connection is undefined SignalR with ASP.Net Webforms


I am trying to user SignalR in ASP.NET 4.0 Web Forms.

I have followed a Tutorial and I was able to get SignalR working on default.aspx which is at root of my project which is accessible without login.

Now I want to use it across pages which are accessible after login.

One a master page I have following Snippet of code.

<head>
 ....
 ...
<script src="../Scripts/jquery-1.6.4.js"></script>
<script src="../Scripts/jquery.signalR-2.0.0.js"></script>
<script src="/signalr/hubs"></script>
<script type="text/javascript">
    $(function () {

        var logger = $.connection.myhub1;

        logger.client.logMessage = function (msg) {
            console.log(msg);
            //$("#logUl").append("<li>" + msg + "</li>");

        };

        $.connection.hub.start({ pingInterval: 10000 }).done(function () {
            alert('Hub starts');
        }).fail(function (e) {
            alert('There was an error');
            console.error(e);
        });
        $.connection.hub.logging = true;

    });
</script>

...
...

</head>

Hub class is MyHub1 and its at root level

Imports Microsoft.AspNet.SignalR
Imports Microsoft.AspNet.SignalR.Hubs

<HubName("myhub1")>
Public Class MyHub1
    Inherits Hub

    Public Shared ReadOnly _Timer As System.Timers.Timer = New System.Timers.Timer()

    Shared Sub New()
        _Timer.Interval = 2000
        AddHandler _Timer.Elapsed, AddressOf TimerElapsed
        _Timer.Start()
    End Sub

    Private Shared Sub TimerElapsed(ByVal sender As Object, ByVal e As System.Timers.ElapsedEventArgs)
        Dim hub = GlobalHost.ConnectionManager.GetHubContext("myhub1")
        hub.Clients.All.logMessage(String.Format("{0} - Still running", DateTime.UtcNow))
    End Sub
    Public Shared Sub LogMessage(ByVal str As String)
        Dim hub = GlobalHost.ConnectionManager.GetHubContext("myhub1")
        hub.Clients.All.logMessage(str)
    End Sub
End Class

Master Page is being applied to UserDefault.aspx which have the Master Page applied which have javascript code given above. On default.aspx when user give credentials after login UserDefault.aspx is shown to the user.

Now when is check in dev tool signalR/hubs folder is created with js file but in console error is

$.connection is undefined....

What wrong I am doing here?

Do I need to move MyHub1?


Solution

  • I managed to fix this issue by moving the references of the scripts. Thanks to this post SignalR $.connection is undefined

    As mentioned in this post, on my page I checked if there are multiple references to jquery.js file and I found 2 references of this file first one which I have added and second one there was a Script block which already had reference to jquery.js file.

    I moved the reference to script block as under:

    <Script>
     ...
     ...
     <asp:ScriptReference Path="~/Scripts/jquery.signalR-2.0.0.js" />
     <asp:ScriptReference Path="~/signalr/hubs" />
    </Script>
    

    Also piece of client code was moved after the above Script block.

    After I made this change it started working.