ASP .NET 5 Preview: Serving Static Files

One of the most basic features of just about any non-trivial web application is that of serving static files.  Typically, a browser will request all kinds of files: HTML documents, JavaScript files, images, etc.

In ASP .NET 5, the root of the website is (by default) a folder called wwwroot. Any files to be served by the web application should be placed within this folder. However, the ability to serve static files doesn’t come out of the box. To support static files, you need to add the Microsoft.AspNet.StaticFiles NuGet package to your project.json:

  "dependencies": {
    "Microsoft.AspNet.IISPlatformHandler": "1.0.0-rc1-final",
    "Microsoft.AspNet.Server.Kestrel": "1.0.0-rc1-final",
    "Microsoft.AspNet.StaticFiles": "1.0.0-rc1-final",
  },

Then, in your Configure() method (Startup.cs), call UseStaticFiles():

        public void Configure(IApplicationBuilder app)
        {
            app.UseIISPlatformHandler();
            
            app.UseStaticFiles();

            app.Run(async (context) =>
            {
                await context.Response.WriteAsync("Hello World!");
            });
        }

Rebuild and run your application:

dnu restore
dnu build
dnx web

…and you can now retrieve files:

aspnet5-staticfiles-text

If you go to the root of the URL, though, you’ll notice that your index.html doesn’t get retrieved unless you request it explicitly:

aspnet5-staticfiles-nodefault

That “Hello World” is coming from the end of the pipeline we defined in Configure(), because UseStaticFiles() doesn’t know what to return if we don’t specify a file that exists. We can sort this out by calling UseDefaultFiles():

        public void Configure(IApplicationBuilder app)
        {
            app.UseIISPlatformHandler();
            
            app.UseDefaultFiles();
            app.UseStaticFiles();

            app.Run(async (context) =>
            {
                await context.Response.WriteAsync("Hello World!");
            });
        }

UseDefaultFiles() will look for typical default files such as index.html, default.html, etc. It must be declared before UseStaticFiles(), or it won’t work. We now get our default page:

aspnet5-staticfiles-withdefault

If you want to show a directory listing for folders with no such default files, call UseDefaultFiles() (note: again, order is important):

        public void Configure(IApplicationBuilder app)
        {
            app.UseIISPlatformHandler();
            
            app.UseDefaultFiles();
            app.UseDirectoryBrowser();
            app.UseStaticFiles();

            app.Run(async (context) =>
            {
                await context.Response.WriteAsync("Hello World!");
            });
        }

Our root still serves the default index.html, but when navigating to the images folder, we are presented with a directory listing:

aspnet5-staticfiles-dirlisting

You can also achieve what we have done so far using the UseFileServer() method. Refer to the official documentation on static files to learn how to use UseFileServer(), and for additional configuration options provided by the features we have seen so far.

Leave a Reply

Your email address will not be published. Required fields are marked *