Universell redigerare universal-editor
Läs om flexibiliteten i Universal Editor och hur den kan hjälpa till att ge kraft åt dina headless-upplevelser med AEM 6.5.
Ökning overview
Universal Editor är en mångsidig visuell editor som ingår i Adobe Experience Manager Sites. Man kan redigera det man redan gjort - se-is-what-you-get (WYSIWYG) - oavsett headless Experience.
- Den universella redigeraren har stor flexibilitet eftersom den har stöd för samma enhetliga visuella redigering för alla former av AEM headless-innehåll.
- Utvecklarna drar nytta av universella redigerares mångsidighet eftersom den även stöder en sann frikoppling av implementeringen. Det gör att utvecklare kan utnyttja praktiskt taget vilket ramverk eller vilken arkitektur de vill utan att införa några begränsningar för SDK eller teknik.
Mer information finns i AEM as a Cloud Service-dokumentationen för Universal Editor.
Arkitektur architecture
Universell redigerare är en tjänst som fungerar tillsammans med AEM för att skapa innehåll utan problem.
- Den universella redigeraren finns på
https://experience.adobe.com/#/aem/editor/canvas
och du kan redigera sidor som återges av AEM 6.5. - AEM-sidan läses av Universal Editor via dispatchern från AEM författarinstans.
- Universal Editor-tjänsten, som körs på samma värd som Dispatcher, skriver tillbaka ändringarna till AEM författarinstans.
Krav requirements
Universal Editor stöds av:
- AEM 6.5 (Service Pack 21 eller 22 plus ett funktionspaket)
- Både lokala värdtjänster och AMS-värdtjänster stöds.
- AEM as a Cloud Service (release
2023.8.13099
eller senare)
Det här dokumentet fokuserar på stöd för AEM 6.5 i Universal Editor.
Inställningar setup
Om du vill testa den universella redigeraren måste du:
När du har slutfört konfigurationen kan du instrumentera dina program så att de använder den universella redigeraren.
Uppdatera AEM update-aem
Service Pack 21 eller 22 och ett funktionspaket för AEM krävs för att du ska kunna använda Universal Editor med AEM 6.5.
Använd senaste Service Pack latest
Kontrollera att du kör minst Service Pack 21 eller 22 för AEM 6.5. Du kan hämta det senaste Service Pack-meddelandet från Programvarudistribution.
Installera Universal Editor Feature Pack feature-pack
Installera Universal Editor Feature Pack för AEM 6.5 som finns tillgängligt för programdistribution.
Om du redan kör Service Pack 23 eller senare är funktionspaketet inte nödvändigt.
Konfigurera tjänster configure-services
Funktionspaketet installerar ett antal nya paket för vilka ytterligare konfiguration krävs.
Ange samma webbplatsattribut för cookien login-token
. samesite-attribute
- Öppna Configuration Manager.
http://<host>:<port>/system/console/configMgr
- Leta reda på Autentiseringshanteraren för Adobe Granite-token i listan och klicka på Ändra konfigurationsvärdena.
- I dialogrutan ändrar du attributet SameSite för cookie-filen för inloggningstoken (
token.samesite.cookie.attr
) tillPartitioned
. - Klicka på Spara.
Ta bort alternativet SAMEORIGIN
sidhuvuden i X-bildrutan. sameorigin
- Öppna Configuration Manager.
http://<host>:<port>/system/console/configMgr
- Leta reda på Huvudservern för Apache Sling i listan och klicka på Redigera konfigurationsvärdena.
- Ta bort värdet
X-Frame-Options=SAMEORIGIN
från attributet Additional response headers (sling.additional.response.headers
) om det finns. - Klicka på Spara.
Konfigurera autentiseringshanteraren för Adobe Granite-frågeparametern. query-parameter
- Öppna Configuration Manager.
http://<host>:<port>/system/console/configMgr
- Leta reda på Autentiseringshanteraren för Adobe Granite-frågeparametern i listan och klicka på Redigera konfigurationsvärdena.
- I fältet Sökväg (
path
) lägger du till/
för att aktivera.- Ett tomt värde inaktiverar autentiseringshanteraren.
- Klicka på Spara.
Definiera för vilka innehållssökvägar eller sling:resourceTypes
den universella redigeraren ska öppnas. paths
-
Öppna Configuration Manager.
http://<host>:<port>/system/console/configMgr
-
Leta reda på URL-tjänsten för den universella redigeraren i listan och klicka på Redigera konfigurationsvärdena.
-
Definiera för vilka innehållssökvägar eller
sling:resourceTypes
den universella redigeraren ska öppnas.- Ange sökvägarna som den universella redigeraren öppnas för i fältet Öppna mappning för den universella redigeraren.
- I fältet Sling:resourceTypes, som ska öppnas av Universell redigerare, anger du en lista över resurser som ska öppnas direkt av Universell redigerare.
-
Klicka på Spara.
-
Kontrollera din externaliserarkonfiguration och se till att du har minst den lokala miljön, författarmiljön och publiceringsmiljön inställd som i följande exempel.
code language-text "local $[env:AEM_EXTERNALIZER_LOCAL;default=http://localhost:4502]", "author $[env:AEM_EXTERNALIZER_AUTHOR;default=http://localhost:4502]", "publish $[env:AEM_EXTERNALIZER_PUBLISH;default=http://localhost:4503]"
När dessa konfigurationssteg är klara öppnas AEM Universell redigerare för sidor i följande ordning.
- AEM kontrollerar mappningarna under
Universal Editor Opening Mapping
och om innehållet finns under sökvägar som definierats där öppnas Universell redigerare för det. - För innehåll som inte finns under sökvägar som definieras i
Universal Editor Opening Mapping
, kontrollerar AEM omresourceType
för innehållet matchar de som definieras i Sling:resourceTypes, som ska öppnas av Universal Editor, och om innehållet matchar någon av dessa typer, öppnas Universell redigerare för det på${author}${path}.html
. - I annat fall öppnas sidredigeraren.
Följande variabler är tillgängliga för att definiera dina mappningar under Universal Editor Opening Mapping
.
path
: Innehållssökvägen för resursen som ska öppnaslocalhost
: Post för externalisering förlocalhost
utan schema, t.ex.localhost:4502
author
: Externalizer-post för författare utan schema, t.ex.localhost:4502
publish
: Post för externalisering för publicering utan schema, t.ex.localhost:4503
preview
: Externalizer-post för förhandsgranskning utan schema, t.ex.localhost:4504
env
:prod
,stage
,dev
baserat på definierade körningslägen för Slingtoken
: Frågetoken krävs förQueryTokenAuthenticationHandler
Exempelmappningar:
-
Öppna alla sidor under
/content/foo
på AEM Author:/content/foo:${author}${path}.html?login-token=${token}
- Detta resulterar i att
https://localhost:4502/content/foo/x.html?login-token=<token>
öppnas
-
Öppna alla sidor under
/content/bar
på en fjärr-NextJS-server, med alla variabler som information/content/bar:nextjs.server${path}?env=${env}&author=https://${author}&publish=https://${publish}&login-token=${token}
- Detta resulterar i att
https://nextjs.server/content/bar/x?env=prod&author=https://localhost:4502&publish=https://localhost:4503&login-token=<token>
öppnas
Konfigurera Universal Editor-tjänsten set-up-ue
Med AEM uppdaterat och konfigurerat kan du skapa en lokal universell redigeringstjänst för lokal utveckling och testning.
-
Installera Node.js version >=20.
-
Hämta och packa upp den senaste universella redigeringstjänsten från Programvarudistribution
-
Konfigurera den universella redigeringstjänsten via miljövariabler eller filen
.env
.- Mer information finns i dokumentationen för AEM as a Cloud Service Universal Editor.
- Observera att du kan behöva använda alternativet
UES_MAPPING
om intern IP-omskrivning krävs.
-
Kör
universal-editor-service.cjs
Uppdatera Dispatcher update-dispatcher
Om AEM är konfigurerat och en lokal Universal Editor-tjänst körs måste du tillåta en omvänd proxy för den nya tjänsten i dispatchern.
-
Justera värdfilen för författarinstansen så att den innehåller en omvänd proxy.
code language-html <IfModule mod_proxy.c> ProxyPass "/universal-editor" "http://localhost:8080" ProxyPassReverse "/universal-editor" "http://localhost:8080" </IfModule>
note note NOTE 8080 är standardporten. Om du ändrade detta med parametern UES_PORT
i din.env
-filmåste du justera portvärdet här i enlighet med detta. -
Starta om Apache.
Instrumentera din app instrumentation
Med AEM uppdaterad och en lokal Universal Editor-tjänst kan du börja redigera headless-innehåll med hjälp av Universell Editor.
Ditt program måste dock vara instrumenterat för att du ska kunna använda den universella redigeraren. Det innebär att du inkluderar metataggar för att instruera redigeraren hur och var innehållet ska sparas. Information om den här instrumenteringen finns i Universal Editor-dokumentationen för AEM as a Cloud Service.
Observera att följande dokumentation för Universal Editor med AEM as a Cloud Service gäller när du använder den med AEM 6.5.
-
Protokollet i meta-taggen måste vara
aem65
i stället föraem
.code language-html <meta name="urn:adobe:aue:system:aemconnection" content={`aem65:${getAuthorHost()}`}/>
-
Slutpunkten för Universal Editor-tjänsten måste tillkännages via en metatagg.
code language-html <meta name="urn:adobe:aue:config:service" content={`${getAuthorHost()}/universal-editor`}/>
-
I avsnittet
plugins
i komponentdefinitionen måsteaem65
användas i stället föraem
.
Skillnader mellan AEM 6.5 och AEM as a Cloud Service differences
Universal Editor i AEM 6.5 fungerar ungefär på samma sätt som i AEM as a Cloud Service, inklusive användargränssnittet och mycket av installationsprogrammet. Det finns dock skillnader som bör noteras.
- Universal Editor i 6.5 stöder endast headless-användning.
- Inställningarna för den universella redigeraren varierar något för 6.5 (enligt beskrivningen i det aktuella dokumentet).
- Universal Editor i 6.5 använder en annan resursväljare och en annan Content Fragment-väljare än AEM as a Cloud Service.