I want to implement a SignalR Client in react.
I have a aspnet api wich provides SignalR Hub. With a C# SignalR Client i can connect with the hub and send+ receive messages. So it seems that the SignalR Service and CORS are correct.
But when i want to connect with react i get following error:
Debug: HubConnection failed to start successfully because of error 'Error: Unable to connect
to the server with any of the available transports.
WebSockets failed:
Error: 'WebSockets' is disabled by the client.
ServerSentEvents failed: Error: 'ServerSentEvents' is disabled by the client.
LongPolling failed: Error: 'LongPolling' is disabled by the client.'.
My react code:
import { HubConnectionBuilder,LogLevel,HttpTransportType } from '@microsoft/signalr';
import { getUserAccessToken } from '../auth/UserManager';
export function ConnectToSignalR(){
return new HubConnectionBuilder()
.withUrl('https://localhost:18198/IIT/messagehub',options=> {
options.skipNegotiation=false;
options.transport = HttpTransportType.WebSockets;
options.accessTokenFactory = ()=>getUserAccessToken();
return options;})
.withAutomaticReconnect()
.configureLogging(LogLevel.Trace)
.build();
}
export function startSignalRConnection(signalRConnection){
if (signalRConnection) {
signalRConnection.start()
.then(result => {
console.log('SingnalR','Connected!');
signalRConnection.on('TimeWarningMessage', message => {
console.log(message);
});
})
.catch(e => console.log('SingalR Connection failed: ', e));
}
}
Code is called in App.js (main component) of react app via useEffect hook once application starts.
What is ment by ‘ is disabled by the client’?
Is there a way those things can be disabled?
Browser i tested ist current version of Edge and Chrome, bothhave same issue.
Version of react package is 8.0.7 and in Backend on asp net core side, i am using NET8