Signalr: Websockets connection issue - websocket

Our application uses SignalR and we have enabled the websockets in our applicaiton. Sometimes we are getting the below error in browser console window and during the same time the auto update is not working. After the relaunch it is started working.
Firefox:
"The connection to ws://xx.xx.xx.xx:xxxxx/signalr/connect?transport=webSockets&connectionToken=%2F54BwG4ui3MbJPK2t8DfS9AklLCtAEDQ1sHeAsZ6e3h2LVT0WYbbgGvCI2AlnsJf0AqY4AzMtp6FS0xl07td8kKFYhAmIEL4GjLCXP%2Bhlfy3k226j%2B4fXHVB8Vvblewc&connectionData=%5B%7B%22name%22%3A%22pushdatahub%22%7D%5D&tid=7 was interrupted while the page was loading."
Chrome:
jquery.signalR-1.0.0.min.js:10 WebSocket is already in CLOSING or CLOSED state.
Please refer below setup done on the server.
.Net framework 4.6.1 in the server.
websockets enabled in IIS/Application
httpruntime set in web.config
Server uses SignalR Hub
Sample client code:
$scope.isHubConnectionFailed = false;
$scope.connection = $.hubConnection(AppURL);
$scope.HubProxy = $scope.connection.createHubProxy(App.chatHub);
$scope.connection.start()
.done(function () {
$scope.isHubConnectionFailed = false;
})
.fail(function() {
$scope.isHubConnectionFailed = true;
});
var tryingToReconnect = false;
$scope.connection.reconnecting(function() {
tryingToReconnect = true;
});
$scope.connection.reconnected(function() {
tryingToReconnect = false;
$scope.isHubConnectionFailed = false;
});
$scope.connection.disconnected(function() {
if (tryingToReconnect) {
$scope.isHubConnectionFailed = true;
}
});
Anyone having the same issue?

Check the version of the browser your using.
Supported Platforms: http://www.asp.net/signalr/overview/getting-started/supported-platforms
There is an issue I found with signalr and azure, I am not sure if that is your situation but it might help to debug the issue. https://github.com/SignalR/SignalR/issues/2780

Related

Can't connect to web socket from Electron when using self signed cert

I have an Electron app which tries to connect to a device over a web socket. The connection is encrypted (i.e. wss) but the SSL certificate is self signed and thus, untrusted.
Connecting inside Chrome is ok and it works. However inside Electron I run into problems. Without putting any certificate-error handlers on the BrowserWindow or on the app I receive the following error in the console output:
WebSocket connection to 'wss://some_ip:50443/' failed: Error in connection establishment: net::ERR_CERT_AUTHORITY_INVALID
Then shortly after:
User is closing WAMP connection.... unreachable
In my code, to make the connection I run the following.
const connection = new autobahn.Connection({
realm: 'some_realm',
url: 'wss://some_ip:50443'
});
connection.onopen = (session, details) => {
console.log('* User is opening WAMP connection....', session, details);
};
connection.onclose = (reason, details) => {
console.log('* User is closing WAMP connection....', reason, details);
return true;
};
connection.open();
// alternatively, this also displays the same error
const socket = new WebSocket(`wss://some_ip:50443`);
socket.onopen = function (event) {
console.log(event);
};
socket.onclose = function (event) {
console.log(event);
};
NOTE: Autobahn is a Websocket library for connecting using the WAMP protocol to a socket server of some sort. (in my case, the device) The underlying protocol is wss. Underneath the code above, a native JS new WebSocket() is being called. In other words:
As I mentioned, I've tested this code in the browser window and it works. I've also built a smaller application to try and isolate the issue. Still no luck.
I have tried adding the following code to my main.js process script:
app.commandLine.appendSwitch('ignore-certificate-errors');
and
win.webContents.on('certificate-error', (event, url, error, certificate, callback) => {
// On certificate error we disable default behaviour (stop loading the page)
// and we then say "it is all fine - true" to the callback
event.preventDefault();
callback(true);
});
and
app.on('certificate-error', (event, webContents, link, error, certificate, callback) => {
// On certificate error we disable default behaviour (stop loading the page)
// and we then say "it is all fine - true" to the callback
event.preventDefault();
callback(true);
});
This changed the error to:
WebSocket connection to 'wss://some_ip:50443/' failed: WebSocket opening handshake was canceled
My understanding is that the 'certificate-error' handlers above should escape any SSL certificate errors and allow the application to proceed. However, they're not.
I've also tried adding the following to main.js:
win = new BrowserWindow({
webPreferences: {
nodeIntegration: true,
webSecurity: false
}
});
process.env.ELECTRON_DISABLE_SECURITY_WARNINGS = '1';
process.env.NODE_TLS_REJECT_UNAUTHORIZED = '0';
With Election, how do I properly deal with a certificate from an untrusted authority? i.e. a self signed cert.
Any help would be much appreciated.
I had the same problem , all i added was your line:
app.commandLine.appendSwitch('ignore-certificate-errors');
I use socket.io, but i think its the same principal.
I do however connect to the https protocol and not wss directly.
This is what my connection looks like on the page:
socket = io.connect(
'https://yoursocketserver:yourport', {
'socketpath',
secure: false,
transports: ['websocket']
});
That seems to have done the trick.
Thank you for the help :) i hope this answer helps you too.

