DokumentationAEM Headless adaptive forms

Aktivera Headless Adaptive Forms i AEM Forms as a Cloud Service enable-headless-adaptive-forms-on-aem-forms-cloud-service

Last update: Thu Jul 24 2025 00:00:00 GMT+0000 (Coordinated Universal Time)

Skapat för:

  • Nybörjare
  • Mellanliggande
  • Administratör

Om du aktiverar Headless Adaptive Forms i AEM Forms as a Cloud Service kan du börja skapa, publicera och leverera Headless Forms med AEM Forms Cloud Service-instanserna i flera kanaler. Du behöver en adaptiv Forms Core Components-aktiverad miljö för att kunna använda Headless Adaptive Forms.

Överväganden

NOTE
Adobe har ett adaptivt Forms starter kit (React App) som hjälper utvecklare att snabbt komma igång med Headless Adaptive Forms-utveckling, utan att aktivera Headless Adaptive Forms i AEM Forms as a Cloud Service-miljö. Du kan aktivera Headless Adaptive Forms i en Forms as a Cloud Service-miljö senare efter en snabbstart med utveckling av headless-formulär.

Aktivera Headless Adaptive Forms för AEM Forms as a Cloud Service

Utför följande steg i listad ordning för att aktivera Headless Adaptive Forms för en AEM Forms as a Cloud Service-miljö

​1. Klona din AEM Forms as a Cloud Service Git-databas clone-git-repository

  1. Logga in på Cloud Manager och välj organisation och program.

  2. Gå till pipelines-kortet från sidan Programöversikt.

  3. Klicka på knappen Åtkomst till replikinformation om du vill komma åt och hantera din Git-databas. Sidan innehåller följande information:

    • URL till Cloud Manager Git-databasen.
    • Autentiseringsuppgifter för Git-databasen (användarnamn och lösenord) Git-användarnamn.

    Klicka på Generera lösenord för att visa eller generera lösenordet.

  4. Öppna terminalen eller kommandotolken på den lokala datorn och kör följande kommando:

    code language-shell 
    git clone [Git Repository URL]

    Ange inloggningsuppgifterna när du uppmanas att göra det. Databasen klonas till din lokala dator.

​2. Lägg till adaptiva Forms Core-komponentberoenden i Git-databasen add-adaptive-forms-core-components-dependencies

  1. Öppna Git-databasmappen i en kodredigerare för oformaterad text. Exempel: VS-kod.

  2. Öppna filen [AEM Repository Folder]\pom.xml för redigering.

  3. Ersätt versioner av komponenterna core.forms.components.version, core.forms.components.af.version och core.wcm.components.version med versioner som anges i dokumentationen för kärnkomponenter. Om komponenten inte finns lägger du till dessa komponenter.

    code language-xml 
    <!-- Replace the version with the latest released version at https://github.com/adobe/aem-core-forms-components/tags -->

<properties>
    <core.forms.components.version>2.0.14</core.formscomponents.version>
    <core.forms.components.af.version>2.0.14</core.forms.components.af.version>
    <core.wcm.components.version>2.21.2</core.wcmcomponents.version>
</properties>

    Uppge den senaste versionen av Forms Core Components

  4. Lägg till följande beroenden i avsnittet Beroenden i filen [AEM Repository Folder]\pom.xml och spara filen.

    code language-xml 
        <!-- WCM Core Component Examples Dependencies -->
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.apps</artifactId>
            <type>zip</type>
            <version>${core.wcm.components.version}</version>
        </dependency>
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.content</artifactId>
            <type>zip</type>
            <version>${core.wcm.components.version}</version>
        </dependency>
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.config</artifactId>
            <version>${core.wcm.components.version}</version>
            <type>zip</type>
        </dependency>
        <!-- End of WCM Core Component Examples Dependencies -->
        <!-- Forms Core Component Dependencies -->
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-core</artifactId>
            <version>${core.forms.components.version}</version>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-apps</artifactId>
            <version>${core.forms.components.version}</version>
            <type>zip</type>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-af-core</artifactId>
            <version>${core.forms.components.version}</version>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-af-apps</artifactId>
            <version>${core.forms.components.version}</version>
            <type>zip</type>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-examples-apps</artifactId>
            <type>zip</type>
            <version>${core.forms.components.version}</version>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-examples-content</artifactId>
            <type>zip</type>
            <version>${core.forms.components.version}</version>
        </dependency>
<!-- End of AEM Forms Core Component Dependencies -->

  5. Öppna filen [AEM Repository Folder]/all/pom.xml för redigering. Lägg till följande beroenden i avsnittet <embeddeds> och spara filen.

    code language-xml 
    <!-- WCM Core Component Examples Dependencies -->

<!-- inside plugin config of filevault-package-maven-plugin -->
<!-- embed wcm core components examples artifacts -->

<embedded>
    <groupId>com.adobe.cq</groupId>
    <artifactId>core.wcm.components.examples.ui.apps</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/content/install</target>
</embedded>
<embedded>
    <groupId>com.adobe.cq</groupId>
    <artifactId>core.wcm.components.examples.ui.content</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/content/install</target>
</embedded>
<embedded>
    <groupId>com.adobe.cq</groupId>
    <artifactId>core.wcm.components.examples.ui.config</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/content/install</target>
