Using SignalR with BFF and Angular app

[Maxmyd]

Hi,
I'm mapping remote endpoints from the BFF appsettings.json

"Apis": [
      ...
      {
        "LocalPath": "/notificationHub",
        "RemoteUrl": "https://localhost:5170/notificationHub", --this is my hub endpoint, located in remote API
        "RequiredToken": "User",
        "AllowAnonymous": true
      }
    ]

if (config.Apis.Any())
{
    foreach (var api in config.Apis)
    {
        if (api.AllowAnonymous)
        {
            app.MapRemoteBffApiEndpoint(api.LocalPath, api.RemoteUrl!)
                .WithOptionalUserAccessToken();
        }
        else
        {
            app.MapRemoteBffApiEndpoint(api.LocalPath, api.RemoteUrl!)
                .RequireAccessToken(api.RequiredToken);
        }
    }
}

This should set /notificationHub endpoint to not require an authenticated user.

Here is the proxy.conf section in my Angular app

 "/notificationHub": {
     "target": "https://localhost:7082", -- this is the BFF API endpoint
     "secure": false,
     "ws": true
   }

and connect like this

 private startConnection() {

    this.hubConnection = new signalR.HubConnectionBuilder()
      .withUrl('/notificationHub', {
        headers: { "x-csrf": "1"}
      })
      .withAutomaticReconnect()
      .build();

    this.hubConnection
      .start()
      .catch(err => console.error('SignalR Connection Error:', err));
    this.hubConnection.on('ReceiveMessage', (data) => {
      this.zone.run(() => {
        this.messageSubject.next(data);
        console.log('SignalR message:', data)
      });
    });
  }

So I start the application and this is what I see in console output:

As you can see, I get error 401 and still have the message received. I think I should have the message received because my hub endpoint doesn't require authentication. But 401 error a bit confuses me. Can you please clarify this moment to me? Which is the correct way of setting up all these?
Thank you.

[maartenba]

It looks like you are using websockets transport here with SignalR. BFF currently does not come with support for websockets, only HTTP. You could attempt to disable websockets here?

I will however take this up with the engineering team and see if there is anything we can do around websockets and SignalR.

[Maxmyd]

Hi,
Yes please, let me know if there are any plans to implement websockets support. I have a workaround with direct connection between frontend and my remote API, but it's a bit complicated to set up authorization workflow as frontend doesn't have a token to sign a request.