asp.net core html,Static files in ASP.NET Core

Static files, such as HTML, CSS, images, and JavaScript, are assets an ASP.NET Core app serves directly to clients by default.

Serve static files

Static files are stored within the project's web root directory. The default directory is {content root}/wwwroot, but it can be changed with the UseWebRoot method. For more information, see Content root and Web root.

The CreateDefaultBuilder method sets the content root to the current directory:

public class Program

{

public static void Main(string[] args)

{

CreateHostBuilder(args).Build().Run();

}

public static IHostBuilder CreateHostBuilder(string[] args) =>

Host.CreateDefaultBuilder(args)

.ConfigureWebHostDefaults(webBuilder =>

{

webBuilder.UseStartup();

});

}

The preceding code was created with the web app template.

Static files are accessible via a path relative to the web root. For example, the Web Application project templates contain several folders within the wwwroot folder:

wwwroot

css

js

lib

Consider creating the wwwroot/images folder and adding the wwwroot/images/MyImage.jpg file. The URI format to access a file in the images folder is https:///images/. For example, https://localhost:5001/images/MyImage.jpg

Serve files in web root

The default web app templates call the UseStaticFiles method in Startup.Configure, which enables static files to be served:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

}

else

{

app.UseExceptionHandler("/Home/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

app.UseStaticFiles();

app.UseRouting();

app.UseAuthorization();

app.UseEndpoints(endpoints =>

{

endpoints.MapDefaultControllerRoute();

});

}

The parameterless UseStaticFiles method overload marks the files in web root as servable. The following markup references wwwroot/images/MyImage.jpg:

My image

In the preceding code, the tilde character ~/ points to the web root.

Serve files outside of web root

Consider a directory hierarchy in which the static files to be served reside outside of the web root:

wwwroot

css

images

js

MyStaticFiles

images

red-rose.jpg

A request can access the red-rose.jpg file by configuring the Static File Middleware as follows:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

}

else

{

app.UseExceptionHandler("/Home/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

// using Microsoft.Extensions.FileProviders;

// using System.IO;

app.UseStaticFiles(new StaticFileOptions

{

FileProvider = new PhysicalFileProvider(

Path.Combine(env.ContentRootPath, "MyStaticFiles")),

RequestPath = "/StaticFiles"

});

app.UseRouting();

app.UseAuthorization();

app.UseEndpoints(endpoints =>

{

endpoints.MapDefaultControllerRoute();

});

}

In the preceding code, the MyStaticFiles directory hierarchy is exposed publicly via the StaticFiles URI segment. A request to https:///StaticFiles/images/red-rose.jpg serves the red-rose.jpg file.

The following markup references MyStaticFiles/images/red-rose.jpg:

A red rose

Set HTTP response headers

A StaticFileOptions object can be used to set HTTP response headers. In addition to configuring static file serving from the web root, the following code sets the Cache-Control header:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

}

else

{

app.UseExceptionHandler("/Home/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

const string cacheMaxAge = "604800";

app.UseStaticFiles(new StaticFileOptions

{

OnPrepareResponse = ctx =>

{

// using Microsoft.AspNetCore.Http;

ctx.Context.Response.Headers.Append(

"Cache-Control", $"public, max-age={cacheMaxAge}");

}

});

app.UseRouting();

app.UseAuthorization();

app.UseEndpoints(endpoints =>

{

endpoints.MapDefaultControllerRoute();

});

}

Static files are publicly cacheable for 600 seconds:

87260403baaf48710d4da11bbe0e95e6.png

Static file authorization

The ASP.NET Core templates call UseStaticFiles before calling UseAuthorization. Most apps follow this pattern. When the Static File Middleware is called before the authorization middleware:

No authorization checks are performed on the static files.

Static files served by the Static File Middleware, such as those those under wwwroot, are publicly accessible.

To serve static files based on authorization:

Store them outside of wwwroot.

Call UseStaticFiles, specifying a path, after calling UseAuthorization.

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

app.UseDatabaseErrorPage();

}

else

