I've a reactive streaming api built on spring 5 webflux running on netty server with the following syntax -
@RequestMapping(path = "/customer/messages/stream", method = RequestMethod.POST, produces = MediaType.APPLICATION_STREAM_JSON_VALUE)
public Flux<Messages> fetchAllMessagesForCustomer(@RequestBody CustomerRequest)
Now to consume this from my react-native app, I tried using fetch Api but it didn't work because of react-native issue. So I tried with good old xhr
xhr.onreadystatechange = function() {
console.log("state change.. state: "+ xhr.readyState);
if(xhr.readyState == 3) {
var newData = xhr.response.substr(xhr.seenBytes);
console.log("newData", newData);
xhr.seenBytes = xhr.responseText.length;
}
};
This works to some extent but with the following issues
- Response consumption is not sync with publishing streams and most of the times multiple streams get combined and thrown to the client.
xhr.responseText
essentially appends all the streams and keeps growing bigger which seems like an anti-pattern as the whole idea was to break down huge responses into smaller chunks and consume them individually.
Is there any good alternative to handle the streaming response in react-native ? Suggestions are welcome.