Externe Links in bestimmte Angular 2.0 SPA-States funktionieren nicht

8

Ich verwende AngularJS 2.4.6, Typescript 2.1.2, IIS 8.0, Chrome, Visual Studio 2015

Ich habe mit dem Angular Heroes-Tutorial gearbeitet und festgestellt, dass ich beim Aktualisieren des Browsers eine 404-Antwort erhielt (aufgrund der PathLocationStrategy -a HTML5-Pfadangabe - standardmäßig verwendet) ... also sinnvoll, weil IIS kein / Dashboard sieht zurückgeben.

Es gibt viele Lösungen da draußen, die das URL-Rewriting verwenden, was ich getan habe und das in der Tat korrekt zur index.html routet.

Mein Problem ist, wenn ich den Browser aktualisiere, möchte ich, dass er im selben Zustand ist, in dem er war. Dies funktionierte gut mit eckigen 1.5 unter Verwendung der Hash-Strategie, wie es tut.

Muss ich etwas Bestimmtes tun, um dieses Verhalten zu erzeugen? Wie es ist (Angular 2.0), endet die Aktualisierung, wodurch der Basiszustand angezeigt wird und nicht der, auf dem ich war.

Ich merke, dass die Rewrite-Aktion eine 301 zurück an den Browser sendet, so dass die index.html wiederum den beabsichtigten Zustand nicht kennt.

Wichtig: Wie würde ein externer Link (z. B. von einer E-Mail) in einen Angular 2 App-spezifischen Zustand funktionieren?

Wenn ich zum Beispiel eine E-Mail mit einem Link zu meiner App aussende: Ссылка

Dieses einfache Szenario scheint von allem, was ich ausprobiert habe, nicht mit IIS zu funktionieren.

Dieses Projekt beinhaltet keine MVC. Der Client-Code macht Ajax-Anfragen an ein Webapi Middletier-Web, aber für die Zwecke dessen, was ich frage, können Sie davon ausgehen, dass es überhaupt keine http-Aufrufe gibt.

    
Brandon 08.11.2016, 15:19
quelle

2 Antworten

0

Haben Sie versucht, die Hash-Strategie zu verwenden?

%Vor%     
Velter 21.02.2017 17:06
quelle
0

Ich nehme an, dass Sie Ihre Lösung mit ASP.NET MVC für Visual Studio 2015 und index.html im Stammverzeichnis Ihrer Lösung mit einem Minimum an Datei- / Ordnerstruktur wie folgt entwickeln:

%Vor%

Schritt 1 : web.config-Konfiguration

Fügen Sie den folgenden rewrite rules zu system.webServer Abschnitt Ihrer web.config hinzu:

%Vor%

Diese Konfiguration leitet alle Anfragen (außer / api und / assets) an Ihre index.html um. Sie können dieses Verhalten anpassen.

Vergessen Sie auch nicht webpages in appSettings :

zu aktivieren %Vor%

BEARBEITEN

Fügen Sie buildProviders für html Erweiterung in system.web 'Kompilierung' hinzu.

%Vor%

Schritt 2 : index.html

Stellen Sie sicher, dass base href zwischen <head> ... </head> -Tags in Ihrer index.html:

enthalten ist %Vor%

Schritt 3 : Global.asax-Konfiguration

Sie müssen html extension registrieren. Fügen Sie Global.asax.cs einfach die folgende Methode hinzu:

%Vor%

und rufen Sie RegisterHtmlExtension(); in der Methode Application_Start() auf.

Sie müssen keine Routen für Ihre angular views (Vorlagen) registrieren. Die folgende (minimale) Serverroutenkonfiguration wäre genug:

%Vor%

Wenn Sie über WebAPI-Controller verfügen, benötigen Sie möglicherweise die entsprechende Routenkonfiguration. Diese Konfiguration sollte funktionieren:

%Vor%

Und Sie müssen diese Routen registrieren, indem Sie in der GlobalConfiguration.Configure(WebApiRouteProvider.Register); -Methode Application_Start() in aufrufen.

Fazit

Auf diese Weise können Sie alle Anfragen an Ihre index.html umleiten (mit Ausnahme der Pfade, die in den Umschreibungsregeln explizit definiert sind).

Und Angular kann alle Anfragen mit vorgegebenen Pfaden abfangen (zB Ссылка , Ссылка , usw.), was zu gerenderten Komponenten mit den angegebenen Routen führt.

    
Burak Tasci 15.02.2017 10:12
quelle