posted at 2020.7.20 06: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、运行应用程序，效果如图：
5b5c49ee-a28c-4553-bae2-79c670c465d6|0|.0|96d5b379-7e1d-4dac-a6ba-1e50db561b04
Tags: Web, 代码, 方法, 程序, 类
IT技术
