3

I am new to Blazor and trying to show File Saveas Dialog as shown in following link on a button click. Save as Image

The requirement is - upon clicking the Saveas button above Saveas dialog should be popped up where user can choose the destination of file and file name.

I have tried "enabling the setting to check the save location in the download settings of the browser" and it works. But we do not want to depend on the Browser settings.

Please add your thoughts on below..

  1. Instead of depending on the browser settings is there any other way to show Saveas dialog?

  2. Are there any open source Nuget packages available to help on this?

NOTE: I am using .NET 6.0 for building my application

Thanks in advance,

Bhargavi Gowri.

Bhargavi
  • 31
  • 3
  • I don't believe you can open a Save As dialog on a web browser programmatically, with Blazor, JavaScript, or anything else. The best you can do is initiate a download to the Downloads folder and that is done with a simple `a href` – Emperor Eto Feb 09 '22 at 11:29

2 Answers2

2

This isn't a Blazor thing. In web browsers, files are downloaded from links using <a> tag in HTML using the download attribute. Just create a link to your file:

<a href="path_to_file" download>Save</a>
<a href="link_path_to_file" download="suggested_name">Save</a>

The path must be on the same server, but blob and data links will work as well.

If you do not suggest a name, the browser will use the original filename (possibly changed to remove symbols the OS doesn't allow in file paths).

https://caniuse.com/download

If you want your link to look like a button, then that's a different issue, and you can google or ask that.

Bennyboy1973
  • 3,413
  • 2
  • 11
  • 16
1

I also wanted to bring up a window to save a file in which the user could select a folder. Before that, the system automatically saved to the Downloads folder.

As I understood, there was no such possibility before, but now it is possible thanks to this api: https://caniuse.com/native-filesystem-api.

I found this solution in the answer to this question: https://stackoverflow.com/a/70001920/16740180.

It's worth noting that I use Blazor WebAssembly and not a Blazor Server. And I do not know if it will work for you.

Unfortunately, this doesn't work for mobile devices right now, but it works fine for windows. I hope this helps someone.

dstankovskii
  • 39
  • 3
  • No. This is not supported by too many browsers. It should not be recommended. – Bennyboy1973 Sep 25 '22 at 20:16
  • Not everyone needs cross-browser compatibility. And it seems to me that this is the only way at the moment. It appeared recently, so not all browsers support it. I hope that soon other browsers will also add support for this api. Tell me please, in your answer, the link will open the "save as" window or just download to the downloads folder? – dstankovskii Sep 26 '22 at 23:22
  • Behavior is set by the browser software, and it SHOULD BE. It's not polite for a website author to try to circumvent the settings and wishes of the user. I suspect the default behavior varies by device-- probably showing a folder for most desktops, and autodownload (after choosing permissions) for a mobile device. But I don't know. – Bennyboy1973 Sep 27 '22 at 02:42