Angular und WebAPI Konfiguration

Question

Wir haben eine Angular 4 App und eine WebAPI App (.NET Framework). Wir haben eine Azure-Anwendung eingerichtet, auf der beide Apps bereitgestellt sind (Client und Dienst). Der Root-Pfad zeigt auf den Client.

Die HTTP-Anfragen an unsere API (/ api/{controller} /) erreichen nicht unseren Dienst und es sieht so aus, als ob die angulare Route sie abholt und den index.html als Antwortinhalt zurückgibt.

Wie können wir Azure so einrichten, dass unsere Angular-Anwendung den HTML/CSS/JS-Inhalt und alle Aufrufe von "/ api /" -Routen an unseren Dienst bereitstellt?

Wir haben versucht, den Root-Pfad auf den Dienst zu zeigen, aber wir erhalten dann einen 404 für alle Nicht-API-Anfragen.

Answer 1

Um meine eigene Frage zu beantworten, ich brauchte statische Dateien zu dienen, wie in diesem Artikel beschrieben:

https://mirkomaggioni.com/2016/09/11/owin-middleware-for-static-files/

Auf den Punkt gebracht, entfaltet ich den Dienst (WebAPI) an die Azure Wurzel und dem Client (Angular 4) wird als kompilierter Ordner "dist" bereitgestellt.

Ich habe folgende NuGet Pakete:

<package id="Owin" version="1.0" targetFramework="net452" /> 
<package id="Microsoft.Owin" version="3.1.0" targetFramework="net462" /> 
<package id="Microsoft.Owin.FileSystems" version="3.1.0" targetFramework="net462" /> 
<package id="Microsoft.Owin.Host.SystemWeb" version="3.1.0" targetFramework="net462" /> 
<package id="Microsoft.Owin.StaticFiles" version="3.1.0" targetFramework="net462" /> 

Dann eine OWIN Startup-Klasse erstellt, die wie folgt aussieht:

public class Startup 
{ 
    public void Configuration(IAppBuilder app) 
    { 
     var physicalFileSystem = new PhysicalFileSystem(@"./dist"); 
     var options = new FileServerOptions 
     { 
      EnableDefaultFiles = true, 
      FileSystem = physicalFileSystem 
     }; 
     options.StaticFileOptions.FileSystem = physicalFileSystem; 
     options.StaticFileOptions.ServeUnknownFileTypes = true; 
     options.DefaultFilesOptions.DefaultFileNames = new[] 
     { 
      "index.html" 
     }; 

     app.UseFileServer(options); 
    } 
}