Unable to connect with SignalR with any available transports. Error 404 "No Connection with that ID"

[mustafajavid]

Problem

I have a react website in which I am trying to connect to SignalR hub on my .net core server via ocelot gateway.

I am unable to connect to hub and get a 404 error "No Connection with that ID". I have only one server instance running and no load balancer is involved.

Even though the negotiate call is always successful.

WebSocket and Server Sent Events are not working at all and on Long Polling, 404 is returned.

Network call logs are:

I have added all possible routes for ocelot. I am out of ideas on what to do now.

I have observed that the connectionId returned in response to the negotiate call is not used to connect to hub and instead the connectionToken value is used as the value for "id" query string parameter.

Specifications

• Ocelot Version: 15.0.6
• @microsoft/signalr Version: 5.0.1
• .Net Core: 3.1
• Platform: Windows

[joaopgrassi]

Not sure this is going to help you, but in our setup we have this:

SignalR service:

// Startup.cs > Configure
app.UseEndpoints(endpoints =>
{
    endpoints.MapHub<AppHub>("notify");
});

Then in ocelot, we have this route:

{
  "DownstreamPathTemplate": "/{everything}",
  "DownstreamScheme": "ws",
  "UpstreamPathTemplate": "/my-service/notifications/{everything}",
  "DownstreamHostAndPorts": [
  	{
  		"Host": "localhost",
  		"Port": 5036
  	}
  ],
  "UpstreamHttpMethod": [ "GET", "POST", "PUT", "DELETE", "OPTIONS" ],
},

Then, we connect from our front-end app like this (in typescript..)

import * as signalR from '@microsoft/signalr';

this.hubConnection = new signalR.HubConnectionBuilder()
	.configureLogging(signalR.LogLevel.Information)
	.withUrl(".../my-service/notifications/notify")
	.withAutomaticReconnect([0, 3000, 5000, 10000, 15000, 30000])
	.build();

And about this:

I have observed that the connectionId returned in response to the negotiate call is not used to connect to hub and instead the connectionToken value is used as the value for "id" query string parameter.

AFAIK that is how it should be. If you, for example, look at the sample app here
https://docs.microsoft.com/en-us/aspnet/core/tutorials/signalr-typescript-webpack?view=aspnetcore-5.0&tabs=visual-studio

The value sent on hub?id= is the connectionToken returned from the negotiate call. It seems it's some error with your re-routes really.

Also, make sure you don't have any other routes that are selected first. Ocelot looks at them in order they are defined, so if a same route is defined first that is going to fail.

Another thing, maybe to check is when you run your SignalR service, do you have ports for http and https? Are those correctly configured in the routes in Ocelot?

And finally, remember to add app.UseWebSockets() in your Ocelot service: https://ocelot.readthedocs.io/en/latest/features/websockets.html#signalr

[raman-m]

Great instructions! Thanks!

[raman-m]

MS Learn | ASP.NET Core

• Tutorial: Get started with ASP.NET Core SignalR using TypeScript and Webpack

[Kation]

Ccheck your signalr response time with /hub/negotiate
Make sure it response less than 5 secs.

[quoctienkt]

I have the same issue, but it should be issue of signalR-self (SevertSentEvent transport issue)

[Magnona]

i have the same issue, did anyone found solution for this error?

[quoctienkt]

i have the same issue, did anyone found solution for this error?

I figured it out

• browser limits concurrent connection to lower than 6, so you will need to: use websocket for signalr transportation or enable http/2 or http/3 from your application and hosting

[raman-m]

Interesting...
Are you expert with SignalR?

[mhmoudalaskalany]

i set up most of the configuration here and i was receiving error as 1006
i figured out that i am missing to add CONNECT in the up stream method , seems the signalr package in angular is using this verb

These are my config in the gateway routes

{
   "UpstreamHttpMethod": [ "GET", "POST", "PUT", "DELETE", "OPTIONS", "CONNECT" ],
   "UpstreamPathTemplate": "/ptmapi/hubs/{catchAll}",
   "DownstreamPathTemplate": "/hubs/{catchAll}",
   "DownstreamScheme": "wss",
   "DownstreamHostAndPorts": [
     {
       "Host": "localhost",
       "Port": 5026
     }
   ],
   "DangerousAcceptAnyServerCertificateValidator": true
}

[raman-m]

Thanks for your user scenario!