chat-app-react-redux-saga-websockets
chat-app-react-redux-saga-websockets copied to clipboard
flaviocopes
Websocket not connecting
After cloning the repo, and assigning my IP and port (in .../src/sockets/index.js), cannot get rid of the below error:
uncaught at handleNewMessage
at takeEvery
at
Error: Failed to execute 'send' on 'WebSocket': Still in CONNECTING state.
I fixed mine putting inside an express server, like this. Hopefully is useful for anyone having this problem:
const express = require('express');
const WebSocket = require('ws');
const app = express();
const server = require('http').createServer(app);
const wss = new WebSocket.Server({ server });
const users = [];
const broadcast = (data, ws) => {
wss.clients.forEach((client) => {
if (client.readyState === WebSocket.OPEN && client !== ws) {
client.send(JSON.stringify(data));
}
});
};
wss.on('connection', (ws) => {
let index;
ws.on('message', (message) => {
const data = JSON.parse(message);
switch (data.type) {
case 'ADD_USER': {
index = users.length;
users.push({ name: data.name, id: index + 1 });
ws.send(
JSON.stringify({
type: 'USERS_LIST',
users,
}),
);
broadcast(
{
type: 'USERS_LIST',
users,
},
ws,
);
break;
}
case 'ADD_MESSAGE': {
broadcast(
{
type: 'ADD_MESSAGE',
message: data.message,
author: data.author,
},
ws,
);
break;
}
default:
break;
}
});
ws.on('close', () => {
users.splice(index, 1);
broadcast(
{
type: 'USERS_LIST',
users,
},
ws,
);
});
});
server.listen(8989);
and in your client socket file you put const socket = new WebSocket('ws://localhost:8989');
Cheers!
just sharing this in case it helps [re- similar questions in other 2 issues] -
i found at tail end of this video - https://www.youtube.com/watch?v=x_fHXt9V3zQ we need to cd into the /server directory and type node app.js to start the socket server [separate from npm start in the main directory /starting the app]
Ed.
Hi, I am facing the same issue. I tried to solve it but now workig
any help will be appriciated...
index.js:2177 uncaught at handleNewMessage
at takeEvery
at
Error: Failed to execute 'send' on 'WebSocket': Still in CONNECTING state.
at http://localhost:3000/static/js/bundle.js:53689:21
at createTaskIterator (http://localhost:3000/static/js/bundle.js:43455:17)
at runForkEffect (http://localhost:3000/static/js/bundle.js:43849:24)
at runEffect (http://localhost:3000/static/js/bundle.js:43734:872)
at next (http://localhost:3000/static/js/bundle.js:43615:9)
at currCb (http://localhost:3000/static/js/bundle.js:43687:7)
at takeCb (http://localhost:3000/static/js/bundle.js:43765:152)
at Object.put (http://localhost:3000/static/js/bundle.js:42759:16)
at http://localhost:3000/static/js/bundle.js:42847:10
at http://localhost:3000/static/js/bundle.js:42872:16
at exec (http://localhost:3000/static/js/bundle.js:44427:5)
at flush (http://localhost:3000/static/js/bundle.js:44468:5)
at asap (http://localhost:3000/static/js/bundle.js:44441:5)
at Array.
index.js:8 WebSocket connection to 'ws://104.125.50.52:7778/' failed: Error during WebSocket handshake: Unexpected response code: 503
