I want to download files from wwwroot folder

Radzen.Blazor Components
1

i created a button on radzen page to download a file inside wwwroot folder.
the file path and file name is saved inside my table in SQL server database.
this is the code

Download Files

and this is the function of DownloadFileFromURL

and this is the code
@code {
private async Task DownloadFileFromURL()
{
var fileName = $"{tblTicket.AttchedFileName}";
var fileURL = $"{environment.WebRootPath}";
await JS.InvokeVoidAsync("triggerFileDownload", fileName, fileURL);
}

and for you information i Injected this

@inject IJSRuntime JS
@inject IWebHostEnvironment environment
.
so it doesn't work . can you help me

2

Hi @Ibrahim3amer,

We are not sure what didn't work. Try running the app with a debugger attached to see what really happens.

1 Like
3

this is the error appears to me

Not allowed to load local resource: file:///C:/Users/Administrator/source/repos/Tickets/V05/wwwroot

this is the whole code of the page inside this link

4

This error is not related to the Radzen.Blazor components. The web browser is restricted and cannot have access to the server file system. You should use an action that reads the file from the database and returns it as a file stream. Here is a related question: c# - Stream File Content from DB - Stack Overflow

5

the problem is the whole file ( even it's a PDFf or image ) is inside the wwwroot folder but i just save the file path to the database.
so how could i make file stream from the database which just have the file path not storing the file data.

6

Then you just need to navigate to that file. Something like this should work:

NavigationManager.NavigateTo($"/{filePath}", true);
7

so i made my code like this :slight_smile: private async Task DownloadFileFromURL()
{
var fileName = $"{tblTicket.AttchedFileName}";
var fileURL = $"{environment.WebRootPath}";
NavigationManager.NavigateTo($"/{fileURL}", true);
await JS.InvokeVoidAsync("triggerFileDownload", fileName, fileURL);

}

but when i press the button it give's me this error.

This localhost page can’t be found

No webpage was found for the web address: https://localhost:5001/C:/Users/Administrator/source/repos/Tickets/V05/wwwroot

HTTP ERROR 404

8

I think u wrongly accessing the path.

In my case (Blazor server):

OPTIONAL:

If u dont want to navigate to the page use JS to download the file, like above:

  • Js func
async function downloadFileFromUrl(fileName, url) {
	window.URL = window.URL || window.webkitURL;

	const anchorElement = document.createElement('a');
	anchorElement.setAttribute("type", "hidden");
	anchorElement.href = url;
	anchorElement.download = fileName ?? '';

	document.body.appendChild(anchorElement);
	anchorElement.click();
	anchorElement.remove();
};
  • js invoke from c# code
JS.InvokeVoidAsync("downloadFileFromUrl", FileName, FullUrl);

Hope i could help

9

Capture
Capture1809×835 206 KB

this is my code , Code and path:

and the error still appers

10

thanx a lot . but i did what you said . same issue

Capture
Capture1809×835 206 KB

11

Your path is still wrong. Fix it. You shouldn't use WebRootPath at all - check my reply.