在ASP.NET 4.5项目中使用wwwroot文件夹(ASP.NET Core样式)

Question

我非常喜欢新的asp.net(asp.net 5\core 1.0)web应用程序的方法,其中wwwroot文件夹是根目录,只有静态文件才能提供.

可以通过路由或其它配置有一个asp.net 4.5项目的行为一个wwwroot文件夹以类似的方式,这样的静态文件只担任了它,并且它的web应用程序的静态文件的"根"？

(我提出这个问题的部分原因是我在VS2015中的asp.net 5项目中有一个角色应用程序,但是我需要将它转移到asp.net 4.5项目中,但是希望将现有结构保留在磁盘上)

尝试使用OWIN

我尝试使用一个空的ASP.NET 4.5 Web应用程序项目和OWIN.所以我的文件夹结构有我的角度应用程序,在项目文件夹的wwwroot文件夹中有一个主index.html文件.项目的根目录中没有HTML文件.

我通过nuget和以下启动文件添加了OWIN:

[assembly: OwinStartup(typeof(MyApp.UI.Startup))]
namespace MyApp.UI
{
    public class Startup
    {
        public void Configuration(IAppBuilder app)
        {
            string root = AppDomain.CurrentDomain.BaseDirectory;
            var physicalFileSystem = new PhysicalFileSystem(Path.Combine(root, "wwwroot"));
            var options = new FileServerOptions
            {
                EnableDefaultFiles = true,
                FileSystem = physicalFileSystem
            };
            options.StaticFileOptions.FileSystem = physicalFileSystem;
            options.StaticFileOptions.ServeUnknownFileTypes = false;
            options.DefaultFilesOptions.DefaultFileNames = new[] {"index.html"};
            app.UseFileServer(options);
        }
    }
}

这虽然失败 - 我的index.html文件的源确实负载,当我运行它,但所有的CSS,JS等文件,它引用失败有404更糟的是,如果我追加gulpfile.js到根网址是从项目文件夹的根目录加载我的gulp文件.这正是我想要避免的那种事情.

有任何想法吗？

Answer 1

我相信我现在有一个工作方法.进行了一些谷歌搜索和实验,但最后我想出了以下过程:

1. 在VS2015中创建一个新的ASP.NET 4.5项目,选择空模板

2. 通过nuget(Install-Package Microsoft.Owin.Host.SystemWeb和Microsoft.Owin.StaticFiles)添加OWIN引用

3. 添加类似于此的启动文件:

   [assembly: OwinStartup(typeof(MyApp.Startup))]
   namespace MyApp.UI
   {
       public class Startup
       {
           public void Configuration(IAppBuilder app)
           {
               string root = AppDomain.CurrentDomain.BaseDirectory;
               var physicalFileSystem = new PhysicalFileSystem(Path.Combine(root, "wwwroot"));
               var options = new FileServerOptions
               {
                   RequestPath = PathString.Empty,
                   EnableDefaultFiles = true,
                   FileSystem = physicalFileSystem
               };
               options.StaticFileOptions.FileSystem = physicalFileSystem;
               options.StaticFileOptions.ServeUnknownFileTypes = false;
               app.UseFileServer(options);
           }
       }
   }
   

4. 将以下内容添加到web.config文件中,以防止IIS提供您不希望它的静态文件,并通过OWIN管道强制执行所有操作:

   <system.webServer>
       <handlers>
         <remove name="StaticFile"/>
         <add name="Owin" verb="" path="*" type="Microsoft.Owin.Host.SystemWeb.OwinHttpHandler, Microsoft.Owin.Host.SystemWeb"/>
       </handlers>
     </system.webServer>
   

对于如何做到这一点,我总是乐于接受更好的建议,但这至少对我有用.

Answer 2

虽然OWIN在我在VS 2017中运行的开发环境中为我工作,但是一旦部署到azure它就无法工作.我们也运行SPA,并将webpack输出存储在〜/ wwwroot /中,但希望它像在项目根目录中一样加载〜/就像.net core webapi那样.我只使用下面显示的URL重写来完成它:

<system.webServer>
<rewrite>
  <rules>
    <rule name="wwwRootFix" stopProcessing="true">
      <match url="(.*)" />
      <conditions logicalGrouping="MatchAll">
        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
        <add input="{APPL_PHYSICAL_PATH}wwwroot\{R:1}" matchType="IsFile" />
        <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
        <add input="{REQUEST_URI}" pattern="^/(wwwroot)" negate="true" />
      </conditions>
      <action type="Redirect" url="/wwwroot/{R:1}" />
    </rule>
    <rule name="React Routes" stopProcessing="true">
      <match url=".*" />
      <conditions logicalGrouping="MatchAll">
        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
        <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
        <add input="{REQUEST_URI}" pattern="^/(wwwroot)" negate="true" />
      </conditions>
      <action type="Rewrite" url="/wwwroot/index.html" />
    </rule>
  </rules>
</rewrite>
</system.webServer>

第一个规则确保您要查找的文件不存在于根目录中,不是文件夹,在新路径中找到,不是wwwroot文件夹,也不是api的一部分.如果满足所有这些条件,它会尝试从wwwroot加载数据.

第二个规则检查以确保您没有尝试加载api,或者根目录中实际存在的文件.如果满足两个条件,它将加载默认的SPA html文档(在我们的例子中,我们使用react).

实际上,这允许react-router 4在上述所有其他条件未能找到匹配之后处理所有其他路由,并使其在尝试加载其中一个react-router路由时不会抛出404错误.