File Download element

[Andhs-eff]

Hey there,

I must say, this framework is fantastic! Highly customizable and comes with a plethora of intricate elements ready to use.

However, I'm struggling to figure out how to download files using a simple and standard method. Is this element missing, or am I overlooking something?

Thanks!

[rodja]

If you have just static files you can look at https://nicegui.io/reference#add_static_files_ for a straight forward example. To generate content on the fly you can use FastAPI's ability for arbitrary responses: https://nicegui.io/reference#api_responses.

[Andhs-eff]

Absolutely, you can link a file download to a standard button by utilizing FastAPI techniques. While this method may not fully embody the self-containment of the NiceGUI elements.

from nicegui import app, ui
from fastapi.responses import FileResponse

# Creating a file for testing
filepath = "test.txt"

with open(filepath, "w", encoding="utf-8") as f:
    f.write("Sample text")
    
@app.get("/download")
def download_file():
  return FileResponse(path=filepath, media_type='application/octet-stream')

ui.button('Download file', on_click=lambda: ui.open('/download'))

ui.run()

The same feature can be implemented via add_static_files. It's just not clear how to set the media type to prevent the browser from displaying the file in a new tab if it can. So, the example below doesn't really allow you to download a file in txt format. Although for other non-displayable formats, the download of the file is started.

from nicegui import app, ui

filepath = "test.txt"

app.add_static_files('/download', '.')

ui.button('Download file', on_click=lambda: ui.open(f'/download/{filepath}'))

ui.run()

[falkoschindler]

Oh the self-containment of your code examples is just great! Would love to see this more often. 😊

Apart from that: This is a very good question! Currently I don't have an idea of how to do it more elegantly.
Do you have an API in mind which NiceGUI could provide?

[falkoschindler]

We have a very similar issue over here: #656
Therefore we're planning to implement a ui.download function.

[falkoschindler]

Since NiceGUI 1.2.7 there is a ui.download element: https://nicegui.io/documentation/download