React Native socket.io websocket can't connect if connection drops once

626 views Asked by At

I am using React Native (0.63.4) and socket.io client (2.4.0) to connect to my socket.io server:

 socket = io(MESSENGER_URL, {
            path: "/messenger",
            timeout: 4500,
            forceNew: true,
            transports: ['websocket'],
            transportOptions: {
              polling: {
                extraHeaders: { 'authorization': "Bearer " + accessTokenSelector(store.getState())! }
              },
              websocket: {
                extraHeaders: { 'authorization': "Bearer " + accessTokenSelector(store.getState())! }
              }
            }
        });

Everything works fine and stable until connection intermittently drops. Once connection is dropped and Internet connection is established, socket.io gets into this infinite loop:

SocketRocket: In debug mode.  Allowing connection to any root cert
node_modules/react-native/Libraries/Utilities/RCTLog.js:47
Error: websocket error
    at WS.Transport.onError (/path/to/my/app/node_modules/engine.io-client/lib/transport.js:68:13)
    at WebSocket.ws.onerror (/path/to/my/app/node_modules/engine.io-client/lib/transports/websocket.js:163:10)
    at WebSocket.dispatchEvent (/path/to/my/app/node_modules/event-target-shim/dist/event-target-shim.js:818:35)
    at /path/to/my/app/node_modules/react-native/Libraries/WebSocket/WebSocket.js:260:14
    at RCTDeviceEventEmitter.emit (/path/to/my/app/node_modules/react-native/Libraries/vendor/emitter/EventEmitter.js:189:33)
    at MessageQueue.__callFunction (/path/to/my/app/node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:416:27)
    at /path/to/my/app/node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:109:12
    at MessageQueue.__guard (/path/to/my/app/node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:364:9)
    at MessageQueue.callFunctionReturnFlushedQueue (/path/to/my/app/node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:108:10)
    at /path/to/my/app/.vscode/.react/debuggerWorker.js:199:58 {type: 'TransportError', description: Event, stack: 'Error: websocket error
    at WS.Transport.on…/.vscode/.react/debuggerWorker.js:199:58', message: 'websocket error'}

I can't get it to connect unless I restart my app (hot reloading also doesn't help). I've tried both forceNew set true and false, doesn't make any difference. If I use polling transport instead of websocket the problem goes away (connection gets established and working successfully after disconnection/reconnection), but I want to use websockets.

What am I doing wrong? (I can't use v3.x as the server is on 2.x)

0

There are 0 answers