skip to Main Content

My Flask server generates an HTML file containing an anchor tag resembling this:

<a href="https://example.com/href_without_extension" download="excelfile.xls">
    Download Excel file
</a>

Generating the Excel file can be slow. If the user clicks the link before the file has been completely generated, I would like the browser to display a simple text error page that says "Please wait a bit then re-load."

But when I have the server send a text file in response to a click, I cannot prevent the user from getting a download of a .xls file that consists of only the error text. This is doubly bad because the user thinks the Excel download has succeeded, and then Excel cannot open the file that is saved to the user’s disk.

On the server side, I have tried two methods that fail:
(1) Setting the MIME type of the response to text/plain and
(2) Redirecting to a fresh URL.

I am open to changing the anchor tag, although:
(a) I do want the seamless download to disk if the .xls file is ready and
(b) for various reasons I do not want to put the .xls extension into the href.

Thank you.

2

Answers


  1. Chosen as BEST ANSWER

    I made a small modification to Raptor's code that seems to work more cleanly. It puts the url into a temporary href0 attribute of the anchor tag and then moves it into the href attribute after processing of the click has begun:

    HTML:

    <a href="#" href0="https://example.com/href_without_extension" onclick="processClick(this)" download="excelfile.xls">
        Download Excel file
    </a>
    

    Javascript:

            function processClick(aTag) {
                aTag.removeAttribute('onclick');
                aTag.href = aTag.getAttribute("href0");
                aTag.style.color = "gray";
                aTag.innerHTML = "Please wait";
                // aTag.click();
                return false;
            }
    

    I thought the aTag.click() was necessary to re-start handling of the click (since the onClick attribute is not the same as the click action), but including it results in the download of two copies of the file (in an Opera browser, at least). When commented out, just one copy downloads.

    It will be awhile before I can check this in other browsers. The other undesirability is that the "Please wait" message persists after the file downloaded has completed, but I think the user can deal with that.


  2. Disable the link after the first click by removing the href attribute and change the link text to "Your Excel file will be ready shortly. Please wait". Using the window.location, your Excel generation link will continue to load until the Excel is ready to download.

    HTML:

    <a href="https://example.com/href_without_extension" onclick="processClick(this)" download="excelfile.xls">
        Download Excel file
    </a>
    

    JavaScript:

    function processClick(aTag) {
        var href = aTag.getAttribute("href");
        aTag.removeAttribute('href');
        aTag.style.color = "gray";
        aTag.innerHTML = "Your Excel file will be ready shortly. Please wait";
    
        // start the Excel generation, the browser will continue to load until the Excel is ready to download
        window.location = href; 
        return false;
    }
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search