</embedded>
<!-- embed forms core components artifacts -->
<embedded>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-af-apps</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/application/install</target>
</embedded>
<embedded>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-af-core</artifactId>
    <target>/apps/${appId}-vendor-packages/application/install</target>
</embedded>
<embedded>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-examples-apps</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/content/install</target>
</embedded>
<embedded>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-examples-content</artifactId>
    <type>zip</type>
    <target>/apps/${appId}-vendor-packages/content/install</target>
</embedded>
    note note
    NOTE
    Ersätt ${appId} med ditt appId.
    Om du vill hitta din ${appId} söker du efter termen [AEM Repository Folder]/all/pom.xml i filen -packages/application/install. Texten före termen -packages/application/install är din ${appId}. Följande kod, myheadlessform, är till exempel ${appId}.
    code language-none 
    



com.myheadlessform

myheadlessform.ui.apps

zip

/apps/myheadlessform-packages/application install

  6. Lägg till följande beroenden i <dependencies>-delen av filen [AEM Repository Folder]/all/pom.xml och spara filen:

    code language-xml 
            <!-- Other existing dependencies -->
        <!-- wcm core components examples dependencies -->
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.apps</artifactId>
            <type>zip</type>
        </dependency>
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.config</artifactId>
            <type>zip</type>
            </dependency>
        <dependency>
            <groupId>com.adobe.cq</groupId>
            <artifactId>core.wcm.components.examples.ui.content</artifactId>
            <type>zip</type>
        </dependency>
            <!-- forms core components dependencies -->
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-af-apps</artifactId>
            <type>zip</type>
        </dependency>
        <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-examples-apps</artifactId>
            <type>zip</type>
        </dependency>
            <dependency>
            <groupId>com.adobe.aem</groupId>
            <artifactId>core-forms-components-examples-content</artifactId>
            <type>zip</type>
        </dependency>

  7. Öppna [AEM Repository Folder]/ui.apps/pom.xml för redigering. Lägg till af-core bundle-beroendet och spara filen.

    code language-xml 
        <dependency>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-af-core</artifactId>
    </dependency>
    note note
    NOTE
    Kontrollera att följande adaptiva Forms Core Components-artefakter inte ingår i ditt projekt.
    <dependency>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-apps</artifactId>
    </dependency>
    och
    <dependency>
    <groupId>com.adobe.aem</groupId>
    <artifactId>core-forms-components-core</artifactId>
    </dependency>

  8. Spara och stäng filen.

​3. Uppdatera projektet så att det innehåller den senaste versionen av Forms Core Components:

  1. Öppna [projektmappen AEM Archetype]/pom.xml för redigering.

  2. Spara och stäng filen.

​4. Implementera uppdateringarna i din Git-databas och kör en pipeline för att distribuera databasen Commit-the-updates-to-your-git-repository

  1. Så här implementerar du kod i din Git-databas:

    1. Öppna terminalen eller kommandotolken.

    2. Navigera till [AEM Repository Folder] och kör följande kommandon i den ordning som visas

      code language-shell 
      git add pom.xml
git add all/pom.xml
git add ui.apps/pom.xml
git commit -m "Added dependencies for Adaptive Forms Core Components"
git push origin

  2. Kör pipeline när filerna har implementerats i Git-databasen.

    När pipeline-körningen har slutförts aktiveras adaptiva Forms Core-komponenter för motsvarande miljö. Dessutom har en adaptiv Forms-mall (Core Components) och Canvas 3.0-temat lagts till i din Forms as a Cloud Service-miljö, med alternativ för att anpassa och skapa Core Components-baserade Adaptive Forms.

Vanliga frågor faq

Vilka är kärnkomponenterna? core-components

Kärnkomponenterna är en uppsättning standardiserade WCM-komponenter (Web Content Management) för AEM som snabbar upp utvecklingstiden och minskar underhållskostnaderna för dina webbplatser.

Vilka funktioner finns det för att aktivera kärnkomponenter? core-components-capabilities

När de adaptiva Forms Core-komponenterna är aktiverade för din miljö läggs en tom Core Components-baserad Adaptive Form-mall och Canvas 3.0-tema till i din miljö. När du har aktiverat adaptiva Forms Core-komponenter för din miljö kan du:

  • Skapa grundkomponentbaserade adaptiva Forms.
  • Skapa grundkomponentbaserade adaptiva formulärmallar.
  • Skapa egna teman för grundkomponentbaserade adaptiva formulärmallar.
  • Servera Core Component-baserade Adaptive Form JSON-representationer för kanaler som mobiler, webben, inbyggda appar och tjänster som kräver att ett formulär visas utan rubrik.

Är adaptiva Forms Core-komponenter aktiverade för min miljö? enable-components

Så här kontrollerar du att adaptiva Forms Core-komponenter är aktiverade för din miljö:

  1. Klona din AEM Forms as a Cloud Service-databas.

  2. Öppna [AEM Repository Folder]/all/pom.xml-filen för din AEM Forms Cloud Service Git-databas.

  3. Sök efter följande beroenden:

    • core-forms-components-af-core
    • core-forms-components-core
    • core-forms-components-apps
    • core-forms-components-af-apps
    • core-forms-components-examples-apps
    • core-forms-components-examples-content

    leta reda på artefakten core-forms-components-af-core i all/pom.xml

    Om det finns beroenden aktiveras adaptiva Forms Core-komponenter för din miljö.

recommendation-more-help
ce8b2828-9203-402e-a565-7b758c99b2ba