Allow user to download a file and save locally

UI Builder
1

@mark-piller

Apologies for tagging you and for the basic question. I’m gated by something I need this afternoon though and am hoping you can help.

I know that I can create a file and save it in the Backendless file system. However, in my current case I need to allow the user to choose a location on their personal computer where they’d like to save a CSV generated using the marketplace CSV API. I may just be looking in the wrong place but could you point me to any examples that might be on hand to allow a user to save a file locally?

Thanks!
James

2

Hi James,

Selecting a local location for a file downloaded from the Internet is entirely up to the user - there is no way to control that through the browser. The file download popup has an interface where users can select a local folder.

Regards,
Mark

3

Ah, yes sorry. I wasn’t clear. I am trying to trigger the popup so that they can choose the location. I can’t find a codeless element to do so.

The table2csv codeless component has the same filePath input as Create File and others, which I think can only point to the Backendless file structure. I need the user to be able to choose a place on their local machine.

4

Are we talking about selecting a location for file download? If so, is the download triggered by clicking on a link or a button?

5

Yes. Sorry I’m not using the right language on this front.

I have a button, they click it, it calls the CSV Adapter, loads a View, and generates the CSV. This appears to save to a Backendless file path:

image
image1014×464 29.7 KB

I need the user to be able to download this file. Ideally I would just pop up a standard browser download / select location window like any other download online, they choose the location and then the CSV is saved to that location instead of to the Backendless backend.

6

Sorry Mark, I know this is probably a super basic thing that I just don’t have exposure to as a non developer. I suspect I’m missing something obvious.

For the record, I am fine saving it to the backend first and then triggering the download if it needs to happen in two operations. Perhaps I just need to know how to get a URL link to a file in the backend…

7

Here’s what I would do:

  1. Generate the CSV
  2. Save it in the File storage of your app, you will get the final URL, put it into the data model (page data or similar)
  3. Use the Link component on the page, you could hide it until the URL from the step above is available
  4. Bind the URL Logic property of the Link component to the property that has the URL and show the link.
  5. When the customer clicks the link, the download popup will display.

Regards,
Mark

8

Awesome, that makes sense. When I first started questioning I didn’t realize that any link would attempt the download. I’ll plan for that.

9

Actually @mark-piller, sorry. it looks like the CSV adapter returns the file path in the backendless directory structure. It doesn’t return the URL where the file is located. I took a look at the file in the backend and the URL contains the app key. I did a bit of searching on the forum and it looks like the custom domain will override this in some way.

It doesn’t appear to be located at various combinations of customDomain/filepath (e.g. customDomain/files/view/export/billing-data/filename.csv). Can you let me know how the URL would be structured or how it could be retrieved given the file path?

10

The URL is structured like this:

  1. Take the domain name
  2. Concatenate the directory where you configured the CSV service to store files
  3. Concatenate the name of the file created by the CSV service.
11

This section of the docs describes how the URLs in the Backendless file storage system are structured:
https://backendless.com/docs/rest/files_file_download.html

12

Thank you!