websocket onmessage is not firing after connection established in 0.68.0

[amitsri007]

Description

I have developed an application using React-native@0.64.3 and react-native-websocket@^1.0.2, everything was working fine in both android and iOS, but after upgrading to the react-native version to 0.68.1, WebSocket onMessage stopped firing in android after the connection got established.

Version

0.65.0 onwards

Output of npx react-native info

System:
OS: macOS 12.3.1
CPU: (4) x64 Intel(R) Core(TM) i5-5350U CPU @ 1.80GHz
Memory: 144.39 MB / 8.00 GB
Shell: 5.8 - /bin/zsh
Binaries:
Node: 17.8.0 - /usr/local/bin/node
Yarn: 1.22.17 - /usr/local/bin/yarn
npm: 8.8.0 - /usr/local/bin/npm
Watchman: 2022.03.21.00 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.11.3 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 21.4, iOS 15.4, macOS 12.3, tvOS 15.4, watchOS 8.5
Android SDK:
API Levels: 28, 29, 30, 31
Build Tools: 28.0.3, 29.0.2, 30.0.2, 30.0.3, 31.0.0
Android NDK: Not Found
IDEs:
Android Studio: 2021.1 AI-211.7628.21.2111.8309675
Xcode: 13.3.1/13E500a - /usr/bin/xcodebuild
Languages:
Java: 11.0.11 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 18.1.0 => 18.1.0
react-native: ^0.68.1 => 0.68.1
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

1. npx react-native init websocketTest
2. yarn add react-native-websocket
3. in app.js

import React from 'react';
import {
SafeAreaView,
StyleSheet,
} from 'react-native';

import WS from 'react-native-websocket';

const socketRef = React.createRef(null);

const App = () => {
return (

<WS
ref={socketRef}
url="wss://yourwebsocketurl" //Need to replace with your webservice which will trigger onmessge just after connection got established.
onOpen={() => {
console.log('Open!')
}}
onMessage={(event) => { console.log("onMessage", event) }}
onError={console.log}
onClose={console.log}
// reconnect // Will try to reconnect onClose
/>

</SafeAreaView>

);
};

4. Run the app on an Android device directly.

Snack, code example, screenshot, or link to a repository

No response

[empawlo]

Got the same issue here with native websocket (not react-native-websocket). Tried to customize server-side header of the response (heard something about "Sec-WebSocket-Extensions: permessage-deflate") without any results. Because onmessage-handler also failed after downgrading to react-native@0.64.3/react@17.0.1 we took a look into our server-side implementation which is websocket-sharp. When ignoring extensions that the client requests (https://github.com/sta/websocket-sharp#ignoring-the-extensions=) everything works fine. This may helps someone.

[amitsri007]

Thanks, @empawlo We make it work using the following

System:
OS: macOS 12.3.1
CPU: (4) x64 Intel(R) Core(TM) i5-5350U CPU @ 1.80GHz
Memory: 51.33 MB / 8.00 GB
Shell: 5.8 - /bin/zsh
Binaries:
Node: 17.8.0 - /usr/local/bin/node
Yarn: 1.22.18 - ~/.yarn/bin/yarn
npm: 8.8.0 - /usr/local/bin/npm
Watchman: 2022.03.21.00 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.11.3 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5
Android SDK:
API Levels: 28, 29, 30, 31, 32
Build Tools: 28.0.3, 29.0.2, 30.0.2, 30.0.3, 31.0.0
Android NDK: Not Found
IDEs:
Android Studio: 2021.2 AI-212.5712.43.2112.8512546
Xcode: 13.4/13F17a - /usr/bin/xcodebuild
Languages:
Java: 11.0.12 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 17.0.1 => 17.0.1
react-native: 0.64.2 => 0.64.3
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

[ax88]

Still not working with react-native 0.70 and 0.71