使用 OWIN 的静态文件服务器 -> 找不到文件错误

Question

我的应用程序是 Azure Service Fabric 中的运行。在我的应用程序中，我使用 asp.net web api 和 angularJS 作为前端。我的网站 api 是通过 OWIN/Katana 自行托管的，效果很好。

为了向客户端提供静态文件，我正在使用 OWIN 静态文件服务器。为了使用文件服务器，我从 Service Fabric 示例中获取了配置。

public void Configuration(IAppBuilder appBuilder)
        {   
            HttpConfiguration httpConfig = this.ConfigureWebApi();
            FileServerOptions fileServerOptions = this.ConfigureFileSystem(appBuilder);

            appBuilder.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);
            appBuilder.UseWebApi(this.ConfigureWebApi());
            appBuilder.UseFileServer(fileServerOptions);  
        }

private FileServerOptions ConfigureFileSystem(IAppBuilder appBuilder)
        {
            PhysicalFileSystem physicalFileSystem = new PhysicalFileSystem(@".\wwwroot");
            FileServerOptions fileOptions = new FileServerOptions();

            fileOptions.EnableDefaultFiles = true;
            fileOptions.RequestPath = PathString.Empty;
            fileOptions.FileSystem = physicalFileSystem;
            fileOptions.DefaultFilesOptions.DefaultFileNames = new[] { "index.html" };
            fileOptions.StaticFileOptions.FileSystem = fileOptions.FileSystem = physicalFileSystem;
            fileOptions.StaticFileOptions.ServeUnknownFileTypes = true;

            return fileOptions;
        }

文件目录如下所示：

wwwroot

--+ app

----+ content

------+ css

-------- site.css

----+ bower_components

------+ angular

-------- angular.min.js

----- app.js

--- index.html

构建后所有这些文件也在 bin/Debug/ 文件夹中。当我在浏览器中打开地址 http://localhost:80/ 时，我得到了 index.html 文件。但是找不到除 http://localhost:80/app/app.js 之外的所有其他文件。

index.html 中的引用如下所示：

<link href="app/content/css/site.css" rel="stylesheet" />
<script src="app/bower_components/angular/angular.min.js"></script>
<script src="app/app.js"></script>

我尝试了很多其他配置，但都没有用。有什么问题吗，我看不到？

Answer 1

我发现了问题。要将所有文件从 wwwroot 文件夹复制到 Debug/bin/ 文件夹，我在 Visual Studio 中使用此命令：XCOPY "$(SolutionDir)WebAppApi.Service\wwwroot" "$(TargetDir)wwwroot" /s /i /y。我认为这与将 "Copy To Output Directory"-属性设置为 "Copy if newer" 或 "copy always" 一样。 XCOPY 命令将所有文件复制到调试文件夹中。但在 Azure Service Fabric 中，所有包含的服务 (\[application name]\pkg\Debug\[service project name]Pkg\Code\wwwroot) 也有一个 "main" 调试文件夹。并且在该文件夹中没有 wwwroot 文件夹，因为除了 index.html 和 app.js 之外，所有文件都具有 "Do not copy" 作为 "Copy To Output Directory"-属性。 =18=]

Answer 2

我为同样的问题苦苦挣扎了几个小时。除了我需要复制从 webpack 构建生成的文件。所以我将以下代码片段添加到 sfproj 文件中。

<PropertyGroup>
  <FrontendApplication>FrontendAppName</FrontendApplication>
</PropertyGroup>
<ItemGroup>
   <ClientSourceFiles Include="$(SolutionDir)$(FrontendApplication)\app\build\**\*.*" />    
</ItemGroup>
<Target Name="CopyAppToPackage" AfterTargets="CollectServiceCodeFiles">
 <Copy SourceFiles="@(ClientSourceFiles)" DestinationFolder="$(SolutionDir)$(ProjectName)\pkg$(ConfigurationName)$(FrontendApplication)Pkg\Code\wwwroot\%(RecursiveDir)" />
</Target>

app\build是webpack的输出目录，wwwroot是PhysicalFileSystem.

使用的目录

这解决了服务结构构建目标中的任务之一清理包目录的问题。

使用 OWIN 的静态文件服务器 -> 找不到文件错误

Static file server with OWIN -> files not found error

self-hosting

asp.net-web-api

angularjs

owin

azure-service-fabric