Algemene kop- en voettekst in AEM integreren in React-apps
Het integreren van de algemene kop- en voettekst van Adobe Experience Manager (AEM) in een React-toepassing kan problemen met stijlen en functionaliteit veroorzaken. De standaardopstelling van AEM steunt React single-page geen toepassingen (SPAs) uit de doos, vooral wanneer het gebruiken van de Fragmenten van de Ervaring (XFs). U kunt dit verhelpen door de juiste HTML-fragmenten te trekken en verzendingsregels te configureren om padproblemen te voorkomen.
Beschrijving description
Omgeving
- Product: Adobe Experience Manager (AEM) as a Cloud Service - Plaatsen
- Instantie: Ontwikkeling
Probleem/symptomen
- Het gebruik van de ingesloten component URL ondersteunt alleen videokoppelingen en staat het insluiten van pagina-URL's niet toe.
- Als u de kop- en voettekstinhoud als JSON (bijvoorbeeld
model.json) opgeeft, veroorzaakt dit problemen met de functionaliteit. Klassen die eigen zijn aan AEM, werken niet correct en functies zoals zoeken en vertalen zijn niet-functioneel. - De bestaande architectuur van AEM is belangrijk (componenten/strak), die geen implementatie van SPA React voor malplaatjes en componenten steunt.
Resolutie resolution
Voer de volgende stappen uit om de algemene kop- en voettekst van AEM te integreren in uw React-toepassing met behoud van de eigen stijlen en functionaliteit:
-
Trek de HTML van de Fragmenten van de Ervaring (XFs) gebruikend
.head.nocloudconfig.htmlen.body.nocloudconfig.htmlselecteurs. Deze kiezers verwijderen de configuratiegegevens van de cloud, waardoor de HTML compatibel wordt met externe apps. -
Controleer uw
web server rewrite rules. Zorg ervoor dat er geen ongeldige paden worden toegevoegd vóór de URL's van het ervaringsfragment. Bijvoorbeeld, verzeker wegen zoals/content/<my_project>/content/experience-fragments/...correct worden gevormd om 404 fouten te vermijden. -
Als u problemen tegenkomt bij het benaderen van Experience Fragments:
- Bekijk AEM-logboeken voor padgerelateerde fouten of wijzigingen.
- Werk de regels van de dispatcher bij om geen onnodige voorvoegsels aan de wegen van het Fragment van de Ervaring toe te voegen.
Gerelateerde lezing
- Gebruikend de Fragmenten van de Ervaring in Zelfstudies van AEM Sites
- AEM Headless plaatsingen van het KUUROORD in het Hoofdloze Leerprogramma van AEM