2017-05-04 4 views
3

Ich habe einfache App mit einer Komponente, die bestimmte Parameter von URL erwartet. es nur einen Weg in der Anwendung ist:Angular 2 auf IIS gehostet: HTTP-Fehler 404

const appRoutes: Routes = 
         path: 'hero/:userId/:languageId',component: HeroWidgetComponent }]; 

Im Index.HTML, ich habe dies im Header <base href="/">

ich webpack bin mit und die Anwendung läuft auf Entwicklungsumgebung in Ordnung, wenn die URL Surfen : http://localhost:4000/hero/1/1.

Wenn Sie jedoch die App für die Produktion erstellen und die Verteilungsdateien erhalten, dann hosten Sie diese auf IIS. Ich erhalte die folgende Fehlermeldung beim Versuch, die gleiche URL zu durchsuchen:

HTTP Error 404.0 - Not Found 
The resource you are looking for has been removed, had its name changed, or is temporarily unavailable. 

Die Anwendung funktioniert gut, wenn ich alle Routing entfernen und nur sehen: http:localhost:4200 auf dem II.

+1

Ihr 'IIS' Server muss ordnungsgemäß konfiguriert werden, so dass alle Winkel Routen zu' index.html' weitergeleitet werden (oder die HTML-Datei, in der die Winkel App wird ausgelöst von). Leider bin ich kein 'IIS'-Serverexperte, daher kann ich Ihnen nicht genau sagen, wie Sie das genau machen. – tftd

Antwort

6

Wir müssen IIS auf index.html zurückfallen lassen, indem wir eine Rewrite-Regel hinzufügen.

Schritt 1: Installieren IIS URL Rewrite Modul

Schritt 2: eine Rewrite-Regel hinzufügen

<?xml version="1.0" encoding="utf-8"?> 
    <configuration> 
     <system.webServer> 
     <rewrite> 
      <rules> 
      <rule name="AngularJS Routes" stopProcessing="true"> 
       <match url=".*" /> 
       <conditions logicalGrouping="MatchAll"> 
       <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> 
       <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" /> 
       </conditions> 
       <action type="Rewrite" url="/" /> 
      </rule> 
      </rules> 
     </rewrite> 
     </system.webServer> 
    </configuration> 
+0

Ich hospitiere auf GoDaddy. Ich folgte diesem, aber ich musste IIS URL Rewrite nicht installieren, und es funktioniert einfach. – mapussah

+0

@mapussah, wahrscheinlich, weil dieses Modul bereits installiert ist. – Coding

+0

Hallo, ich folge dem gleichen Schritt, aber es geht immer noch auf 404 Fehler in meinem lokalen IIS. Ich habe das URL-Rewrite von dem angegebenen Link in die Antwort heruntergeladen. Nach der Ausführung heißt es bereits installiert. Kannst du mir bitte mitteilen, was mir fehlt? Ich entwickle Anwendung mit Angular 4, @ Angular/CLI, C# -Web API, VS 2015. –

0

web.config Wenn Sie eine IIS-Anwendung wie myApp unter Ihrem Standard verwenden Website (dann sollte die URL zu Ihrer Anwendung die Syntax http://localhost/myApp/my-angular-route haben), dann sollten Sie versuchen, die Aktion zu

zu ändern
<action type="Rewrite" url="/myApp/"/>; 

Dann funktioniert es für meine Umgebung ohne Probleme.

Schritt für Schritt-Anleitung finden Sie hier: https://blogs.msdn.microsoft.com/premier_developer/2017/06/14/tips-for-running-an-angular-app-in-iis/

Verwandte Themen