CODEWITHSUNDEEP
signalr
Neilski
Neilski

Reputation: 4415

SignalR - Unable to load hub method

I am interested in using SignalR to provide a better user experience for some long-running processes in my application and have just created my first test SignalR project. I created an empty web project and then used NuGet to install the SignalR.Sample package. The StockTicker.html page example works perfectly. I then created my own Hub and test page.

using System.Threading;
using Microsoft.AspNet.SignalR.Hubs;

namespace SignalR.Test
{
   [HubName("testHub")]
   public class TestHub : Hub
   {
      public void LongRunningProcess()
      {
         Thread.Sleep(1000);
         this.Clients.Caller.updateStatus("25% Completed");
         Thread.Sleep(1000);
         this.Clients.Caller.updateStatus("50% Completed");
         Thread.Sleep(1000);
         this.Clients.Caller.updateStatus("75% Completed");
         Thread.Sleep(1000);
         this.Clients.Caller.updateStatus("Done");
      }
   }
}


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
   <title>SignalR - Long Running Process</title>
</head>
<body>
   <h1>Long Running Process</h1>

   <p>Status:</p>

   <ul id="status">
      <li>Loading hub...</li>
   </ul>

   <script src="/bundles/jquery"></script>
   <script src="/Scripts/jquery.signalR-1.0.0-alpha2.js"></script>
   <script src="/signalr/hubs"></script>
   <script type="text/javascript">
      $(function () {
         var hub = $.connection.testHub;

         hub.updateStatus = function (message) {
            $("#status").append("<li>" + message + "</li>");
         };

         $.connection.hub.start().done(function () {
            $("#status").children().first().text("Hub loaded.");
            hub.longRunningProcess();
         })
         .fail(function() {
            $("#status").children().first().text("Hub failed");
         });
      })
   </script>
</body>
</html>

When I run the page, I get the following (Firebug) error:

TypeError: hub.longRunningProcess is not a function
    hub.longRunningProcess();

If I look in /signalr/hubs I see the following script towards the end of the file:

signalR.testHub = signalR.hub.createHubProxy('testHub'); 
signalR.testHub.client = { };
signalR.testHub.server = {
    longRunningProcess: function () {
        return signalR.testHub.invoke.apply(signalR.testHub, $.merge(["LongRunningProcess"], $.makeArray(arguments)));
     }
};

Any advice/pointers on where I'm going wrong would be much appreciated.

Upvotes: 3

Views: 3564

Answers (1)

Neilski
Neilski

Reputation: 4415

I found the problem. The client script should looks as follows:

      $(function () {
         var hub = $.connection.testHub;

         hub.client.updateStatus = function (message) {
            $("#status").append("<li>" + message + "</li>");
         };

         $.connection.hub.start().done(function () {
            $("#status").children().first().text("Hub loaded.");
            hub.server.longRunningProcess();
         })
         .fail(function() {
            $("#status").children().first().text("Hub failed");
         });
      })

Notice the addition of the .client and .server properties to the hub method declarations, e.g. hub.client.updateStatus() and hub.server.longRunningProcess()

Upvotes: 5

Related Questions