Skip to main content

Download files in apps

Within your Windmill apps, you might want users to download files. There are two options: the download button, and the transformers. Both involve manipulating data URLs scheme with a Base64 encoded string.

Download Button

The download button component allows you to download a file. The data source of the Download button must be a data URL scheme with a Base64 encoded string:

Transformers

A transformer is a function that alters the output of the runnable, often used to format the output.

You can then download the file from your browser with the right transformer:

// Assuming `result` is your data URL scheme with a Base64 encoded string

// Function to download the data as a file
function downloadDataAsFile(dataUrl, fileName) {
// Create an anchor element
const anchor = document.createElement('a');

// Set the href to the data URL
anchor.href = dataUrl;

// Set the download attribute to the desired file name
anchor.download = fileName;

// Append the anchor to the body (required for Firefox)
document.body.appendChild(anchor);

// Trigger the download by simulating a click on the anchor
anchor.click();

// Remove the anchor from the body
document.body.removeChild(anchor);
}

// Call the function with your data URL and a file name
downloadDataAsFile(result, 'name.file');

or if the result is just regular JSON:

// Function to download the data as a file
function downloadDataAsFile(dataUrl, fileName) {
// Create an anchor element
const anchor = document.createElement('a');

// Set the href to the data URL
anchor.href = dataUrl;

// Set the download attribute to the desired file name
anchor.download = fileName;

// Append the anchor to the body (required for Firefox)
document.body.appendChild(anchor);

// Trigger the download by simulating a click on the anchor
anchor.click();

// Remove the anchor from the body
document.body.removeChild(anchor);
}

// Call the function with your data URL and a file name
downloadDataAsFile(result, 'selected_row.md');

Here is an example of downloading a file from a button in a table.


And here is another example of a background script and a transformer automatically downloading a file upon input change (here the selected row of a table).