I'm trying to test out gRPC streaming in my react app. Although I'm having some troubles. We've tested our streaming in bloom and it successfully streams an event every 2 seconds up to 8 streams.
However when I try it out in my React Application the stream starts, then nothing happens for quite some time (around about equal to the time it takes to finish streaming all the data), then it only logs out all the data at once.
This is how I have my component set up:
const MyComponent = () => {
const startStream = () => {
console.log('stream start')
const streamer = myService.testStreaming(new Empty(), {})
streamer.on('error', err => console.log({ err }))
streamer.on('status', status => console.log({ status }))
streamer.on('data', response => console.log(response.toObject()))
streamer.on('end', () => console.log('stream end'))
}
useEffect(() => {
startStream()
}, [])
return null
}
As mentioned above, my output is stream start
wait +- 15 seconds then 8 lines of responses
.
As mentioned, in bloom it successfully sends through a new stream every 2 seconds as expected. Unlike in my React app where it just waits a long time and then triggers the on data
callback 8 times immediately.
In my Network Tab, the StreamEvents is jsut in a pending start for +- 15 seconds as well.