微商城設(shè)計(jì)網(wǎng)站建設(shè)沈陽(yáng)專(zhuān)業(yè)seo排名優(yōu)化公司
隨著技術(shù)的發(fā)展,ASP.NET Core MVC也推出了好長(zhǎng)時(shí)間,經(jīng)過(guò)不斷的版本更新迭代,已經(jīng)越來(lái)越完善,本系列文章主要講解ASP.NET Core MVC開(kāi)發(fā)B/S系統(tǒng)過(guò)程中所涉及到的相關(guān)內(nèi)容,適用于初學(xué)者,在校畢業(yè)生,或其他想從事ASP.NET Core MVC 系統(tǒng)開(kāi)發(fā)的人員。?經(jīng)過(guò)前幾篇文章的講解,初步了解ASP.NET Core MVC項(xiàng)目創(chuàng)建,啟動(dòng)運(yùn)行,以及命名約定,創(chuàng)建控制器,視圖,模型,接收參數(shù),傳遞數(shù)據(jù),路由,頁(yè)面布局等內(nèi)容,今天繼續(xù)講解ASP.NET Core MVC?wwwroot和客戶端庫(kù)等相關(guān)內(nèi)容,僅供學(xué)習(xí)分享使用。
wwwroot文件夾概述
通過(guò)模板創(chuàng)建的ASP.NET Core MVC項(xiàng)目,會(huì)在程序根目錄創(chuàng)建一個(gè)wwwroot文件夾。此文件夾又稱為webroot文件夾,主要用于存放靜態(tài)資源文件,如:html,JavaScript,css樣式等內(nèi)容。默認(rèn)情況下,存在wwwroot文件夾下的所有靜態(tài)資源都可以通過(guò)Http請(qǐng)求提供服務(wù)。在新的框架中,且只有存放于wwwroot目錄下的靜態(tài)資源可以直接通過(guò)Http訪問(wèn),其他目錄下的靜態(tài)資源都將阻止。
靜態(tài)資源中間件
為了使wwwroot目錄下的靜態(tài)資源能夠被Http直接訪問(wèn),需要在程序啟動(dòng)時(shí)【Program.cs】加載靜態(tài)資源中間件。如下所示:
var builder = WebApplication.CreateBuilder(args);// Add services to the container.
builder.Services.AddControllersWithViews();var app = builder.Build();// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{app.UseExceptionHandler("/Home/Error");// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.app.UseHsts();
}app.UseHttpsRedirection();//1. 啟動(dòng)靜態(tài)資源服務(wù)中間件
app.UseStaticFiles();app.UseRouting();app.UseAuthorization();app.MapControllerRoute(name: "default",pattern: "{controller=Home}/{action=Index}/{id?}");app.Run();
靜態(tài)資源示例
根據(jù)模板創(chuàng)建的ASP.NET Core MVC項(xiàng)目,直接運(yùn)行,會(huì)通過(guò)路由設(shè)置,默認(rèn)加載Home/Index頁(yè)面,如下所示:
在wwwroot目錄下,創(chuàng)建index.html,內(nèi)容如下所示:
<!DOCTYPE html>
<html>
<head><meta charset="utf-8" /><title>靜態(tài)首頁(yè)</title>
</head>
<body><h1>公子小六</h1><h2>這是靜態(tài)首頁(yè)</h2>
</body>
</html>
在Program.cs啟動(dòng)文件中,添加默認(rèn)文件中間件【app.UseDefaultFiles();】,如下所示:
var builder = WebApplication.CreateBuilder(args);
// Add services to the container.
builder.Services.AddControllersWithViews();
var app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{app.UseExceptionHandler("/Home/Error");// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.app.UseHsts();
}
app.UseHttpsRedirection();//0. 允許默認(rèn)文件映射
app.UseDefaultFiles();
//1. 啟動(dòng)靜態(tài)資源服務(wù)中間件
app.UseStaticFiles();app.UseRouting();
app.UseAuthorization();
app.MapControllerRoute(name: "default",pattern: "{controller=Home}/{action=Index}/{id?}");app.Run();
再次運(yùn)行程序,會(huì)發(fā)現(xiàn)靜態(tài)默認(rèn)首頁(yè)Index.html會(huì)替換之前默認(rèn)的Home/Index路由視圖,如下所示:
通過(guò)以上示例得出在結(jié)論:默認(rèn)靜態(tài)資源首頁(yè)優(yōu)先級(jí)高于默認(rèn)路由。
修改默認(rèn)資源名稱
默認(rèn)啟動(dòng)靜態(tài)資源名稱為Index.html,可以通過(guò)DefaultFilesOptions指定默認(rèn)的首頁(yè)加載順序和名稱。如下所示:
var builder = WebApplication.CreateBuilder(args);
// Add services to the container.
builder.Services.AddControllersWithViews();
var app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{app.UseExceptionHandler("/Home/Error");// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.app.UseHsts();
}
app.UseHttpsRedirection();//默認(rèn)文件啟動(dòng)項(xiàng)
DefaultFilesOptions options = new DefaultFilesOptions();
options.DefaultFileNames.Add("Hello.html");
//0. 允許默認(rèn)文件映射
app.UseDefaultFiles(options);//1. 啟動(dòng)靜態(tài)資源服務(wù)中間件
app.UseStaticFiles();app.UseRouting();
app.UseAuthorization();
app.MapControllerRoute(name: "default",pattern: "{controller=Home}/{action=Index}/{id?}");app.Run();
修改后再次啟動(dòng),發(fā)現(xiàn)加載的依然是Index.html,而不是Hello.html。經(jīng)過(guò)調(diào)試發(fā)現(xiàn),DefaultFilesOptions的默認(rèn)加載頁(yè)面,會(huì)自動(dòng)填充4個(gè)默認(rèn)頁(yè)面名稱。后面添加的頁(yè)面名稱會(huì)在原有默認(rèn)頁(yè)面之后。如下所示:
?經(jīng)過(guò)以上分析,刪除默認(rèn)的index.html頁(yè)面,重新啟動(dòng),默認(rèn)首頁(yè)變成了Hello.html頁(yè)面,如下所示:
?靜態(tài)資源文件除了可以通過(guò)靜態(tài)資源中間件來(lái)實(shí)現(xiàn)【app.UseStaticFiles()】,還可以通過(guò)文件服務(wù)中間件來(lái)實(shí)現(xiàn),如下所示:
FileServerOptions options = new FileServerOptions();
options.DefaultFilesOptions.DefaultFileNames.Add("Hello.html");
app.UseFileServer(options);
修改靜態(tài)資源目錄
默認(rèn)的靜態(tài)資源目錄為wwwroot,一般也是通用的webroot文件夾名稱,如果需要修改成其他目錄 ,可以通過(guò)WebApplication.CreateBuilder(options)中的選項(xiàng)進(jìn)行修改,接線所示:
WebApplicationOptions weboptions = new WebApplicationOptions() { WebRootPath="wwwroot2" };
var builder = WebApplication.CreateBuilder(weboptions);
修改后,重新運(yùn)行程序,如下所示:
注意:為了讓wwwroot2生效,必須修改原有的wwwrooot文件名稱或者刪除wwwroot文件夾,否則wwwroot2將不生效。
客戶端庫(kù)
客戶端庫(kù)主要是指JavaScript,CSS等第三方庫(kù),在ASP.NET Core MVC項(xiàng)目中,安裝客戶端庫(kù)如下所示:
在項(xiàng)目名稱處右鍵,選擇添加,客戶端庫(kù),如下所示:
?在打開(kāi)的客戶端庫(kù)添加窗口,可以選擇需要的庫(kù)名稱,進(jìn)行搜索,然后進(jìn)行安裝即可,如下所示:
?安裝成功后,在目標(biāo)位置即可進(jìn)行查看,如下所示:
以上就是關(guān)于ASP.NET Core MVC項(xiàng)目中wwwroot和客戶端庫(kù)相關(guān)內(nèi)容。關(guān)于客戶端庫(kù)在安裝成功后,如何在頁(yè)面中引用,將在后續(xù)章節(jié)中進(jìn)行介紹。