Wenn Sie entscheiden, welchen Grad der Integration Sie zwischen Ihrer externen SPA und AEM haben möchten, wird oft klar, dass Sie die SPA in AEM anzeigen und bearbeiten können müssen. Die RemotePage-Komponente ist eine benutzerdefinierte Seitenkomponente genau für diesen Zweck.
Die RemotePage-Komponente ruft alle erforderlichen Assets aus dem generierten asset-manifest.json
des Programms ab und verwendet diese zum Rendern der SPA in AEM.
Weitere Informationen zu bearbeitbaren externen SPAs in AEM finden Sie im Artikel zum Bearbeiten einer externen SPA in AEM.
CORS in der Entwicklung aktivieren
Remote-URL in den Seiteneigenschaften konfigurieren
SPA in AEM rendern
Die Web-Anwendung muss ein Bundler-Asset-Manifest wie eines der folgenden verwenden und eine asset-manifest.json-Datei im Domain-Stamm bereitstellen, die in einer entrypoints-Eigenschaft alle zu ladenden CSS- und JS-Dateien auflistet:
Die Anwendung muss in einem <div id="root"></div>
-Element unter dem Body-Element initialisiert werden können. Wenn für die Instanziierung der App ein anderes Markup erwartet wird, muss dies in den HTL-Skripten der Proxy-Komponente mit dem Wert sling:resourceSuperType="spa-project-core/components/remotepage
entsprechend angepasst werden.
Wie der Rest des AEM-SPA-Projekts ist die RemotePage-Komponente eine Open Source-Komponente. Die vollständigen technischen Details der RemotePage-Komponente finden Sie im GitHub-Repository.