I am using WebSocket with React Native and have some problems. When I update the application, I found that the previous connection to WebSocket (used before the update) was still alive and did not close properly. Each time I restarted the application, it created a new connection. Then I end the application, it releases all the connections together.
When I test almost the same code with the browser, when I refresh the page, the socket automatically closes and creates a new Websocket when the page loads.
If this problem still exists in the production environment, it can be very important.
This is the server side code (I used express-ws):
const sockets = {};
app.ws('/', (socket, req) => {
// Generate unique id to socket and save to socket list
const uid = uuid.v4();
socket.uid = uid;
console.log(`Socket ${uid} connected.`);
sockets[uid] = socket;
socket.on('message', (data) => {
broadcast(data);
});
socket.on('close', () => {
console.log(`Socket ${uid} disconnected.`);
delete sockets[uid];
broadcast({
type: 'plain',
message: `User ${socket.username} leaved the channel.`
});
socket = null; // make sure to remove socket
});
});
WebSocket . , Socket, , -, ( node -uuid):
Socket d0b62d3a-2ed9-4258-9d2d-e83a3eb99e6c disconnected.
, -, . .
React Native . , , , :
Socket d0b62d3a-2ed9-4258-9d2d-e83a3eb99e6c disconnected.
Socket 2e1a2bba-ac64-4368-aeca-a02721f28ce5 disconnected.
Socket 6673c9a3-9667-425a-8923-efbc40196226 disconnected.
Socket 08fee145-e9bf-4af0-a245-dda2fe6a8e56 disconnected.
Socket 55ce1926-d7fa-488b-92d9-ff3dea874496 disconnected.
Socket 9c4c166d-d6d6-4a11-b400-a3eac51ab91f disconnected.
Socket 9f6db512-649c-440e-8b88-9a77d20e1943 disconnected.
Socket a9e6c0bd-419c-40af-865a-2573eca26a0f disconnected.
Socket 70835c7a-3230-4e20-b133-b6c2942dff22 disconnected.
Socket 5c83d81c-c0f1-4b9a-b5fb-7f09430a2f09 disconnected.
Socket 4f11aea4-d0ad-4e2b-9613-9e994657ecaf disconnected.
, WebSocket React Native.
import store from './store';
import * as ChatActions from './actions/Chat';
import * as NetworkActions from './actions/Network';
const socket = null;
export function init() {
socket = new WebSocket('ws://mywebsite.com:3300');
socket.onopen = () => {
store.dispatch({
type: NetworkActions.NETWORK_SOCK_CONNECTED,
data: {}
});
};
socket.onmessage = (e) => {
var data = e.data;
try {
data = JSON.parse(e.data);
}
catch(err) {}
store.dispatch({
type: ChatActions.CHAT_RECV,
data: data.message
});
};
socket.onclose = (e) => {
store.dispatch({
type: NetworkActions.NETWORK_SOCK_CLOSED,
data: {}
});
};
}
export function send(data) {
data = typeof data === 'object' ? JSON.stringify(data) : data;
socket.send(data);
}
, , - , , . React Native google, . !
P.S. , Android .