InValid Frame header on Websocket using node.js

I get the following error in my chrome console.
websocket.js:111 WebSocket connection to 'ws://c7f2053b.ngrok.io/socket.io/?EIO=3&transport=websocket' failed: Invalid frame header
In my firefox i get this
The connection to ws://c7f2053b.ngrok.io/socket.io/?EIO=3&transport=websocket&sid=h1U3iQ9b3INSkg9xAAAC was interrupted while the page was loading.
Is there anyway to clear this issue please suggest me ...
Please check
1) Chrome and Firefox versions. Older versions might not have full support for WebSockets
What browsers support HTML5 WebSocket API?
2) Test Basic code :: Try with regular JavaScript Code first and see if connection is establishing:-
websocket = new WebSocket(URL);
websocket.onopen = function(evt) {
alert("Connected...");
websocket.send(message);
websocket.onmessage = function(evt) {
alert(evt.data);
};
websocket.onclose = function(evt) {
alert(evt.data);
};
websocket.onerror = function(evt) {
alert(evt.data);
};

Websocket client disconnects automatically after some time

I am using websockets in my laravel project. I have opened a port by PHP that is 8000 and it is working fine. I am connecting to the port by following in in view file:
function WebSocketInit()
{
if ("WebSocket" in window)
{
// Let us open a web socket
ws = new ReconnectingWebSocket("ws://xxx.xxx.xxx.xxx:8000");
}
else
{
// The browser doesn't support WebSocket
alert("WebSocket NOT supported by your Browser!");
}
}
WebSocketInit();
ws.onopen = function(){
console.log( "Connected." );
};
ws.onclose = function(){
ws.refresh();
console.log( "Disconnected." );
};
It connects well first time but if I refresh my page then it disconnects and do not re-connect most of the time. Sometimes, it connects but takes few seconds. Any help will be appreciated.
Thanks in advance!

Getting 'The ConnectionId is in the incorrect format' when hybrid app connect to SignalR Hub

I have done a lot of research online but can't find the solution. I have created a SignalR hub on the WebAPI backend and enabled the CORS feature.
I also have a client (Ionic) app try to connect to the SignalR hub for real-time chat. The problem is that when the Hybrid app tries to connect to the SignalR hub, I am getting
The ConnectionId is in the incorrect format.
I am getting OnDisconnected Event on the SignalR Hub BUT not the OnConnected Event!
This is my client code (ionic):
localhost:64965/signalr is my SignalR hub
SignalR Proxy also generated on localhost:64965/signalr/hubs
var signalr_chatHub = $.connection.ChatHub;
signalr_chatHub.client.welcomeMessage = function (message) {
console.log('WelcomeMessage', message);
};
$.connection.hub.url = "http://localhost:64965/signalr";
$.connection.hub.logging = true;
$.connection.hub.start().done(function () {
console.log('signal connection connected');
}).fail(function (err) {
console.log('Could not Connect!', err);
});
Chrome Console Errors:
public class ChatHub : Hub<IChat>
{
public override Task OnConnected()
{
var connectionId = Context.ConnectionId;
return base.OnConnected();
}
public override Task OnDisconnected(bool stopCalled)
{
var connectionId = Context.ConnectionId;
return base.OnDisconnected(stopCalled);
}
public override Task OnReconnected()
{
return base.OnReconnected();
}
public void WelcomeMessage()
{
Clients.All.NewMessage("Welcome");
}
}
Cordova by any chance?
The reason this happens is because ripple creates a "cross domain proxy", this grabs all generated uri's from signalR and incorrectly encodes parts.
fix is: set ripple, settings => cross domain proxy to "disabled"
below is an example of a proxied request, note the http%3a8080...:
http://localhost:4400/ripple/xhr_proxy?tinyhippos_apikey=ABC&tinyhippos_rurl=http%3A//localhost%3A8080/signalr/start%3Ftransport%3DwebSockets%26clientProtocol%3D1.5%26connectionToken%3DAQAAANCMnd8BFdERjHoAwE%252FCl%252BsBAAAA7b4HHv1ZFkq9Xe5qXnUfYwAAAAACAAAAAAAQZgAAAAEAACAAAACU%252BVDaQ6ENxgEPcm8Tjmr39SnBszhmBjUib5UoPoXKxgAAAAAOgAAAAAIAACAAAADoJqphu6%252BQ48B4d6J6QxbK%252FqKemI3%252FJiDfnCJRKtDMuDAAAACd3g9DsBiiG3CFNcDf0maC534kevbjNczDyFFCNSHeZB%252BNfX%252FkAXX74kYLEEUeqYNAAAAAvtEsnhNjbThhsJd0L7EN%252FNsTuK7M3ijALDGtP161hI2iobBj7%252FcItg%252FQmADPDOWlKIl7SgsRXU1dLXoOumpv%252Fw%253D%253D%26connectionData%3D%255B%257B%2522name%2522%253A%2522myhub%2522%257D%255D%26_%3D1494802918927
This bug took 5 hours of my life, damn them tiny hippos.

React Native Websocket Android not connecting to server

I'm trying to use React Native's built in Websocket support. I have this code:
var hostname = "192.168.X.XXX";
var port = "4567";
const webSocket = new WebSocket("ws://" + hostname + ":" + port + "/chat");
and I have this:
componentWillMount: function(){
console.log("MOUNTING CHAT COMPONENT");
webSocket.onopen = function(){
console.log("binding to chat room");
bindToChatRoom();
setTimeout(keepWebSocketOpen, 30000);
ws_connected = true;
};
webSocket.onmessage = function (msg) {
this.handleMsg(msg);
};
webSocket.onclose = function () {
console.log("WebSocket connection closed");
ws_connected = false;
};
webSocket.onerror = function (e){
//add some error handling -> DO THIS
console.log(e.message);
};
},
I'm running a local server using sparkjava, with this:
webSocket("/chat", ChatWebSocketHandler.class);
etc. I've tested the server, and I can connect to it (and send messages) both through both my web browser on my laptop AND on my phone with URL 192.168.x.xxx:4567/chat . However, when I run the react native app, I never see the console message "binding to chat room". Am I missing something? How come this websocket never opens?
Just want to note, I also tried connecting here:
ws://echo.websocket.org
which is described here:
http://www.websocket.org/echo.html
This is a known working websocket, so I know it's purely a react native issue...
Turns out that I had the line of code
const webSocket = new WebSocket("ws://echo.websocket.org");
in the wrong place. If you move it into componentWillMount, it works just fine.

Resources