Blazor has a built-in InputFile component from .NET 5.0 that can be used to upload files to the server. You can check the file size in the OnChange event and upload or prevent uploading the files to the server.
[Index.razor]
@page “/”
<h3>File Upload</h3>
<InputFile OnChange=”OnInputFileChange” />
@if (file?.Size < 1000000)
{
<p>Name: @file.Name</p>
<p>Size in bytes: @file.Size</p>
<p>Last modified date: @file.LastModified.DateTime.ToShortDateString()</p>
<p>Content type (not always supplied by the browser): @file.ContentType</p>
}
else
{
<p>File size exceeds more than 1MB</p>
}
@code {
IBrowserFile file;
void OnInputFileChange(InputFileChangeEventArgs e)
{
file = e.File;
if (e.File.Size < 1000000)
{
// Upload files to the server from here
}
}
}
Note: Syncfusion offers a feature-rich, easy-to-use File Upload component for Blazor. You can check it out here.
Share with