Events not received when using server-side streaming RPC with React Native for Windows (with mode=grpcwebtext)

[IamJignesh]

Hi There!

I am facing similar issues as this one #1345

I am using exactly the same setup as #1345 where we are using grpc-web with React Native Windows for my client and ASP.NET + Grpc.AspNetCore.Web package for my server.

As mentioned earlier unary calls works, yet when we try to use server-side streaming RPC, we receive no events.
If the server ends the connection, every events from the beginning of the connection are raised all at once.

We are using mode=grpcwebtext The generated proto files can be found here https://github.com/IamJignesh/PizzaAppWindows/blob/feature/serverside-streaming/protos/tswebText/GreetServiceClientPb.ts

In fact we have tried to generate the client with different formats and none of them seems to work all of the them can be found below:
https://github.com/IamJignesh/PizzaAppWindows/tree/feature/serverside-streaming/protos

• Grpc Server code: https://github.com/IamJignesh/PizzaAppWindows/tree/feature/serverside-streaming/windows/GrpcWebDemo
• Client code: https://github.com/IamJignesh/PizzaAppWindows/blob/feature/serverside-streaming/App.tsx

The Grpc client is generate by running the following command:
protoc -I=. greet.proto --js_out=import_style=commonjs,binary:. --grpc-web_out=import_style=typescript,mode=grpcwebText:.

We have been struggling with this for days so any help on this would be much appreciated!

[sampajano]

@IamJignesh Hihi thanks for reaching out :)

Is this server running on the same machine as the client? I'm asking because there's a potential of buffering proxies buffering the responses, and hence the response doesn't come as streaming happens, but only when streaming ends.

Could you try with the echo example to see if streaming works on your machine?
https://github.com/grpc/grpc-web?tab=readme-ov-file#advanced-demo-browser-echo-app

And that works for you, then you could try comparing the streaming response (e.g. inspecting the chrome networking log) to observe any difference in behavior between the example and your setup. This could allow you to narrow down if it's a client issue, or a server issue. And then we can diagnose further.

Hope that helps :)

[IamJignesh]

Hi @sampajano thank you so much for responding you my query.

Yes, server is running on the same machine as the client! And yes serverside streaming is working on my machine in the Browser using Grpc-Web, Here is a quick demo I created showing the working of serverside streaming:
https://www.loom.com/share/d84f41fbd250405aae69bf0ed6d6e597?sid=876c0e14-b481-4fb0-b9a6-8af4c916687e

This is not the same example as you mentioned above, but it shows that I am able to receive response from the server via a stream. The process shown in the example is:

When the initial page loads in the browser:

• The app connect to a stream
• When the user clicks the update user button, it make a unary call to the server passing in a username
• The server then write on the stream the Hello {username} and the timestamp
• The app displays the response received on the stream to the user

As you can see in the Network inspector I am not able to see any streaming response received from the Server, the only response we see in the network inspector is the Unary call we make to the server to pass the username!

Is there any way I can see/debug the streaming traffic?

I will run the example you mentioned above and see if the traffic is different, I already had an existing example running, so I though I will share it here.

Many thanks again for looking into this 😃

[sampajano]

@IamJignesh Hi! Thanks for the detailed information! You're very welcome :)

Oh i see.. so it works for you in the Browser, but not in "React Native Windows" — is that the main issue here?

Is there any way I can see/debug the streaming traffic?

I'm not familiar with React Native Windows so you might have to look it up.. (I asked ChatGPT and it mentioned ways like React Native Debugger and things like Charles Proxy, among many other options :))

I will run the example you mentioned above and see if the traffic is different, I already had an existing example running, so I though I will share it here.

aha ok. Yeah i mean since you ALREADY has a working streaming example, i think comparing the streaming response in Browser v.s. React Native Windows would probably be your next best bet.

(although i'm seeing a lot of individual requests in your demo video, so i'm not sure how are they related to streaming :))

I will convert this thread to a discussion since Reactive Native for Windows is not really a officially supported use case.. (but i mean if you could get it to work it's cool too :))

Hope that helps :)