之前的ASP.NET網(wǎng)站，只要把.html、.css、.jpg、.png、*.js等靜態(tài)文件放在項(xiàng)目根目錄，默認(rèn)都可以直接被瀏覽；但ASP.NET Core 小改了瀏覽靜態(tài)文件的方式，默認(rèn)根目錄不再能瀏覽靜態(tài)文件，需要指定靜態(tài)文件的目錄，才可以被瀏覽。
本篇將介紹ASP.NET Core瀏覽靜態(tài)文件的方法。
試著在項(xiàng)目根目錄及wwwroot目錄中加入靜態(tài)文件，例如：
項(xiàng)目根目錄\index.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>MyWebsite</title>
</head>
<body>
項(xiàng)目根目錄的 index.html
</body>
</html>
項(xiàng)目根目錄\wwwroot\index.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>MyWebsite</title>
</head>
<body>
wwwroot目錄的 index.html
</body>
</html>
然后在網(wǎng)址欄輸入：
http://localhost:5000/index.html
http://localhost:5000/wwwroot/index.html
會(huì)發(fā)現(xiàn)以上兩個(gè)鏈接都沒(méi)有辦法打開(kāi)index.html。
瀏覽靜態(tài)文件，需要Microsoft.AspNetCore.StaticFiles中間件，ASP.NET Core 2.0以上版本默認(rèn)包含。
啟用靜態(tài)文件
在Startup.cs的Configure對(duì)IApplicationBuilder使用UseStaticFiles方法注冊(cè)靜態(tài)文件的Middleware：
Startup.cs
// ...
public class Startup
{
public void Configure(IApplicationBuilder app)
{
app.UseStaticFiles();
// ...
app.Run(async context =>
{
await context.Response.WriteAsync("Hello World! \r\n");
});
}
}
UseStaticFiles默認(rèn)啟用靜態(tài)文件的目錄是wwwroot，設(shè)定完成后再次嘗試開(kāi)啟URL：
http://localhost:5000/index.html
開(kāi)啟的內(nèi)容會(huì)是：wwwroot目錄的index.html。
http://localhost:5000/wwwroot/index.html
依然無(wú)法顯示靜態(tài)文件。
UseStaticFiles注冊(cè)的順序可以在外層一點(diǎn)，比較不會(huì)經(jīng)過(guò)太多不必要的Middleware。如圖：
當(dāng)Requset的URL文件不存在，則會(huì)轉(zhuǎn)向到Run的事件(如灰色箭頭)。
變更網(wǎng)站目錄
默認(rèn)網(wǎng)站目錄是wwwroot，如果想要變更此目錄，可以在Program.cs的WebHost Builder用UseWebRoot設(shè)置網(wǎng)站默認(rèn)目錄。
例如：把默認(rèn)網(wǎng)站目錄wwwroot改為public，如下：
using Microsoft.AspNetCore;
using Microsoft.AspNetCore.Hosting;
namespace MyWebsite
{
public class Program
{
public static void Main(string[] args)
{
BuildWebHost(args).Run();
}
public static IWebHost BuildWebHost(string[] args) =>
WebHost.CreateDefaultBuilder(args)
.UseWebRoot("public")
.UseStartup<Startup>()
.Build();
}
}
啟用指定目錄
由于UseStaticFiles只能拿到默認(rèn)文件夾底下的文件，某些情況會(huì)需要特定目錄也能使用靜態(tài)文件。
例如：用npm安裝的第三方庫(kù)都放在項(xiàng)目目錄底下的node_modules。
Startup.cs
// ...
public class Startup
{
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
app.UseStaticFiles();
app.UseStaticFiles(new StaticFileOptions()
{
FileProvider = new PhysicalFileProvider(
Path.Combine(env.ContentRootPath, @"node_modules")),
RequestPath = new PathString("/third-party")
});
// ...
}
}
以上設(shè)定就會(huì)把URL http://localhost:5000/third-party/example.js指向到項(xiàng)目目錄\node_modules\example.js。
默認(rèn)文件
比較友好的用戶體驗(yàn)會(huì)希望http://localhost:5000/可以自動(dòng)指向到index.html。
能通過(guò)UseDefaultFiles設(shè)定靜態(tài)文件目錄的默認(rèn)文件。
Startup.cs
public class Startup
{
public void Configure(IApplicationBuilder app)
{
app.UseDefaultFiles();
app.UseStaticFiles();
// ...
}
}
文件清單
基本上為了網(wǎng)站安全性考量，不應(yīng)該讓使用者瀏覽服務(wù)器上面的文件清單，但如果真有需求要讓使用者瀏覽文件清單也不是不行。
在Startup.cs的Configure對(duì)IApplicationBuilder使用UseFileServer方法注冊(cè)文件服務(wù)器的功能：
Startup.cs
public class Startup
{
// ...
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
app.UseFileServer(new FileServerOptions()
{
FileProvider = new PhysicalFileProvider(
Path.Combine(env.ContentRootPath, @"bin")
),
RequestPath = new PathString("/StaticFiles"),
EnableDirectoryBrowsing = true
});
}
}
當(dāng)打開(kāi)http://localhost:5000/StaticFiles時(shí)，就指向到項(xiàng)目目錄\bin\目錄，并且可以直接瀏覽文件目錄及文件內(nèi)容，如下：
