1

When I try to connect a React client app I got 403 error Forbidden for https://<domain of Azure SignalR>/SignalRTestHub and 503 Service Temporarily Unavailable for

https://<IP of Azure SignalR>/SignalRTestHub.

But when the backend application connects then everything works fine. Whats going on with front-end ? Code exmple:

Asp.net core
app.UseEndpoints(endpoints =>
{
    endpoints.MapHub<SignalRTestHub>("/SignalRTestHub");
    endpoints.MapControllers();
});
services.AddSignalR()
    .AddAzureSignalR("ConnectionString");
[Authorize]
public class SignalRTestHub : Hub
{ }

React

const newConnection = new HubConnectionBuilder()
   .withUrl(`https://<DNS of Azure SignalR>/signalrtesthub`, {
       skipNegotiation: true,
       transport: HttpTransportType.WebSockets,
       accessTokenFactory: () => "token"
   })
   .configureLogging(LogLevel.Error)
   .withAutomaticReconnect()
   .build();
Vladyslav Furdak
  • 1,765
  • 2
  • 22
  • 46

1 Answers1

0

you should use your app servers address in your client code, like following:

const newConnection = new HubConnectionBuilder()
   .withUrl(`https://<your app server>/signalrtesthub`, {
       skipNegotiation: false,
       transport: HttpTransportType.WebSockets,
       accessTokenFactory: () => "token"
   })
   .configureLogging(LogLevel.Error)
   .withAutomaticReconnect()
   .build();

if you want to skip negotiation:

  • Let clients know the service key, then them can generate the JWT token by themselves, but its a bad idea for security.

  • Clients request another API to fetch the JWT token from your app server.

    const newConnection = new HubConnectionBuilder()
   .withUrl(`https://<DNS of Azure SignalR>/client?hubs=signalrtesthub`, {
       skipNegotiation: true,
       transport: HttpTransportType.WebSockets,
       accessTokenFactory: () => "<token>"
   })
   .configureLogging(LogLevel.Error)
   .withAutomaticReconnect()
   .build();
vwxyzh
  • 17
  • 2