I have a page where I use a form to initiate a file download. This is part of a Blazor WebAssembly project. This tecnique is used to pass some parameters to the API that generates the file to download.
This is the JS function I use to start the download:
function downloadFromPost(options) {
var form = document.createElement("form");
form.setAttribute("id", "frm-download");
form.setAttribute("method", "post");
form.setAttribute("style", "display: none;");
form.setAttribute("action", options.url);
var token = window.localStorage.getItem("authToken");
if (token != null) {
addHiddenField(form, "jwt", token);
}
delete options.url;
for (const property in options) {
addHiddenField(form, property, options[property]);
}
document.body.appendChild(form);
form.submit();
form.remove();
}
function addHiddenField(form, name, value) {
var hiddenField = document.createElement("input");
hiddenField.setAttribute("name", name);
hiddenField.setAttribute("value", value);
form.appendChild(hiddenField);
}
For those interested, this is called by a Blazor page, this way:
<button type="button" @onclick="Download">Download</button>
@code {
[Inject] IJSRuntime JSRuntime { get; set; }
private async Task Download()
{
await JSRuntime.InvokeVoidAsync("downloadFromPost", new { url = "api/mycontroller/download", param1, param2);
}
}
When the form is submitted it takes a while for the API function to extract data and start streaming the file.
During this time, Chrome shows the classic spinning wheel.
When actual download starts, the spinning wheel is replaced by the site icon and download progress is shown in the download bar.
I would like to show a "wait..." message on the page while download is being prepared, i.e. when Chrome shows its spinning wheel.
When actual download starts I don't need it anymore, since download has its own progress indicator.
Is there a way to do this using JS/Ajax/jQuery?
I found other answers on this, but they involve using Ajax to buffer the file and write it to disk. I don't want this because this approach consumes client memory and takes care of the whole download procedure, while, as I already said, I'm interested only in the preparation step.
Thanks