We are building a user interface that allows users to query our data en masse. The return format is CSV and there is a decent amount of processing to perform. This processing is done in parallel, then sets of lines are returned to the user interface.
An AJAX POST request is sent to the server, it waits for all data to be entered and then uses
createObjectURL to trigger a download. The problem is that the request may take several minutes and the user sees a rotating indicator indicating that its request is in progress.
It's a bad experience that the user can not see any further progress and has no idea if his request is being processed or how long it will take.
For the browser to download the file during streaming to the client.
Use a GET request or form. The problem is twofold: (1) The data of the request can be nested and of variable length. It does not seem right to have to parse a query string on the backend. (2) It seems like this causes a page reload, which kills the state of the React application.
Instead of downloading the file continuously to the client, we can add a progress bar. To be that, we could add a header to the answer indicating the number of pieces expected, then increment it upon receipt of each piece. The disadvantage of this approach is that the user can not cancel the request and can not retrieve partial results.
I have the impression of missing a much better solution to this problem. Do not hesitate to dispute the above assumptions. My main goal is to get a clean solution offering a good user experience.
The backend is a C # web application, React is used in front-end, and it is possible to navigate through a PHP layer if it could help.