Files and Static Content

📦 Files and Static Content in ASP.NET

Imagine your web app is a pizza delivery service. You have the kitchen (where code runs), but customers also want to grab soda and napkins from the front counter without going to the kitchen. That’s what static files are—ready-made items served directly, no cooking required!

🍕 The Big Picture

When you build a website, you have two types of content:

1. Dynamic content – Pages that change (like pizza made to order)
2. Static content – Files that never change (like soda bottles on the shelf)

Static files include:

• 🖼️ Images
• 📄 CSS stylesheets
• 📜 JavaScript files
• 📑 HTML pages
• 📦 Downloads (PDFs, ZIPs)

Let’s explore how ASP.NET handles these!

🗂️ Static Files Serving

What Is It?

Static file serving means: “Give the file directly to the user, no processing needed.”

Analogy: When someone asks for a can of soda, you don’t cook it—you just hand it over from the refrigerator!

How to Enable It

var builder = WebApplication
    .CreateBuilder(args);
var app = builder.Build();

// Enable static files
app.UseStaticFiles();

app.Run();

That’s it! Now any file in your wwwroot folder is accessible.

Example

Put an image at:

wwwroot/images/logo.png

Access it at:

https://yoursite.com/images/logo.png

🗺️ MapStaticAssets

What Is It?

MapStaticAssets is a newer, faster way to serve static files. Think of it as the express lane at the grocery store!

Why Use It?

How to Use It

var app = builder.Build();

// The modern way!
app.MapStaticAssets();

app.Run();

When to Choose?

• New projects: Use MapStaticAssets
• Older projects: UseStaticFiles still works fine

🏠 Content Root vs Web Root

This is super important! Think of your app as a house:

graph TD
    A["🏠 Content Root"] --> B["📂 wwwroot"]
    A --> C["📂 Controllers"]
    A --> D["📂 Services"]
    A --> E["📄 appsettings.json"]
    B --> F["🌐 Web Root"]
    F --> G["📂 css"]
    F --> H["📂 js"]
    F --> I["📂 images"]

Content Root 🏠

The entire house. This is where ALL your app files live:

• Code files
• Config files
• Everything!

Location: Your project folder

// Get content root path
var contentRoot = builder
    .Environment.ContentRootPath;
// Example: C:\MyApp\

Web Root 🌐

Just the front porch. Only files here are accessible to visitors!

Location: The wwwroot folder

// Get web root path
var webRoot = builder
    .Environment.WebRootPath;
// Example: C:\MyApp\wwwroot\

🚨 Security Rule

Never put sensitive files in wwwroot!

• ❌ wwwroot/secrets.json (EXPOSED!)
• ✅ appsettings.json (Safe in content root)

🗜️ Response Compression

What Is It?

Before sending files to users, we squeeze them smaller. Like vacuum-packing a sweater—same sweater, smaller package!

Why Compress?

How to Enable It

var builder = WebApplication
    .CreateBuilder(args);

// Add compression services
builder.Services
    .AddResponseCompression();

var app = builder.Build();

// Use compression middleware
app.UseResponseCompression();

app.UseStaticFiles();
app.Run();

Compression Types

builder.Services
    .AddResponseCompression(options =>
{
    options.EnableForHttps = true;
    options.Providers.Add<BrotliCompressionProvider>();
    options.Providers.Add<GzipCompressionProvider>();
});

📤 File Uploads

The Simple Version

Imagine a mailbox at your house. Users drop letters (files) into it!

Basic Upload Form (HTML)

<form method="post"
      enctype="multipart/form-data">
    <input type="file" name="file" />
    <button type="submit">Upload</button>
</form>

