HTML5/JavaScript "Save As" Dialog for File Download-CodePudding

I've written a NodeJS/Express application that generates and downloads an excel document (created using ExcelJS) upon the user pressing a button. When the user presses the button, the file is generated then downloaded to the user's default download location. I'd prefer the user be able to select where they'd like to download the file upon pressing the button. Is this possible?

My current JavaScript code is as follows:

export_button.onclick = async function() {
    await fetch('/download', {
        method: 'POST'
    })
    .then(resp => resp.blob())
    .then(blob => {
        const url = window.URL.createObjectURL(blob);
        const a = document.createElement('a');
        a.style.display = 'none';
        a.href = url;
        a.download = 'document.xlsx';
        document.body.appendChild(a);
        a.click();
        window.URL.revokeObjectURL(url);
    });
}

CodePudding user response：

This is possible in desktop versions of latest Chrome-based browsers (Chrome, Edge, Opera).

Current support: In fact, we have a method called exactly that: <pdf-file>.saveAs().

Online version of Visual Studio Code is another recent user: https://vscode.dev/.

Apple and Firefox are likely to drag their feet on this one citing privacy/security concerns for at least the next few months though.

CodePudding user response：

I don't believe this is possible, no. This behaviour is controlled by settings in the user's browser. For most browsers, or perhaps even all of them, the default behaviour is to always download files to a default location without showing a prompt where the user can change its destination or filename. Understandably, you can't change a user's browser settings from JavaScript.

Glad to see I was wrong about this, I didn't realise the File System Access API Cetin Sert's answer describes exists.