ASP.NET Core 中的静态文件(知识整理)

概念

静态文件(如HTML、CSS、图像和JS)是ASP.NET Core应用直接提供给客户端的资产,需要进行一些配置才能提供这些文件。

静态文件存储在项目的web根目录中,默认目录是 {content root}/wwwroot ,但是可以通过 UseWebRoot 方法修改。

使用默认路径

新建 wwwroot 文件夹,添加images文件夹,添加图片两张,分别为 .net.png 和 vue.png(文件设置为较新则复制)。

02新建wwwroot文件夹.png

在 Startup.Configure 中使用 UseStaticFiles 方法:

public void Configure(IApplicationBuilder app)
{
    app.UseStaticFiles();
}

无参数的 UseStaticFiles 方法将 Web根目录 中的文件标记为可用,引用方法如下

<img src="~/images/banner1.svg" alt="ASP.NET" class="img-responsive" />

也可以通过地址栏直接访问

03访问vue.png.png

使用其他路径

  • wwwroot
    • css
    • images
    • js
  • MyStaticFiles
    • images
      • java.png

如果此时想访问 java.png,可以修改设置如下:

app.UseStaticFiles();
app.UseStaticFiles(new StaticFileOptions
{
    FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), "MyStaticFiles")),
    RequestPath = "/StaticFiles"
});

两个UseStaticFiles,无参的提供对wwwroot目录中静态文件,第二个通过 “/StaticFiles”浏览 “MyStaticFiles”文件夹下的静态文件

引用方法如下:

<img src="~/StaticFiles/images/java.png" alt="ASP.NET" class="img-responsive" />

也可以通过地址栏访问

04其他目录.png

设置HTTP响应标头

StaticFileOptions 对象可用于设置HTTP响应标头。除配置从 Web根目录 提供静态文件wait,还可以设置 Cache-Control 标头

HeaderDictionaryExtensions.Append 方法存在于 Microsoft.AspNetCore.Http 包中。

app.UseStaticFiles(new StaticFileOptions
{
    OnPrepareResponse = ctx => {
        // 需要添加引用:using Microsoft.AspNetCore.Http;
        ctx.Context.Response.Headers.Append("Cache-Control", "public, max-age=600");
    }
});

效果如下:

05添加缓存.png

启用目录浏览

通过目录浏览,Web应用的用户可查看目录列表和指定目录中的文件。

出于安全考虑,目录浏览默认处于禁用状态

在StartUp.Configure 中的 UseDirectoryBrowser 方法来启用目录浏览。

app.UseDirectoryBrowser(new DirectoryBrowserOptions
{
    FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), "MyStaticFiles", "images")),
    RequestPath = "/Images"
});

效果如下

06目录浏览.png


如何将静态文件注入到项目中

在startup.cs文件的Configure方法中写入:

app.UseStaticFiles();

这方法的默认路径是wwwroot目录。

如何使用自己的文件路径

在startup.cs文件的Configure方法中写入:

app.UseStaticFiles(new StaticFileOptions()
{
  FileProvider = new PhysicalFileProvider(
  Path.Combine(Directory.GetCurrentDirectory(), @"MyStaticFiles")),
  RequestPath = new PathString("/StaticFiles")
});

这时候我们知道FileProvider是指定路径,RequestPath是将对外的路径重写。
即可用 StaticFiles来访问而不是MyStaticFiles
猜测这样地址重写的意义在于可以隐藏项目的路径结构同时易于访问(类似路由)。

如何浏览目录的文件与文件夹

在出于安全问题默认情况下是不允许浏览目录的文件和文件夹的,但是如果需要浏览可以用以下方法。

首先要在startup.cs文件的ConfigureServices方法中加入:

services.AddDirectoryBrowser();  

然后在startup.cs文件的Configure方法中写入:

app.UseDirectoryBrowser(new DirectoryBrowserOptions()
{
  FileProvider = new PhysicalFileProvider(
  Path.Combine(Directory.GetCurrentDirectory(), @"wwwroot\images")),
  RequestPath = new PathString("/wwwroot/images")
});

注:.net默认不开放静态文件夹的浏览,出于安全考虑


ASP.NET CORE中配置静态文件

在Statup.cs文件中的Configure中添加下列语句,必须在app.UseMvc()之前添加

app.UseStaticFiles(new StaticFileOptions()
{
    FileProvider = new PhysicalFileProvider(
        Path.Combine(Directory.GetCurrentDirectory(),"../AiXueXiImage/")),//表示在当前目录的上一级目录下的AiXueXiImage文件夹可以被访问
    RequestPath = new PathString("/MyImages")//设置虚拟目录
});
//AiXueXiImage文件夹下有一张图片 hi.png
//访问方式:http://主机地址:12585/MyImages/hi.ong
  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值