Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Text streaming not working on Android #13

Open
elisealix22 opened this issue Dec 15, 2022 · 9 comments
Open

Text streaming not working on Android #13

elisealix22 opened this issue Dec 15, 2022 · 9 comments
Labels
bug Something isn't working

Comments

@elisealix22
Copy link

First of all, thank you so much for providing this repo ❤️ . We use streams for our subscribe requests and I was able to integrate with your project in order to get streaming working on iOS. However, I'm still running into an issue where Android is behaving as it did before the web stream polyfill. I can see the subscribe request come through, but it just hangs and no data ever comes through.

I have a working demo here where the stream is fully functional on iOS but not on Android: xmtp/example-chat-react-native#8.

To reproduce, you can run the app & press Generate address. Then press Send gm. That should trigger a message to come through the stream. If you have a chance to take a look, I'm so curious what could be causing Android specifically to have trouble here.

JS env: Hermes
RN version: 0.71
All polyfills should be included as well in .polyfills.js

@elisealix22
Copy link
Author

@acostalima tagging just so this doesn't get lost in the sea of notifications. I think we'll recommend a polling solution on our end for the time being but would love a quick glance if you get a chance!

@acostalima
Copy link
Collaborator

Thanks for reaching out @elisealix22.
I'm afraid I won't be able to address this in the short term. Furthermore, I haven't worked with RN since v0.64.

I haven't tested streaming against Hermes at the time. Does it work in JavaScriptCore, even on RN v0.71?
Did you check the changelogs of RN v0.64-0.71 to see if there were any changes to the Networking API?

@elisealix22
Copy link
Author

Thank you so much for the response! This is excellent context. I'll give JSC a shot and check out the RN networking diff as I haven't tried either yet!

@acostalima acostalima added the bug Something isn't working label Dec 20, 2022
@fa2id
Copy link

fa2id commented Feb 22, 2023

@elisealix22 Hey, did you try this with the latest versions of RN? Is it working on iOS and Android? Thank you!

@a289459798
Copy link

0.71.7 same

@alessbell
Copy link

alessbell commented Sep 1, 2023

After doing a bit of investigating I've opened an issue for this over on the RN repo: facebook/react-native#39260

Edit: this doesn't actually appear to be related (but probably still a bug) 😅

@Raythode
Copy link

Raythode commented Sep 1, 2023

Hey guys, @alessbell The fetch works for Android but in release mode. To make it work on development mode do the following things. Cannot take full credit for this but I found this from here

Solution 1:

go to android/app/src/debug/java/com//ReactNativeFlipper.java
comment NetworkFlipperPlugin like this:
client.addPlugin(CrashReporterPlugin.getInstance());

// todo commented because of this issue binaryminds/react-native-sse#3 facebook/flipper#2495
// NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
// NetworkingModule.setCustomClientBuilder(
// new NetworkingModule.CustomClientBuilder() {
// @OverRide
// public void apply(OkHttpClient.Builder builder) {
// builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
// }
// });
// client.addPlugin(networkFlipperPlugin);
client.start();

Solution 2:

If you don't want to comment the NetworkFlipperPlugin.

This bug happen only in debug, so instead of running:

react-native run-android You have to run:
react-native run-android --variant=release Or simply change it in your package.json
{
// ...
"scripts": {
"android": "react-native run-android --variant=release", // here
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint . --ext .js,.jsx,.ts,.tsx"
},
// ...
}

D4ryl00 added a commit to gnolang/gnonative that referenced this issue Oct 24, 2023
This PR adds the `stream` function to the React-Native gRPC transport.
Because the `fetch` API is not fully implemented in React-Native (see
issue [here](facebook/react-native#27741)), I
had to polyfill the missing `fetch` function (package
[here](https://github.com/react-native-community/fetch)) and replaced
some functions in the global namespace (see
[here](https://github.com/acostalima/react-native-polyfill-globals)).

On Android, text-streaming doesn't work out-of-the-box on the `debug`
variant. One solution is to comment the `NetworkFlipperPlugin` (see
[here](react-native-community/fetch#13 (comment))).
Because we don't use it for the moment, I commented that plugin.

I added a `HelloStream` API function to test the stream feature.
We can call it in Reac-Native by doing this:
```typescript
for await (const res of clientInstance.helloStream(new HelloStreamRequest({ name: 'd4ryl00' }))) {
  console.log(res.greeting);
}
```

Signed-off-by: D4ryl00 <[email protected]>
@AkbarBakhshi
Copy link

// todo commented because of this issue binaryminds/react-native-sse#3 facebook/flipper#2495

@Raythode Thanks for the solutions. I commented NetworkFlipperPlugin as you mentioned in solution 1 and it worked. Follow-up question though: do I need to uncomment those for production? it seems like the fetch streaming should work for the release version according to your comment.

@Raythode
Copy link

Raythode commented Feb 20, 2024

@AkbarBakhshi yes, it should work as expected in release/prod. No need to comment.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

7 participants