posted at 2020.7.20 08:48 by administrator
静态文件是相对于可在服务器上执行的文件(例如Razor视图)而言的,常见的静态文件有CSS样式表、JavaScript脚本、多媒体文件、HTML静态页面等。
ASP.NET Core应用程序默认是不启用对静态文件访问的,如果启用对静态文件的访问,需要在Startup.Configure方法中调用UseStaticFiles方法。
静态文件在默认情况下位于项目的/wwwroot目录下,若要更改静态文件位置,可以使用StaticFileOptions类来进行配置。
下面演示一下如何设置静态文件选项,使得视图页面能够访问位于/wwwroot/extLibs/js目录下的JQuery脚本,即通过http://localhost/js/jquery.js就能访问脚本文件了。
1、 新建一个空白的ASP.NET Core Web应用程序项目。
2、 在Startup.ConfigureServices方法中注册MVC功能服务。
代码:
public void ConfigureServices(IServiceCollection services)
{
services.AddMvc();
}
3、 对于Startup.Configure方法,在调用UseMvc方法之前,需要先调用UseStaticFiles方法对静态文 件参数进行配置。
代码:
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
StaticFileOptions sfoption = new StaticFileOptions
{
FileProvider = new PhysicalFileProvider(Path.Combine(env.WebRootPath, "extLibs/js")), RequestPath = "/js" };
app.UseStaticFiles(sfoption); app.UseMvc();
}
允许访问的静态文件所在的目录为/wwwroot/extLibs/js,映射后的相对URL为/js。之所以先于UseMvc方法调用UseStaticFiles方法,是为了优先处理对静态文件的请求,如果客户端访问的不是静态文件,再转到MVC框架进行处理。
4、在项目所在的目录下新建一个Pages目录,并添加Index.cshtml页面。
代码:
@page "~/"
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
#rect{ background-color:red;
position:relative; float:left;
width:100px; height:100px; margin:8px }
</style>
<script type="text/javascript" src="/js/jquery.js"></script>
</head>
<body>
<div>
<button id="btnstart">向右移动</button>
<button id="btnreset">重置</button>
</div>
<div>
<div id="rect"/>
</div>
<script type="text/javascript">
$("#btnstart").click(() => { $("#rect").animate({ left: 150 }, 600); });
$("#btnreset").click(() => { $("#rect").css("left", 0); });
</script>
</body>
</html>
5、运行应用程序,效果如图:

76209cca-dc93-4d99-a90c-c24e851bd456|0|.0
Tags: Web, 代码, 方法, 程序, 类
IT技术