首页 > 行业数据 >

天天头条:ASP.NET Core MVC 从入门到精通之wwwroot和客户端库

时间:2023-04-21 02:25:20来源:博客园

随着技术的发展,ASP.NET Core MVC也推出了好长时间,经过不断的版本更新迭代,已经越来越完善,本系列文章主要讲解ASP.NET Core MVC开发B/S系统过程中所涉及到的相关内容,适用于初学者,在校毕业生,或其他想从事ASP.NET Core MVC 系统开发的人员。经过前几篇文章的讲解,初步了解ASP.NET Core MVC项目创建,启动运行,以及命名约定,创建控制器,视图,模型,接收参数,传递数据,路由,页面布局等内容,今天继续讲解ASP.NET Core MVC wwwroot和客户端库等相关内容,仅供学习分享使用。


(资料图片仅供参考)

wwwroot文件夹概述

通过模板创建的ASP.NET Core MVC项目,会在程序根目录创建一个wwwroot文件夹。此文件夹又称为webroot文件夹,主要用于存放静态资源文件,如:html,JavaScript,css样式等内容。默认情况下,存在wwwroot文件夹下的所有静态资源都可以通过Http请求提供服务。在新的框架中,且只有存放于wwwroot目录下的静态资源可以直接通过Http访问,其他目录下的静态资源都将阻止。

静态资源中间件

为了使wwwroot目录下的静态资源能够被Http直接访问,需要在程序启动时【Program.cs】加载静态资源中间件。如下所示:

1 var builder = WebApplication.CreateBuilder(args); 2  3 // Add services to the container. 4 builder.Services.AddControllersWithViews(); 5  6 var app = builder.Build(); 7  8 // Configure the HTTP request pipeline. 9 if (!app.Environment.IsDevelopment())10 {11     app.UseExceptionHandler("/Home/Error");12     // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.13     app.UseHsts();14 }15 16 app.UseHttpsRedirection();17 18 //1. 启动静态资源服务中间件19 app.UseStaticFiles();20 21 app.UseRouting();22 23 app.UseAuthorization();24 25 app.MapControllerRoute(26     name: "default",27     pattern: "{controller=Home}/{action=Index}/{id?}");28 29 app.Run();

静态资源示例

创建程序后,直接运行,会通过路由设置,默认加载Home/Index页面,如下所示:

在wwwroot目录下,创建index.html,内容如下所示:

1  2  3  4      5     静态首页 6  7  8     

公子小六

9

这是静态首页

10 11

在Program.cs启动文件中,添加默认文件中间件【app.UseDefaultFiles();】,如下所示:

1 var builder = WebApplication.CreateBuilder(args); 2 // Add services to the container. 3 builder.Services.AddControllersWithViews(); 4 var app = builder.Build(); 5 // Configure the HTTP request pipeline. 6 if (!app.Environment.IsDevelopment()) 7 { 8     app.UseExceptionHandler("/Home/Error"); 9     // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.10     app.UseHsts();11 }12 app.UseHttpsRedirection();13 14 15 //0. 允许默认文件映射16 app.UseDefaultFiles();17 //1. 启动静态资源服务中间件18 app.UseStaticFiles();19 20 21 app.UseRouting();22 app.UseAuthorization();23 app.MapControllerRoute(24     name: "default",25     pattern: "{controller=Home}/{action=Index}/{id?}");26 27 app.Run();

再次运行程序,会发现静态默认首页Index.html会替换之前默认的Home/Index路由视图,如下所示:

通过以上示例得出在结论:默认静态资源首页优先级高于默认路由。

修改默认资源名称

默认启动静态资源名称为Index.html,可以通过DefaultFilesOptions指定默认的首页加载顺序和名称。如下所示:

