Error: Failed to invoke 'JoinGroup' due to an error on the server

Question

We're attempting to use Azure SignalR (with managed identities) with an Angular front end and ASP.net Core back end. For a particular method call I'll see the following error about 50% of the time:

Error: Failed to invoke 'JoinGroup' due to an error on the server.

We're supplying an object with 3 properties to the JoinGroup function. From the Angular application this looks like the following:

const url = 'some url';

const options: IHttpConnectionOptions = {
   accessTokenFactory: async () =>  await service.getToken(),
   transport: HttpTransportType.WebSockets,
   withCredentials: false
};

const hub = new HubConnectionBuilder()
      .withUrl(url, options)
      .configureLogging(LogLevel.Debug)
      .withAutomaticReconnect()
      .build();

await hub.start();

// This is the call that fails about 50% of the time.
const msg = await this.hub.invoke<string>('JoinGroup', {
    organizationId: '1bf751e8-67cd-4fb0-89cc-206c31371ac1',
    environmentId: '02a03e43-839b-4f71-88b1-d809d26a0499',
    recoveryPlanId: '9c18d9b7-a58f-4f8f-8c46-aedc996dc304'
});

From the ASP.net core application our hub looks like the following:

public async Task<string> JoinGroup(RecoveryGroupName group)
{
    await Groups.AddToGroupAsync(Context.ConnectionId, group.ToString());
    return "You've joined a group!";
}

And the RecoveryGroupName looks like the following:

public record RecoveryGroupName
{
    public required Guid OrganizationId { get; init; }
    public required Guid EnvironmentId { get; init; }
    public required Guid RecoveryPlanId { get; init; }

    // Right now I'm just creating a new string here each time ToString is called.
    // Once I get this bloody this working I'll fix it.
    public override string ToString() 
        => $"{OrganizationId}_{EnvironmentId}_{RecoveryPlanId}";
}

I can't figure out why this is happening!! I don't see any errors from the server (nothing in the logs or console when running locally).

I've set EnableDetailedErrors to true but that made no difference.

builder.Services
    .AddSignalR(opt => opt.EnableDetailedErrors = true)
    .AddAzureSignalR(option => /* Setting up connection string etc */);

All I see in the browser is the following:

Am I doing something wrong here? How can I troubleshoot this? There are no error messages!

One thing I've noticed is if I set ServerStickyMode to Required I don't see the issue:

builder.Services
    .AddSignalR(opt =>
    {
        opt.EnableDetailedErrors = true;
       
    })
    .AddAzureSignalR(option =>
    {
        option.ServerStickyMode = ServerStickyMode.Required;
        option.Endpoints =
        [
          new ServiceEndpoint(new Uri("ourUrl"), tokenCredential)
        ];
    })

Why does this appear to fix my issue? I didn't think we needed sticky sessions since we're using Azure SignalR..

Update:

I've enabled additional server side logging via:

"Microsoft.AspNetCore.SignalR": "Debug",
"Microsoft.AspNetCore.Http.Connections": "Debug"

But this doesn't show any errors even when I recreate the error. All I see is the following additional logging:

[10:36:52 DBG] OnConnectedAsync started. [10:36:52 DBG] Found protocol implementation for requested protocol: json. [10:36:52 DBG] Completed connection handshake. Using HubProtocol 'json'. [10:36:52 INF] SignalR client XFxkllJJ3TX7P9bhhN1eBQfLK5oAY02 connected [10:36:53 DBG] Received hub invocation: InvocationMessage { InvocationId: "0", Target: "JoinGroup", Arguments: [ 5ec7ee49-6153-0862-189d-4ee6b5713fd8_294a4a76-f9f8-4f91-3522-08dc9ad378bc_df61c54d-c80c-4ab0-c990-08dcd1aa483c ], StreamIds: [ ] }.

I've also enabled the trace tool but again this doesn't show any errors..