Implementing a file manager in ASP.NET Core 8.0

Implementing a file manager
in ASP.NET Core 8.0
ASP.NET Core File Manager
Ever needed to manage files, accepts uploads and offer downloads in
your ASP.NET Core applications? You may need to display files to
users but with different permissions. For example while one user is
allowed to upload, the other user is allowed to download only. In
modern browsers it’s easier to handle uploads, compared to the past
however you still can’t upload huge files if you don’t configure your
server correctly and browsers still does not offer any UI for
managing files. What if you could integrate a file manager which is
customizable, has a modern slick look and can handle all this for
you?

This post will focus on ASP.NET Core File Manager which is best on
the market for this job, regarding performance and easy,
straightforward API. It also supports ASP.NET Classic for legacy
applications but in this post we will use the newest and best tech
ASP.NET Core.
Step 1 — Create an ASP.NET Core project
 Open Visual Studio 2022 and create a project by
selecting ASP.NET Core Web App (MVC) template. Other
ASP.NET Core templates can also be used but we will use
this template for this example.

 Give the project a name e.g. SampleFileManager.
 Choose .NET 8.0 as framework. Older .NET versions are
also supported but we will use current LTS version 8.0 for
this example.

Step 2 — Add the necessary NuGet packages
 Right-click on the project in Solution Explorer and select
Manage NuGet Packages.
 Search FileUltimate and install the found package.

Step 3 — Add the initialization code to ASP.NET Core
pipeline
 Open Program.cs of your project and copy only the marked
lines to the same location:
var builder = WebApplication.CreateBuilder(args);
// Add services to the container.
builder.Services.AddControllersWithViews();
//----------------------
//Add GleamTech to the ASP.NET Core services container.
builder.Services.AddGleamTech();
//----------------------
var app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Home/Error");
}
//----------------------
//Register GleamTech to the ASP.NET Core HTTP request pipeline.
app.UseGleamTech();
//----------------------
app.UseStaticFiles();
app.UseRouting();
app.UseAuthorization();
app.MapControllerRoute(
name: "default",
pattern: "{controller=Home}/{action=Index}/{id?}");
app.Run();

 Program.cs of your project will look like this:

Step 4 — Create a view and controller which will host
the file manager
 Create MyFileManager.cshtml under ViewsHome and replace
the contents with the following:
@using GleamTech.AspNet.Core
@using GleamTech.FileUltimate.AspNet.UI
<!DOCTYPE html>
@{
var fileManager = new FileManager
{
Width = 800,
Height = 600,
Resizable = true
};
var rootFolder = new FileManagerRootFolder
{
Name = "A Root Folder",
Location = "~/MyRootFolder"
};
rootFolder.AccessControls.Add(new FileManagerAccessControl
{
Path = @"",
AllowedPermissions = FileManagerPermissions.Full
});
fileManager.RootFolders.Add(rootFolder);
}
<html>
<head>
<title>File Manager</title>
@this.RenderHead(fileManager)
</head>
<body>
@this.RenderBody(fileManager)
</body>
</html>

 Add a controller method with same name which loads our
view:
public class HomeController : Controller
{
public IActionResult MyFileManager()
{
return View();
}
}

Step 5 — Run solution
 Run solution which will also build the project.
 When browser is launched, as we didn’t add a link to our
view in home page, directly type to add our controller
url home/MyFileManager in the address bar (so it
reads https://localhost:7034/home/MyFileManager).

The output
FileManager is now rendered in our host view and loaded the given
root folder (which is empty for now). For uploading, you can drag
and drop files and folders from your desktop directly to folders in
FileManager. We can add many root folders to FileManager, each
with different permissions.
FileManagerRootFolder.Location property can be set to a web app
relative path (this example), a path on disk or network, an Azure
Blob container , an Amazon S3 bucket. This is possible by location
providers feature. Please refer to docs for more info and sample code
on this.

Additional information
 Video Tutorial
 Online Documentation
 Live Demo Examples

Implementing a file manager in ASP.NET Core 8.0

More Related Content

Similar to Implementing a file manager in ASP.NET Core 8.0 (20)

Recently uploaded (20)

Implementing a file manager in ASP.NET Core 8.0