1 var builder = WebApplication.CreateBuilder(args); 2 // Add services to the container. 3 builder.Services.AddControllersWithViews(); 4 var app = builder.Build(); 5 // Configure the HTTP request pipeline. 6 if (!app.Environment.IsDevelopment()) 7 { 8     app.UseExceptionHandler("/Home/Error"); 9     // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.10     app.UseHsts();11 }12 app.UseHttpsRedirection();13 14 //默认文件启动项15 DefaultFilesOptions options = new DefaultFilesOptions();16 options.DefaultFileNames.Add("Hello.html");17 //0. 允许默认文件映射18 app.UseDefaultFiles(options);19 20 //1. 启动静态资源服务中间件21 app.UseStaticFiles();22 23 app.UseRouting();24 app.UseAuthorization();25 app.MapControllerRoute(26     name: "default",27     pattern: "{controller=Home}/{action=Index}/{id?}");28 29 app.Run();

修改后再次启动,发现加载的依然是Index.html,而不是Hello.html。经过调试发现,DefaultFilesOptions的默认加载页面,会自动填充4个默认页面名称。后面添加的页面名称会在原有默认页面之后。如下所示:

经过以上分析,删除默认的index.html页面,重新启动,默认首页变成了Hello.html页面,如下所示:

静态资源文件除了可以通过静态资源中间件来实现【app.UseStaticFiles()】,还可以通过文件服务中间件来实现,如下所示:

1 FileServerOptions options = new FileServerOptions();2 options.DefaultFilesOptions.DefaultFileNames.Add("Hello.html");3 app.UseFileServer(options);

修改静态资源目录

默认的静态资源目录为wwwroot,一般也是通用的webroot文件夹名称,如果需要修改成其他目录 ,可以通过WebApplication.CreateBuilder(options)中的选项进行修改,接线所示:

1 WebApplicationOptions weboptions = new WebApplicationOptions() { WebRootPath="wwwroot2" };2 var builder = WebApplication.CreateBuilder(weboptions);

修改后,重新运行程序,如下所示:

注意:为了让wwwroot2生效,必须修改原有的wwwrooot文件名称或者删除wwwroot文件夹,否则wwwroot2将不生效。

客户端库

客户端库主要是指JavaScript,CSS等第三方库,在ASP.NET Core MVC项目中,安装客户端库如下所示:

在项目名称处右键,选择添加,客户端库,如下所示:

在打开的客户端库添加窗口,可以选择需要的库名称,进行搜索,然后进行安装即可,如下所示:

安装成功后,在目标位置即可进行查看,如下所示:

以上就是关于ASP.NET Core MVC项目中wwwroot和客户端库相关内容。关于客户端库在安装成功后,如何在页面中引用,将在后续章节中进行介绍。

关键词:
x 广告
共同抗疫!郑州71岁党员志愿者每天爬6栋楼,提醒800多户居民做核酸

1月4日,郑州市新冠肺炎疫情防控指挥部办公室发布通告对部分区域实施管控措施。这是近半年来,新冠疫情第3次造访郑州。截止至1月10日24时,

安阳疫情最新消息|1月11日8时至12日8时安阳市新增本土确诊病例39例,累计123例

安阳疫情最新消息2022年1月11日8时至12日8时安阳市新型冠状病毒肺炎疫情最新情况1月11日8时至12日8时,全市新增本土确诊病例39例(汤阴县38

迅速高效!“河南抗疫互助通道”网上网下联动 获群众点赞

核酸检测24小时了还没查到结果,怎么办?现在高速下站口的管控政策到底是什么样子的?从洛阳老城区自驾走高速回郑州,收费站还劝返吗?苏八

信阳市疫情防控工作视频调度会召开 陈志伟出席会议

1月11日,市疫情防控工作视频调度会召开。代市长陈志伟出席会议并讲话。听取有关疫情防控重点工作和各县区(管理区、开发区)疫情防控工作

全国最新疫情消息:11日新增本土确诊病例166例 天津市今日启动第二轮全员核酸检测

11日0—24时,31个省(自治区、直辖市)和新疆生产建设兵团报告新增新冠肺炎本土确诊病例166例(河南118例,其中安阳市65例、许昌市41例、

1月12日天津市放假半天 开启第二轮全员核酸检测

1月12日,天津市人民政府发布重要通告,为做好天津市第二轮全员核酸检测工作,全市机关和企事业单位于1月12日(星期三)下午放假半天。广大

x 广告

Copyright ©  2015-2022 纵横评测网版权所有  备案号:浙ICP备2022016517号-12   联系邮箱:51 46 76 11 3 @qq.com