Handle Upload (C#)

[HttpPost]
public async Task<IActionResult> Upload(
    IFormFile file)
{
    if (file.Length > 0)
    {
        var path = Path.Combine(
            "uploads",
            file.FileName);

        using var stream = new FileStream(
            path, FileMode.Create);

        await file.CopyToAsync(stream);
    }

    return Ok("Uploaded!");
}

⚠️ Security Tips

1. Never trust the filename!

// Bad: Uses user's filename
var name = file.FileName;

// Good: Generate safe name
var name = Guid.NewGuid() +
    Path.GetExtension(file.FileName);

2. Validate file types!

var allowed = new[] { ".jpg", ".png" };
var ext = Path.GetExtension(file.FileName);

if (!allowed.Contains(ext.ToLower()))
    return BadRequest("Invalid type!");

🐘 Large File Uploads

The Problem

Regular uploads load the entire file into memory.

• 5 MB file? No problem.
• 500 MB file? 💥 Server crashes!

The Solution: Streaming

Instead of holding everything in memory, we stream directly to disk—like a water pipe!

graph LR
    A["User"] -->|Stream| B["🚿 Pipe"]
    B -->|Stream| C["💾 Disk"]
    style B fill:#4CAF50

Configure Size Limits

builder.Services.Configure<FormOptions>(
    options =>
{
    // Allow 500 MB
    options.MultipartBodyLengthLimit
        = 500 * 1024 * 1024;
});

Streaming Upload Handler

[HttpPost]
[RequestSizeLimit(500_000_000)]
public async Task<IActionResult> UploadLarge()
{
    var request = HttpContext.Request;
    var boundary = request
        .GetMultipartBoundary();

    var reader = new MultipartReader(
        boundary, request.Body);

    var section = await reader
        .ReadNextSectionAsync();

    while (section != null)
    {
        var fileSection = section
            .AsFileSection();

        if (fileSection != null)
        {
            var path = Path.Combine(
                "uploads",
                fileSection.FileName);

            using var stream =
                new FileStream(path,
                    FileMode.Create);

            await fileSection
                .FileStream
                .CopyToAsync(stream);
        }

        section = await reader
            .ReadNextSectionAsync();
    }

    return Ok("Large file uploaded!");
}

Kestrel Configuration

builder.WebHost.ConfigureKestrel(
    options =>
{
    options.Limits
        .MaxRequestBodySize =
            500 * 1024 * 1024; // 500 MB
});

📥 File Downloads

The Simple Way

For small files in wwwroot, just link to them:

<a href="/files/report.pdf">
    Download Report
</a>

Programmatic Downloads

When you need control (logging, auth, etc.):

[HttpGet("download/{filename}")]
public IActionResult Download(
    string filename)
{
    var path = Path.Combine(
        "files", filename);

    if (!System.IO.File.Exists(path))
        return NotFound();

    var bytes = System.IO.File
        .ReadAllBytes(path);

    return File(
        bytes,
        "application/octet-stream",
        filename);
}

Large File Downloads (Streaming)

[HttpGet("download-large/{filename}")]
public IActionResult DownloadLarge(
    string filename)
{
    var path = Path.Combine(
        "files", filename);

    if (!System.IO.File.Exists(path))
        return NotFound();

    var stream = new FileStream(
        path, FileMode.Open,
        FileAccess.Read);

    return File(
        stream,
        "application/octet-stream",
        filename);
}

Download Content Types

🎯 Quick Summary

graph TD
    A["📦 Static Content"] --> B["Serving"]
    A --> C["Uploading"]
    A --> D["Downloading"]

    B --> E["UseStaticFiles"]
    B --> F["MapStaticAssets ⚡"]
    B --> G["Response Compression 🗜️"]

    C --> H["Small Files"]
    C --> I["Large Files 🐘"]

    D --> J["Direct Link"]
    D --> K["Programmatic"]

🚀 You Did It!

You now understand:

• ✅ How static files are served
• ✅ The difference between Content Root and Web Root
• ✅ Why and how to compress responses
• ✅ How to handle file uploads (small and large!)
• ✅ How to enable file downloads

Next step: Try creating a simple file upload form and watch the magic happen! 🎉