CPA CPA -4 years ago 101
AngularJS Question

Static file server with OWIN -> files not found error

My application is running in Azure Service Fabric. In my application I'm using asp.net web api with angularJS as frontend. My web api is self hostet with OWIN/Katana and that works great.

To serve the static files to the client, I'm using OWIN static fileserver. To use the fileserver I took the configuration from Service Fabric examples.

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;
}


The directory of the files looks like this:

wwwroot

--+ app

----+ content

------+ css

-------- site.css

----+ bower_components

------+ angular

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

----- app.js

--- index.html


All these files are also in the bin/Debug/ folder after build. When I'm opening the adress
http://localhost:80/
in browser I'm getting the
index.html
file. But all other files except of
http://localhost:80/app/app.js
can't be found.

The references in index.html look like this:

<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>


I tried a lot of other configurations, but it didn't work. Is there anything wrong, what I can't see?

Answer Source

I found the problem. To copy all files from the wwwroot folder to the Debug/bin/ folder, I use this command in Visual Studio: XCOPY "$(SolutionDir)WebAppApi.Service\wwwroot" "$(TargetDir)wwwroot" /s /i /y. I thought it is the same like I would set the "Copy To Output Directory"-property to "Copy if newer" or "copy always". The XCOPY command copies all files into the debug folder. But in Azure Service Fabric there is also a "main" debug folder for all included services (\[application name]\pkg\Debug\[service project name]Pkg\Code\wwwroot). And in that folder there is no wwwroot folder, because all files have "Do not copy" as "Copy To Output Directory"-property except of index.html and app.js.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download