1

I have a KendoUI Grid that uses SignalR in an ASP.NET Core 5 web application. I am experiencing problems with it in that, other people within my company cannot see the updates when I change the data (create/update or destroy), they have to refresh their page which defeats the purpose of a SignalR implementation in this case.

I investigated the reasons as to why this was, starting by simply adding a break point to the update method in my hub controller, just to make sure it was being hit and that the data was being passing in ok. What I found was that, the method is not always called in the hub when an update is performed, I assume, please feel free to correct me, this is because a connection in SignalR has a lifespan (I think it's around 30/60 seconds?) and therefore is doesn't always make a new connection when the page is loaded.

It's important to mention that, when I load my application I can see the hub connections, they seem to work correctly and I can see that they normalize when the page is loaded. It's also important to say that no errors are reported and I have advanced error messages for SignalR turned on in my startup.cs.

Additionally I started looking at how updates were being passed to clients. As per the KendoUI Documentation, the crud operations in the hub controller pass the following:

await Clients.OthersInGroup(GetGroupName()).SendAsync("update", model);

According to the Microsoft documentation, OthersInGroup is all clients except the caller. So, that seems to be fit for purpose.

Here is my code for my SignalR bound grid.

We are using the Azure SignalR service

hubs.js

var opportunities_url = "/opportunitiesHub";
var opportunities_hub = new signalR.HubConnectionBuilder().withUrl(opportunities_url, {
    transport: signalR.HttpTransportType.LongPolling
}).build();
var opportunities_hub_start = opportunities_hub.start({
    json: true
});

startup.cs

services.AddSignalR(options => { options.EnableDetailedErrors = true; })
    .AddAzureSignalR().AddJsonProtocol(options => {
    //Prevents SignalR converting all text to lower case.
        options.PayloadSerializerOptions.PropertyNamingPolicy = null;
    });

app.UseAzureSignalR(endpoints =>
{
    endpoints.MapHub<OpportunitiesHub>("/opportunitiesHub");    
});

OpportunitiesHub.cs

public async Task Update(Opportunity model)
{
    try
    {
        await _opportunities.UpdateAsync(model);
        await Clients.OthersInGroup(GetGroupName()).SendAsync("update", model);
    }
    catch (Exception ex)
    {
        Console.WriteLine(ex.Message);
    }
}

Grid.js

$('#grid_opportunities').kendoGrid({
    dataSource: {
        type: "signalr",
        autoSync: true,
        transport: {
            parameterMap: parameters_opportunities_grid,
            signalr: {
                promise: opportunities_hub_start,
                hub: opportunities_hub,
                server: {
                    read: "read",
                    update: "update",
                    create: "create",
                    destroy: "destroy"
                },
                client: {
                    read: "read",
                    update: "update",
                    create: "create",
                    destroy: "destroy"
                }
            }
        },
        schema: {
            model: {
                id: "Id",
                fields: {
                    Id: {
                        editable: false
                    }
                }
            }
        }
    },
    autoBind: true,
    editable: "incell",
    pageable: false,
    columns: [
        {
            field: "Id",
            title: "Ref",
            width: 60,
            template: "RGH#=Id#"
        },
        {
            field: "Created_Date",
            format: "{0:dd/MM/yyyy}",
            width: 100,
            title: "Created"                
        }            
    ]
});

In summary:

  • When I make changes to the grid on my PC, a colleague in Germany cannot see the change I just made. However, if I make a change on my PC and have the grid open in a second window, I can see the update happen.
  • I'm not convinced that the grid always makes a successful connection and thus is not subscribed to the hub to see any changes, which means the user has to refresh their screen to see anything happen.

Can anyone help with this, I'm tearing my hair out and I can't seem to pin down if it's simply a configuration issue or my application has got a bug.

Any help is appreciated

Yanayaya
  • 2,044
  • 5
  • 30
  • 67
  • Are you "registering" the clients to listen to the group? e.g. in the sample source code for the grid demo, https://github.com/telerik/kendo-ui-demos-service/blob/master/signalr-hubs/signalr-for-aspnet-core/Hubs/ProductHub.cs, the OnConnectedAsync() method does this via Groups.AddToGroupAsync(Context.ConnectionId, GetGroupName()); In my usage(not grid, just regular Signalr) I have a line in my javascript to do this when the page is loaded, e.g. hub.server.join([The GroupID]) – The Dread Pirate Stephen Dec 09 '21 at 16:53

0 Answers0