2017-09-10 2 views
1

Ich arbeite an eckigen 4 Anwendung. Es funktioniert gut auf meinem lokalen Rechner. Wenn ich ng serve es dient die Anwendung als http://localhost:4200. Da es sich um ein POC-Projekt handelt, gibt es daher keinen API-Aufruf, sondern das Abrufen von Daten aus der Datei "assets/data.json" mithilfe von Diensten.Angular 4 Anwendung von Azure nicht ordnungsgemäß ausgeführt

Jetzt möchte ich diese Website zu Azure bereitstellen. Ich habe auch den Ordner dist bekommen, als ich "ng build --env = prod" lief. Ich habe auch die Nachricht "Bereitstellung erfolgreich" gesehen.

aber wenn ich die Website von Azur laufen lasse, wird es nicht richtig geladen. Ich startete das Entwickler-Tool und sehe viele 404 nicht gefundene Nachrichten. Ich habe auch den Screenshot angehängt.

Ich weiß nicht, warum diese Seite nicht richtig funktioniert. Noch eine Sache, wenn ich in den Ordner dist auf meinem lokalen Rechner gehe und die Seite index.html führe, bekomme die gleichen Fehlermeldungen.

enter image description here

Jede Hilfe ist willkommen. Vielen Dank.

+0

Haben Sie bestätigt, dass die Datei tatsächlich im Dateisystem vorhanden ist? –

+0

Sind Sie immer noch bereit, Port 4200 zu hören? Dies funktioniert in einer Azure Web App nicht. Erhalten Sie die Portnummer von der Umgebung? –

Antwort

1

Um diese 404-Fehler zu vermeiden, müssen Sie statische JSON- und WOFF-Dateien auf Azure bereitstellen, indem Sie eine web.config-Datei in Ihrem wwwroot-Ordner erstellen und die folgende MIME-Konfiguration dort ablegen.

<?xml version="1.0" encoding="UTF-8" ?> 
<configuration> 
    <system.webServer> 
     <staticContent> 
      <remove fileExtension=".json" /> 
      <remove fileExtension=".woff" /> 
      <remove fileExtension=".woff2" /> 
      <mimeMap fileExtension=".json" mimeType="application/json" /> 
      <mimeMap fileExtension=".woff" mimeType="application/font-woff" /> 
      <mimeMap fileExtension=".woff2" mimeType="application/font-woff" />  
     </staticContent> 
    </system.webServer> 
</configuration> 
+0

Ich habe die Zeilen in der web.config hinzugefügt, wie Sie vorgeschlagen haben, aber immer noch mit dem gleichen Problem konfrontiert, wo die Anwendung nicht auf die Datei data.json zugreifen kann. Daher wird nichts auf dem Bildschirm angezeigt. – Mani

+0

Ich habe die Datei "web.config" nicht zum Ordner "dist" hinzugefügt und hoffe, dass sie automatisch hinzugefügt wird. Jetzt habe ich es kopiert und eingefügt und die Bereitstellung erneut durchgeführt. Dieses Mal sehe ich keinen json-bezogenen Fehler, aber werfe "internen Serverfehler" und nichts kommt auf den Bildschirm. – Mani

+0

Danke Aaron endlich hat es funktioniert und ich sehe jetzt keine 404 Fehler. – Mani

0

Stellen Sie sicher, dass die .htaccess-Datei in Ihrem Verzeichnis mit dem eingebauten Code in/dist

.htaccess-Datei und fügen Sie erstellen hinzufügen:

RewriteEngine On 
RewriteCond %{REQUEST_FILENAME} !-d 
RewriteCond %{REQUEST_FILENAME} !-f 

RewriteRule^index.html [L] 

Verwandte Themen