{

app.UseExceptionHandler("/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

// wwwroot css, JavaScript, and images don't require authentication.

app.UseStaticFiles();

app.UseRouting();

app.UseAuthentication();

app.UseAuthorization();

app.UseStaticFiles(new StaticFileOptions

{

FileProvider = new PhysicalFileProvider(

Path.Combine(env.ContentRootPath, "MyStaticFiles")),

RequestPath = "/StaticFiles"

});

app.UseEndpoints(endpoints =>

{

endpoints.MapRazorPages();

});

}public class Startup

{

public Startup(IConfiguration configuration)

{

Configuration = configuration;

}

public IConfiguration Configuration { get; }

public void ConfigureServices(IServiceCollection services)

{

services.AddDbContext(options =>

options.UseSqlServer(

Configuration.GetConnectionString("DefaultConnection")));

services.AddDefaultIdentity(options => options.SignIn.RequireConfirmedAccount = true)

.AddEntityFrameworkStores();

services.AddRazorPages();

services.AddAuthorization(options =>

{

options.FallbackPolicy = new AuthorizationPolicyBuilder()

.RequireAuthenticatedUser()

.Build();

});

}

// Remaining code ommitted for brevity.

In the preceding code, the fallback authorization policy requires all users to be authenticated. Endpoints such as controllers, Razor Pages, etc that specify their own authorization requirements don't use the fallback authorization policy. For example, Razor Pages, controllers, or action methods with [AllowAnonymous] or [Authorize(PolicyName="MyPolicy")] use the applied authorization attribute rather than the fallback authorization policy.

RequireAuthenticatedUser adds DenyAnonymousAuthorizationRequirement to the current instance, which enforces that the current user is authenticated.

Static assets under wwwroot are publicly accessible because the default Static File Middleware (app.UseStaticFiles();) is called before UseAuthentication. Static assets in the MyStaticFiles folder require authentication. The sample code demonstrates this.

An alternative approach to serve files based on authorization is to:

Store them outside of wwwroot and any directory accessible to the Static File Middleware.

Serve them via an action method to which authorization is applied and return a FileResult object:

[Authorize]

public IActionResult BannerImage()

{

var filePath = Path.Combine(

_env.ContentRootPath, "MyStaticFiles", "images", "red-rose.jpg");

return PhysicalFile(filePath, "image/jpeg");

}

Directory browsing

Directory browsing allows directory listing within specified directories.

Directory browsing is disabled by default for security reasons. For more information, see Considerations.

Enable directory browsing with:

AddDirectoryBrowser in Startup.ConfigureServices.

UseDirectoryBrowser in Startup.Configure.

public void ConfigureServices(IServiceCollection services)

{

services.AddControllersWithViews();

services.AddDirectoryBrowser();

}

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

}

else

{

app.UseExceptionHandler("/Home/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

// using Microsoft.Extensions.FileProviders;

// using System.IO;

app.UseStaticFiles(new StaticFileOptions

{

FileProvider = new PhysicalFileProvider(

Path.Combine(env.WebRootPath, "images")),

RequestPath = "/MyImages"

});

app.UseDirectoryBrowser(new DirectoryBrowserOptions

{

FileProvider = new PhysicalFileProvider(

Path.Combine(env.WebRootPath, "images")),

RequestPath = "/MyImages"

});

app.UseRouting();

app.UseAuthorization();

app.UseEndpoints(endpoints =>

{

endpoints.MapDefaultControllerRoute();

});

}

The preceding code allows directory browsing of the wwwroot/images folder using the URL https:///MyImages, with links to each file and folder:

73c9cf4392a8de2e64653681053a9076.png

Serve default documents

Setting a default page provides visitors a starting point on a site. To serve a default page from wwwroot without a fully qualified URI, call the UseDefaultFiles method:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

}

else

{

app.UseExceptionHandler("/Home/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

app.UseDefaultFiles();

app.UseStaticFiles();

app.UseRouting();

app.UseAuthorization();

app.UseEndpoints(endpoints =>

{

endpoints.MapDefaultControllerRoute();

});

}

UseDefaultFiles must be called before UseStaticFiles to serve the default file. UseDefaultFiles is a URL rewriter that doesn't serve the file.

With UseDefaultFiles, requests to a folder in wwwroot search for:

default.htm

default.html

index.htm

index.html

The first file found from the list is served as though the request were the fully qualified URI. The browser URL continues to reflect the URI requested.

The following code changes the default file name to mydefault.html:

var options = new DefaultFilesOptions();

options.DefaultFileNames.Clear();

options.DefaultFileNames.Add("mydefault.html");

app.UseDefaultFiles(options);

app.UseStaticFiles();

The following code shows Startup.Configure with the preceding code:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

}

else

{

app.UseExceptionHandler("/Home/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

var options = new DefaultFilesOptions();

options.DefaultFileNames.Clear();

options.DefaultFileNames.Add("mydefault.html");

app.UseDefaultFiles(options);

app.UseStaticFiles();

app.UseRouting();

app.UseAuthorization();

app.UseEndpoints(endpoints =>

{

endpoints.MapDefaultControllerRoute();

});

}

UseFileServer for default documents

UseFileServer combines the functionality of UseStaticFiles, UseDefaultFiles, and optionally UseDirectoryBrowser.

Call app.UseFileServer to enable the serving of static files and the default file. Directory browsing isn't enabled. The following code shows Startup.Configure with UseFileServer:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

}

else

{

app.UseExceptionHandler("/Home/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

app.UseFileServer();

app.UseRouting();

app.UseAuthorization();

app.UseEndpoints(endpoints =>

{

endpoints.MapDefaultControllerRoute();

});

}

The following code enables the serving of static files, the default file, and directory browsing:

app.UseFileServer(enableDirectoryBrowsing: true);

The following code shows Startup.Configure with the preceding code:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

}

else

{

app.UseExceptionHandler("/Home/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

app.UseFileServer(enableDirectoryBrowsing: true);

app.UseRouting();

app.UseAuthorization();

app.UseEndpoints(endpoints =>

{

endpoints.MapDefaultControllerRoute();

});

}

Consider the following directory hierarchy:

wwwroot

css

images

js

MyStaticFiles

images

MyImage.jpg

default.html

The following code enables the serving of static files, the default file, and directory browsing of MyStaticFiles:

public void ConfigureServices(IServiceCollection services)

{

services.AddControllersWithViews();

services.AddDirectoryBrowser();

}

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

}

else

{

app.UseExceptionHandler("/Home/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

app.UseStaticFiles(); // For the wwwroot folder.

// using Microsoft.Extensions.FileProviders;

// using System.IO;

app.UseFileServer(new FileServerOptions

{

FileProvider = new PhysicalFileProvider(

Path.Combine(env.ContentRootPath, "MyStaticFiles")),

RequestPath = "/StaticFiles",

EnableDirectoryBrowsing = true

});

app.UseRouting();

app.UseAuthorization();

app.UseEndpoints(endpoints =>

{

endpoints.MapDefaultControllerRoute();

});

}

AddDirectoryBrowser must be called when the EnableDirectoryBrowsing property value is true.

Using the file hierarchy and preceding code, URLs resolve as follows:

URI

Response

https:///StaticFiles/images/MyImage.jpg

MyStaticFiles/images/MyImage.jpg

https:///StaticFiles

MyStaticFiles/default.html

If no default-named file exists in the MyStaticFiles directory, https:///StaticFiles returns the directory listing with clickable links:

e7b3510bb0f970b01418755b4cfd8df5.png

UseDefaultFiles and UseDirectoryBrowser perform a client-side redirect from the target URI without a trailing / to the target URI with a trailing /. For example, from https:///StaticFiles to https:///StaticFiles/. Relative URLs within the StaticFiles directory are invalid without a trailing slash (/).

FileExtensionContentTypeProvider

The FileExtensionContentTypeProvider class contains a Mappings property that serves as a mapping of file extensions to MIME content types. In the following sample, several file extensions are mapped to known MIME types. The .rtf extension is replaced, and .mp4 is removed:

// using Microsoft.AspNetCore.StaticFiles;

// using Microsoft.Extensions.FileProviders;

// using System.IO;

// Set up custom content types - associating file extension to MIME type

var provider = new FileExtensionContentTypeProvider();

// Add new mappings

provider.Mappings[".myapp"] = "application/x-msdownload";

provider.Mappings[".htm3"] = "text/html";

provider.Mappings[".image"] = "image/png";

// Replace an existing mapping

provider.Mappings[".rtf"] = "application/x-msdownload";

// Remove MP4 videos.

provider.Mappings.Remove(".mp4");

app.UseStaticFiles(new StaticFileOptions

{

FileProvider = new PhysicalFileProvider(

Path.Combine(env.WebRootPath, "images")),

RequestPath = "/MyImages",

ContentTypeProvider = provider

});

app.UseDirectoryBrowser(new DirectoryBrowserOptions

{

FileProvider = new PhysicalFileProvider(

Path.Combine(env.WebRootPath, "images")),

RequestPath = "/MyImages"

});

The following code shows Startup.Configure with the preceding code:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

}

else

{

app.UseExceptionHandler("/Home/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

// using Microsoft.AspNetCore.StaticFiles;

// using Microsoft.Extensions.FileProviders;

// using System.IO;

// Set up custom content types - associating file extension to MIME type

var provider = new FileExtensionContentTypeProvider();

// Add new mappings

provider.Mappings[".myapp"] = "application/x-msdownload";

provider.Mappings[".htm3"] = "text/html";

provider.Mappings[".image"] = "image/png";

// Replace an existing mapping

provider.Mappings[".rtf"] = "application/x-msdownload";

// Remove MP4 videos.

provider.Mappings.Remove(".mp4");

app.UseStaticFiles(new StaticFileOptions

{

FileProvider = new PhysicalFileProvider(

Path.Combine(env.WebRootPath, "images")),

RequestPath = "/MyImages",

ContentTypeProvider = provider

});

app.UseDirectoryBrowser(new DirectoryBrowserOptions

{

FileProvider = new PhysicalFileProvider(

Path.Combine(env.WebRootPath, "images")),

RequestPath = "/MyImages"

});

app.UseRouting();

app.UseAuthorization();

app.UseEndpoints(endpoints =>

{

endpoints.MapDefaultControllerRoute();

});

}

Non-standard content types

The Static File Middleware understands almost 400 known file content types. If the user requests a file with an unknown file type, the Static File Middleware passes the request to the next middleware in the pipeline. If no middleware handles the request, a 404 Not Found response is returned. If directory browsing is enabled, a link to the file is displayed in a directory listing.

The following code enables serving unknown types and renders the unknown file as an image:

app.UseStaticFiles(new StaticFileOptions

{

ServeUnknownFileTypes = true,

DefaultContentType = "image/png"

});

The following code shows Startup.Configure with the preceding code:

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)

{

if (env.IsDevelopment())

{

app.UseDeveloperExceptionPage();

}

else

{

app.UseExceptionHandler("/Home/Error");

app.UseHsts();

}

app.UseHttpsRedirection();

app.UseStaticFiles(new StaticFileOptions

{

ServeUnknownFileTypes = true,

DefaultContentType = "image/png"

});

app.UseRouting();

app.UseAuthorization();

app.UseEndpoints(endpoints =>

{

endpoints.MapDefaultControllerRoute();

});

}

With the preceding code, a request for a file with an unknown content type is returned as an image.

Warning

Enabling ServeUnknownFileTypes is a security risk. It's disabled by default, and its use is discouraged. FileExtensionContentTypeProvider provides a safer alternative to serving files with non-standard extensions.

Serve files from multiple locations

UseStaticFiles and UseFileServer default to the file provider pointing at wwwroot. Additional instances of UseStaticFiles and UseFileServer can be provided with other file providers to serve files from other locations. For more information, see this GitHub issue.

Security considerations for static files

Warning

UseDirectoryBrowser and UseStaticFiles can leak secrets. Disabling directory browsing in production is highly recommended. Carefully review which directories are enabled via UseStaticFiles or UseDirectoryBrowser. The entire directory and its sub-directories become publicly accessible. Store files suitable for serving to the public in a dedicated directory, such as /wwwroot. Separate these files from MVC views, Razor Pages, configuration files, etc.

The URLs for content exposed with UseDirectoryBrowser and UseStaticFiles are subject to the case sensitivity and character restrictions of the underlying file system. For example, Windows is case insensitive, but macOS and Linux aren't.

ASP.NET Core apps hosted in IIS use the ASP.NET Core Module to forward all requests to the app, including static file requests. The IIS static file handler isn't used and has no chance to handle requests.

Complete the following steps in IIS Manager to remove the IIS static file handler at the server or website level:

Navigate to the Modules feature.

Select StaticFileModule in the list.

Click Remove in the Actions sidebar.

Warning

If the IIS static file handler is enabled and the ASP.NET Core Module is configured incorrectly, static files are served. This happens, for example, if the web.config file isn't deployed.

Place code files, including .cs and .cshtml, outside of the app project's web root. A logical separation is therefore created between the app's client-side content and server-based code. This prevents server-side code from being leaked.

Additional resources

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值