Nginx+Tomcat-Bereitstellungsvorgang des Angular+Javaweb-Projekts

Anfangs habe ich ng build –prod –aot zum Kompilieren und Paketieren verwendet. Beachten Sie hier, dass Sie beim Packen nur ng build –prod eingeben müssen, da es jetzt offiziell integriert ist. Hier könnt ihr es mit meiner Projektgröße vergleichen:

ng build : 8,348,761字节
ng build –aot : 9,232,405字节
ng build –prod : 1,839,811字节
ng build –prod –aot : 1,839,811字节

Schließlich ist ersichtlich, dass ng build –prod die Mindestverpackung für die Produktisierung vervollständigen kann. Ich verstehe hier etwas nicht. Der vorkompilierte Build ist größer als der reguläre Build. Ich hoffe, jemand kann mir bei der Beantwortung helfen.

Ich werde hier nicht darüber sprechen, wie man das Projekt kleiner macht.

Als ich die Dateien in dist in den ROOT-Ordner von Tomcat kopierte und http://127.0.0.1 öffnete, wurde die bekannte Projektseite angezeigt. Gewöhnlich habe ich zum Aktualisieren F5 gedrückt und einen 404-Fehler gefunden. Ich habe auf Baidu nach verwandten Fragen gesucht und bin zu dem Schluss gekommen: Beim ersten Betreten der Seite werden der normale Prozess und der normale Prozess vom Angular-Routing-Mechanismus verarbeitet. Wenn es jedoch einen Aktualisierungsvorgang gibt, handelt es sich um eine an den Back-End-Dienst gesendete Anfrage. Wenn das Back-End Ihre Anfrage nicht an index.html umleitet (bezieht sich hier auf den Single-Page-Anwendungseingang), wird dies gemeldet 404 nicht gefunden.

Wow, das ist so langatmig. Aber zumindest verstehen Sie den Grund. Wenn Sie den Grund kennen, sollten Sie darüber nachdenken, wie Sie ihn lösen können!

Lösung 1:

Konfigurieren Sie den URL-Stil von Angular als Hash-Stil. Diese Methode ist die häufigste, die ich je gesehen habe, und sie wurde vollständig von StackOverflow kopiert. Der Pushstate-Stil von H5 wird jetzt allgemein verwendet, und Angular-Beamte sagen uns, dass es besser ist, so oft wie möglich den H5-Stil zu verwenden, wenn es nicht genügend Gründe gibt, ihn zu verwenden jetzt ein # Ankerpunkt? Und einige Leute wiesen darauf hin, dass bei der Konfiguration des Hash-Stils immer noch 404-Probleme bei WeChat-Zahlungen oder dem Deep Path von Angular auftreten. Wenn Sie darauf bestehen, es zu verwenden, ist das kein Problem. Weitere Informationen finden Sie in der offiziellen Dokumentation

Lösung 2:

Würden Sie nicht einfach die Fehlerseite als Stammverzeichnis in Tomcat angeben, da 404 gemeldet wird?

Beschreibung: Öffnen Sie das Tomcat-Containerverzeichnis Tomcat/conf/web.xml, gehen Sie nach unten und fügen Sie oben den folgenden Code hinzu:

Nach der Konfiguration starten Sie Tomcat neu. Egal wie ich es jetzt aktualisiere, die Seite wird ohne Probleme angezeigt. Wir haben jedoch festgestellt, dass die Seite zwar angezeigt werden kann, unter dem Netzwerk-Tag jedoch 404-Anfragen angezeigt werden. Mit anderen Worten: In dem Moment, als wir die Seite aktualisierten, konnte Angular die Seite nicht finden, wurde aber von Tomcat als 404 an index.html weitergeleitet. Tomcat führte einen Menschen, der vom Weg abgekommen war, wieder auf den richtigen Weg, zeichnete ihn aber auch als „er war einst ein Bösewicht“ aus. Reden wir nicht darüber, ob die Methode zur Konfiguration einer Fehlerseite angemessen ist. Sprechen wir zunächst darüber, welche Probleme diese 404-Marke für uns mit sich bringen wird. Erstens: Solange Sie auf eine Plattform stoßen, die 404-Fehlerseiten verarbeitet, sind Sie definitiv zum Scheitern verurteilt. Wenn WeChat beispielsweise erkennt, dass Sie eine 404-Seite haben, wird Ihnen sofort eine Seite angezeigt, die verlorenen Kindern hilft, ihr Zuhause zu finden.

Er ist sehr gewissenhaft und freundlich. Er hat gute Arbeit für das Gemeinwohl geleistet, aber Ihr Job wird verloren gehen. Wenn Ihre Seite im offiziellen Konto platziert ist und Sie die Seite zur Kindersuche aufrufen, sobald Sie dies autorisiert haben, wäre es in Ordnung, wenn Ihr Manager Sie nicht zu Tode hacken würde. Es liegt also an Ihnen, ob Sie diese Methode verwenden oder nicht!

Lösung 3

Wenn Sie die Seite nicht finden können, leite ich Sie im Backend weiter! Ich schreibe einen Interceptor oder Filter. Bevor Sie eine Anfrage senden, leite ich Sie zunächst zu index.html weiter. Das ist kein Problem! Natürlich ist es kein Problem, spezifische Medikamente für die Ursache der Krankheit zu finden. Dies alles scheint eine perfekte Lösung zu sein. Allerdings haben wir festgestellt, dass wir es im heutigen Thema nicht behandelt haben, und wir müssen einige Probleme herausgreifen diese Lösung! Andernfalls würde unser letzter Schritt langweilig erscheinen.

Da unser Projekt von vorne nach hinten getrennt ist, handelt es sich um einen zustandslosen Dienst. Das Backend ist für Datenbankoperationen und die Rückgabe relevanter Schnittstellendaten an das Frontend verantwortlich. Das Frontend ist nur für die Verarbeitung der Anzeigelogik und die Interaktion mit dem Backend verantwortlich. Häufiges Weiterleiten,
Backend PS: Du hast mich gebeten, die Seite nicht zu bearbeiten, aber du hast mich trotzdem gebeten, sie weiterzuleiten. Bist du dumm? Was können Sie tun, wenn Ihr Backend die Weiterleitungsarbeit einfach nicht übernehmen möchte? Natürlich schikaniert es den Betrieb und die Wartung!

Lösung·Ultimate

Wenn Sie ein Betriebs- und Wartungsmeister sind, können Sie wahrscheinlich einfach neben mir Tee trinken. Was wäre, wenn ... ein Neuling? Dann können Sie als Frontend (zhuang) (bi) Nginx verwenden! Reverse-Proxy, Lastausgleich, Balabala…

Stellen Sie sich vor, Sie haben hier eine Nginx-Umgebung, ich verwende hier Windows. Öffnen Sie die Datei nginx.conf und schreiben Sie keine spezifische Beschreibung. Wenn Sie sie nicht lesen möchten, können Sie die Konfigurationsdatei direkt herunterladen.

Es ist zu beachten, dass die Stammverzeichniskonfiguration nicht location/{} ist, was bedeutet, dass alle Anfragen weitergeleitet werden.

Das obige ist der detaillierte Inhalt vonNginx+Tomcat-Bereitstellungsvorgang des Angular+Javaweb-Projekts. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!