Dokumentation AEM as a Cloud Service Användarhandbok

AEM-CIF kärnkomponenter och Adobe Experience Platform-integrering aem-cif-aep-integration

Last update: Wed Aug 20 2025 00:00:00 GMT+0000 (Coordinated Universal Time)

Gäller:
Experience Manager as a Cloud Service

Ämnen:
Commerce Integration Framework

Skapat för:

Nybörjare
Utvecklare

Kärnkomponenterna Commerce integration framework (CIF) erbjuder sömlös integrering med Adobe Experience Platform för att vidarebefordra butikshändelser och deras data från interaktioner på klientsidan, som lägg till i kundvagnen.

Projektet AEM CIF Core Components innehåller ett JavaScript-bibliotek med namnet Adobe Experience Platform Connector för Adobe Commerce som samlar in händelsedata från din Commerce-butik. Dessa händelsedata skickas till Experience Platform där de används i andra Adobe Experience Cloud-produkter, som Adobe Analytics och Adobe Target, för att skapa en helhetsprofil som täcker en kundresa. Genom att ansluta Commerce-data till andra produkter i Adobe Experience Cloud kan ni utföra uppgifter som att analysera användarbeteende på er webbplats, utföra AB-tester och skapa personaliserade kampanjer.

Läs mer om Experience Platform Data Collection med tekniker som gör att du kan samla in kundupplevelsedata från källor på klientsidan.

Skicka händelsedata för `addToCart` till Experience Platform send-addtocart-to-aep

Följande steg visar hur du skickar händelsedata för addToCart från AEM-återgivna produktsidor till Experience Platform med CIF - Experience Platform Connector. Genom att använda Adobe Experience Platform Debugger webbläsartillägg kan du testa och granska skickade data.

Granska händelsedata för addToCart i Adobe Experience Platform Debugger

Förutsättningar prerequisites

Använd en lokal utvecklingsmiljö för att slutföra denna demo. Detta inkluderar en instans av AEM som körs och som är konfigurerad och ansluten till en Adobe Commerce-instans. Granska kraven och stegen för konfiguration av lokal utveckling med AEM as a Cloud Service SDK.

Du behöver även åtkomst till Adobe Experience Platform och behörigheter för att skapa schema, datamängd och datastreams för datainsamling. Mer information finns i Behörighetshantering.

Installation av AEM Commerce as a Cloud Service aem-setup

Om du vill ha en fungerande lokal miljö i AEM Commerce as a Cloud Service med den kod och konfiguration som krävs utför du följande steg.

Lokal installation

Följ stegen i Lokal konfiguration så att du kan ha en fungerande AEM Commerce as a Cloud Service-miljö.

Projektinställningar

Följ AEM Project Archetype så kan du skapa ett helt nytt AEM Commerce-projekt (CIF).

TIP

I följande exempel heter AEM Commerce-projektet My Demo Storefront, men du kan välja ett eget projektnamn.

AEM Commerce Project

Skapa och distribuera det skapade AEM Commerce-projektet till det lokala AEM SDK genom att köra följande kommando från projektets rotkatalog.

$ mvn clean install -PautoInstallSinglePackage

Den lokalt distribuerade e-handelswebbplatsen My Demo StoreFront med standardkod och standardinnehåll ser ut så här:

AEM Commerce standardwebbplats

Installera anslutningsberoenden för Premiere och CIF-AEP

Om du vill samla in och skicka händelsedata från kategori- och produktsidorna på den här AEM Commerce-webbplatsen installerar du nyckelpaketen npm i modulen ui.frontend i AEM Commerce-projektet.

Navigera till modulen ui.frontend och installera de nödvändiga paketen genom att köra följande kommandon från kommandoraden.

npm i --save lodash.get@^4.4.2 lodash.set@^4.3.2
npm i --save apollo-cache-persist@^0.1.1
npm i --save redux-thunk@~2.3.0
npm i --save @adobe/apollo-link-mutation-queue@~1.1.0
npm i --save @magento/peregrine@~12.5.0
npm i --save @adobe/aem-core-cif-react-components --force
npm i --save-dev @magento/babel-preset-peregrine@~1.2.1
npm i --save @adobe/aem-core-cif-experience-platform-connector --force

IMPORTANT

Argumentet --force krävs ibland eftersom PWA Studio är begränsat med peer-beroenden som stöds. Vanligtvis bör detta inte orsaka några problem.

Konfigurera Maven att använda argumentet `--force`

Som en del av byggprocessen för Maven utlöses den rena nPM-installationen (med npm ci). Detta kräver också argumentet --force.

Navigera till projektets POM-rotfil pom.xml och leta upp körningsblocket <id>npm ci</id>. Uppdatera blocket så att det ser ut så här:

<execution>
    <id>npm ci</id>
    <goals>
    <goal>npm</goal>
    </goals>
    <configuration>
    <arguments>ci --force</arguments>
    </configuration>
</execution>

Ändra konfigurationsformat för Label

Växla från standardfilformatet .babelrc relativt konfigurationsfilformat till formatet babel.config.js. Det här är ett projektövergripande konfigurationsformat och gör att plugin-program och förinställningar kan användas på node_module med större kontroll.

Navigera till modulen ui.frontend och ta bort den befintliga .babelrc-filen.

Skapa en babel.config.js-fil som använder förinställningen peregrine.

code language-javascript

code language-javascript
`const peregrine = require('@magento/babel-preset-peregrine'); module.exports = (api, opts = {}) => { const config = { ...peregrine(api, opts), sourceType: 'unambiguous' } config.plugins = config.plugins.filter(plugin => plugin !== 'react-refresh/babel'); return config; }`

const peregrine = require('@magento/babel-preset-peregrine');

module.exports = (api, opts = {}) => {
    const config = {
        ...peregrine(api, opts),
        sourceType: 'unambiguous'
    }

    config.plugins = config.plugins.filter(plugin => plugin !== 'react-refresh/babel');

    return config;
}

Konfigurera webbpaket för användning av babel

Redigera filen babel-loader om du vill transpilera JavaScript-filerna med Babel-inläsaren (webpack.common.js) och webbpaketet.

Navigera till modulen ui.frontend och uppdatera filen webpack.common.js så att du kan ha följande regel inuti egenskapsvärdet module:

{
    test: /\.jsx?$/,
    exclude: /node_modules\/(?!@magento\/)/,
    loader: 'babel-loader'
}

Konfigurera Apollo-klient

Apollo-klienten används för att hantera både lokala data och fjärrdata med GraphQL. Resultaten av GraphQL-frågor lagras också i en lokal, normaliserad cache i minnet.

Du behöver en InMemoryCache-fil för attpossibleTypes.js ska fungera effektivt. Mer information om hur du genererar den här filen finns i Genererar possibleTypes automatiskt.

Se även PWA Studio referensimplementering och ett exempel på en possibleTypes.js-fil.

Navigera till modulen ui.frontend och spara filen som ./src/main/possibleTypes.js

Uppdatera webpack.common.js-avsnittet för filen DefinePlugin så att du kan ersätta de statiska variablerna som krävs under byggtiden.

code language-javascript

code language-javascript
`const { DefinePlugin } = require('webpack'); const { POSSIBLE_TYPES } = require('./src/main/possibleTypes'); ... plugins: [ ... new DefinePlugin({ 'process.env.USE_STORE_CODE_IN_URL': false, POSSIBLE_TYPES }) ]`

const { DefinePlugin } = require('webpack');
const { POSSIBLE_TYPES } = require('./src/main/possibleTypes');

...

plugins: [
    ...
    new DefinePlugin({
        'process.env.USE_STORE_CODE_IN_URL': false,
        POSSIBLE_TYPES
    })
]

Initiera kärnkomponenterna Peregrine och CIF

Om du vill initiera React-baserade Premiere-komponenter och CIF kärnkomponenter skapar du den konfiguration och de JavaScript-filer som behövs.

Navigera till modulen ui.frontend och skapa följande mapp: src/main/webpack/components/commerce/App

Skapa en config.js-fil med följande innehåll:

code language-javascript

code language-javascript
// get and parse the CIF store configuration from the <head> const storeConfigEl = document.querySelector('meta[name="store-config"]'); const storeConfig = storeConfigEl ? JSON.parse(storeConfigEl.content) : {}; // the following global variables are needed for some of the peregrine features window.STORE_VIEW_CODE = storeConfig.storeView \|\| 'default'; window.AVAILABLE_STORE_VIEWS = [ { code: window.STORE_VIEW_CODE, base_currency_code: 'USD', default_display_currency_code: 'USD', id: 1, locale: 'en', secure_base_media_url: '', store_name: 'My Demo StoreFront' } ]; window.STORE_NAME = window.STORE_VIEW_CODE; window.DEFAULT_COUNTRY_CODE = 'en'; export default { storeView: window.STORE_VIEW_CODE, graphqlEndpoint: storeConfig.graphqlEndpoint, // Can be GET or POST. When selecting GET, this applies to cache-able GraphQL query requests only. // Mutations will always be executed as POST requests. graphqlMethod: storeConfig.graphqlMethod, headers: storeConfig.headers, mountingPoints: { // TODO: define the application specific mount points as they may be used by <Portal> and <PortalPlacer> }, pagePaths: { // TODO: define the application specific paths/urls as they may be used by the components baseUrl: storeConfig.storeRootUrl }, eventsCollector: { eventForwarding: { acds: true, aep: false, } } };

// get and parse the CIF store configuration from the <head>
const storeConfigEl = document.querySelector('meta[name="store-config"]');
const storeConfig = storeConfigEl ? JSON.parse(storeConfigEl.content) : {};

// the following global variables are needed for some of the peregrine features
window.STORE_VIEW_CODE = storeConfig.storeView || 'default';
window.AVAILABLE_STORE_VIEWS = [
    {
        code: window.STORE_VIEW_CODE,
        base_currency_code: 'USD',
        default_display_currency_code: 'USD',
        id: 1,
        locale: 'en',
        secure_base_media_url: '',
        store_name: 'My Demo StoreFront'
    }
];
window.STORE_NAME = window.STORE_VIEW_CODE;
window.DEFAULT_COUNTRY_CODE = 'en';

export default {
    storeView: window.STORE_VIEW_CODE,
    graphqlEndpoint: storeConfig.graphqlEndpoint,
    // Can be GET or POST. When selecting GET, this applies to cache-able GraphQL query requests only.
    // Mutations will always be executed as POST requests.
    graphqlMethod: storeConfig.graphqlMethod,
    headers: storeConfig.headers,

    mountingPoints: {
        // TODO: define the application specific mount points as they may be used by <Portal> and <PortalPlacer>
    },
    pagePaths: {
        // TODO: define the application specific paths/urls as they may be used by the components
        baseUrl: storeConfig.storeRootUrl
    },
    eventsCollector: {
        eventForwarding: {
            acds: true,
            aep: false,
        }
    }
};

note important
IMPORTANT
Du kanske redan känner till filen `config.js` från AEM Guides - CIF Venia Project, men du måste göra några ändringar i filen. Granska först eventuella TODO-kommentarer. I egenskapen `eventsCollector` kan du sedan hitta objektet `eventsCollector > aep` och uppdatera egenskaperna `orgId` och `datastreamId` till rätt värden. Läs mer.

Skapa en App.js-fil med följande innehåll. Den här filen liknar en vanlig React-startpunktsfil och innehåller React och egna kopplingar samt React Context-användning som underlättar Experience Platform-integreringen.

code language-javascript

code language-javascript
import config from './config'; import React, { useEffect } from 'react'; import ReactDOM from 'react-dom'; import { IntlProvider } from 'react-intl'; import { BrowserRouter as Router } from 'react-router-dom'; import { combineReducers, createStore } from 'redux'; import { Provider as ReduxProvider } from 'react-redux'; import { createHttpLink, ApolloProvider } from '@apollo/client'; import { ConfigContextProvider, useCustomUrlEvent, useReferrerEvent, usePageEvent, useDataLayerEvents, useAddToCartEvent } from '@adobe/aem-core-cif-react-components'; import { EventCollectorContextProvider, useEventCollectorContext } from '@adobe/aem-core-cif-experience-platform-connector'; import { useAdapter } from '@magento/peregrine/lib/talons/Adapter/useAdapter'; import { customFetchToShrinkQuery } from '@magento/peregrine/lib/Apollo/links'; import { BrowserPersistence } from '@magento/peregrine/lib/util'; import { default as PeregrineContextProvider } from '@magento/peregrine/lib/PeregrineContextProvider'; import { enhancer, reducers } from '@magento/peregrine/lib/store'; const storage = new BrowserPersistence(); const store = createStore(combineReducers(reducers), enhancer); storage.setItem('store_view_code', config.storeView); const App = () => { const [{ sdk: mse }] = useEventCollectorContext(); // trigger page-level events useCustomUrlEvent({ mse }); useReferrerEvent({ mse }); usePageEvent({ mse }); // listen for add-to-cart events and enable forwarding to the magento storefront events sdk useAddToCartEvent(({ mse })); // enable CIF specific event forwarding to the Adobe Client Data Layer useDataLayerEvents(); useEffect(() => { // implement a proper marketing opt-in, for demo purpose you hard-set the consent cookie if (document.cookie.indexOf('mg_dnt') < 0) { document.cookie += '; mg_dnt=track'; } }, []); // TODO: use the App to create Portals and PortalPlaceholders to mount the CIF / Peregrine components to the server side rendered markup return <></>; }; const AppContext = ({ children }) => { const { storeView, graphqlEndpoint, graphqlMethod = 'POST', headers = {}, eventsCollector } = config; const { apolloProps } = useAdapter({ apiUrl: new URL(graphqlEndpoint, window.location.origin).toString(), configureLinks: (links, apiBase) => // reconfigure the HTTP link to use the configured graphqlEndpoint, graphqlMethod and storeView header links.set('HTTP', createHttpLink({ fetch: customFetchToShrinkQuery, useGETForQueries: graphqlMethod !== 'POST', uri: apiBase, headers: { ...headers, 'Store': storeView } })) }); return ( <ApolloProvider {...apolloProps}> <IntlProvider locale='en' messages={{}}> <ConfigContextProvider config={config}> <ReduxProvider store={store}> <PeregrineContextProvider> <EventCollectorContextProvider {...eventsCollector}> {children} </EventCollectorContextProvider> </PeregrineContextProvider> </ReduxProvider> </ConfigContextProvider> </IntlProvider> </ApolloProvider> ); }; window.onload = async () => { const root = document.createElement('div'); document.body.appendChild(root); ReactDOM.render( <Router> <AppContext> <App /> </AppContext> </Router>, root ); };

import config from './config';

import React, { useEffect } from 'react';
import ReactDOM from 'react-dom';
import { IntlProvider } from 'react-intl';
import { BrowserRouter as Router } from 'react-router-dom';
import { combineReducers, createStore } from 'redux';
import { Provider as ReduxProvider } from 'react-redux';
import { createHttpLink, ApolloProvider } from '@apollo/client';
import { ConfigContextProvider, useCustomUrlEvent, useReferrerEvent, usePageEvent, useDataLayerEvents, useAddToCartEvent } from '@adobe/aem-core-cif-react-components';
import { EventCollectorContextProvider, useEventCollectorContext } from '@adobe/aem-core-cif-experience-platform-connector';
import { useAdapter } from '@magento/peregrine/lib/talons/Adapter/useAdapter';
import { customFetchToShrinkQuery } from '@magento/peregrine/lib/Apollo/links';
import { BrowserPersistence } from '@magento/peregrine/lib/util';
import { default as PeregrineContextProvider } from '@magento/peregrine/lib/PeregrineContextProvider';
import { enhancer, reducers } from '@magento/peregrine/lib/store';

const storage = new BrowserPersistence();
const store = createStore(combineReducers(reducers), enhancer);

storage.setItem('store_view_code', config.storeView);

const App = () => {
    const [{ sdk: mse }] = useEventCollectorContext();

    // trigger page-level events
    useCustomUrlEvent({ mse });
    useReferrerEvent({ mse });
    usePageEvent({ mse });
    // listen for add-to-cart events and enable forwarding to the magento storefront events sdk
    useAddToCartEvent(({ mse }));
    // enable CIF specific event forwarding to the Adobe Client Data Layer
    useDataLayerEvents();

    useEffect(() => {
        // implement a proper marketing opt-in, for demo purpose you hard-set the consent cookie
        if (document.cookie.indexOf('mg_dnt') < 0) {
            document.cookie += '; mg_dnt=track';
        }
    }, []);

    // TODO: use the App to create Portals and PortalPlaceholders to mount the CIF / Peregrine components to the server side rendered markup
    return <></>;
};

const AppContext = ({ children }) => {
    const { storeView, graphqlEndpoint, graphqlMethod = 'POST', headers = {}, eventsCollector } = config;
    const { apolloProps } = useAdapter({
        apiUrl: new URL(graphqlEndpoint, window.location.origin).toString(),
        configureLinks: (links, apiBase) =>
            // reconfigure the HTTP link to use the configured graphqlEndpoint, graphqlMethod and storeView header

            links.set('HTTP', createHttpLink({
                fetch: customFetchToShrinkQuery,
                useGETForQueries: graphqlMethod !== 'POST',
                uri: apiBase,
                headers: { ...headers, 'Store': storeView }
            }))
    });

    return (
        <ApolloProvider {...apolloProps}>
            <IntlProvider locale='en' messages={{}}>
                <ConfigContextProvider config={config}>
                    <ReduxProvider store={store}>
                        <PeregrineContextProvider>
                            <EventCollectorContextProvider {...eventsCollector}>
                                {children}
                            </EventCollectorContextProvider>
                        </PeregrineContextProvider>
                    </ReduxProvider>
                </ConfigContextProvider>
            </IntlProvider>
        </ApolloProvider>
    );
};

window.onload = async () => {
    const root = document.createElement('div');
    document.body.appendChild(root);

    ReactDOM.render(
        <Router>
            <AppContext>
                <App />
            </AppContext>
        </Router>,
        root
    );
};

EventCollectorContext exporterar React-kontexten som:

läser in biblioteket commerce-events-sdk och commerce-events-collector,
initierar dem med en viss konfiguration för Experience Platform och/eller ACDS
prenumererar på alla evenemang från Premiere och vidarebefordrar dem till händelserna SDK

Du kan granska implementeringsinformationen för EventCollectorContext. Se aem-core-cif-components i GitHub.

Bygg och driftsätt det uppdaterade AEM-projektet build-and-deploy

För att se till att ovanstående paketinstallation, kodändringar och konfigurationsändringar är korrekta återskapar och distribuerar du det uppdaterade AEM Commerce-projektet med följande Maven-kommando: $ mvn clean install -PautoInstallSinglePackage.

Experience Platform aep-setup

Så här tar du emot och lagrar händelsedata från AEM Commerce-sidor, t.ex. kategorier och produkter:

AVAILABILITY

Kontrollera att du ingår i rätt produktprofiler under Adobe Experience Platform och Adobe Experience Platform datainsamling. Om det behövs kan du samarbeta med systemadministratören för att skapa, uppdatera eller tilldela produktprofiler under Admin Console.

Skapa schema med fältgruppen Commerce create-schema

Om du vill definiera strukturen för e-handelshändelsedata måste du skapa ett XDM-schema (Experience Data Model). Ett schema är en uppsättning regler som representerar och validerar datastrukturen och dataformatet.

Gå till startsidan för Adobe Experience Platform-produkten i webbläsaren. Exempel: https://experience.adobe.com/#/@YOUR-ORG-NAME/sname:prod/platform/home.
Leta upp menyn Scheman i det vänstra navigeringsavsnittet, klicka på knappen Skapa schema i det övre högra avsnittet och välj XDM ExperienceEvent.
Namnge schemat med hjälp av fältet Schemaegenskaper > Visningsnamn och lägg till fältgrupper med knappen Disposition > Fältgrupper > Lägg till.
I dialogrutan Lägg till fältgrupper söker du efter Commerce, markerar kryssrutan Commerce Details och klickar på Add Field groups.

TIP

Mer information finns i Grunderna för schemakomposition.

Skapa datauppsättning create-dataset

Om du vill lagra händelsedata måste du skapa en datauppsättning som överensstämmer med schemadefinitionen. En datauppsättning är en lagrings- och hanteringskonstruktion för en datamängd, vanligtvis en tabell som innehåller ett schema (kolumner) och fält (rader).

Gå till startsidan för Adobe Experience Platform-produkten i webbläsaren. Exempel: https://experience.adobe.com/#/@YOUR-ORG-NAME/sname:prod/platform/home.
Leta reda på menyn Datauppsättningar i det vänstra navigeringsavsnittet och klicka på knappen Skapa datauppsättning i det övre högra avsnittet.
På den nya sidan väljer du Skapa datauppsättning från schemakort.

På den nya sidan söker och väljer det schema du skapade i föregående steg och klickar på knappen Nästa.
Namnge datauppsättningen med hjälp av fältet Konfigurera datauppsättning > Namn och klicka på knappen Slutför .

TIP

Mer information finns i Översikt över datauppsättningar.

Skapa dataström create-datastream

Följ de här stegen för att skapa ett dataflöde i Experience Platform.

Gå till startsidan för Adobe Experience Platform-produkten i webbläsaren. Exempel: https://experience.adobe.com/#/@YOUR-ORG-NAME/sname:prod/platform/home.
Leta reda på menyn Datastreams i det vänstra navigeringsavsnittet och klicka på knappen Ny datastream i det övre högra avsnittet.
Namnge ditt datastream med det obligatoriska fältet Namn. Under fältet Händelseschema markerar du det skapade schemat och klickar på Spara.
Öppna den skapade dataströmmen och klicka på Lägg till tjänst.
Under fältet Tjänst väljer du alternativet Adobe Experience Platform . Under fältet Händelsedatauppsättning markerar du datauppsättningsnamnet från föregående steg och klickar på Spara.

TIP

Mer information finns i Datastream-översikten.

Lägg till datastream-värde i AEM Commerce-konfigurationen add-aep-values-to-aem

När du är klar med ovanstående Experience Platform-konfiguration bör du ha datastreamId i den vänstra listen i dataströmsinformationen och orgId i det övre högra hörnet av profilbilden > Kontoinformation > Användarinformation modal.

AEP Datastreams-ID

Uppdatera filen ui.frontend och särskilt objektegenskaperna config.js i AEM Commerce-projektets eventsCollector > aep-modul.
Bygg och driftsätt det uppdaterade AEM Commerce-projektet

Utlös händelsen `addToCart` och verifiera datainsamling event-trigger-verify

Följ stegen ovan för att installera AEM Commerce och Experience Platform. Nu kan du utlösa en addToCart-händelse och verifiera datainsamling med Google Chrome-tillägget Snöpflödesinspektören och datamängden Metrisk och grafer växlar i produktgränssnittet.

Du kan använda AEM-författaren eller publiceringstjänsten från din lokala konfiguration för att utlösa händelsen. I det här exemplet använder du AEM författare genom att logga in på ditt konto.

Välj sidan My Demo StoreFront > us > en på sidan Sites och klicka på Edit i det övre åtgärdsfältet.
Klicka på Visa som publicerad i det övre åtgärdsfältet och klicka sedan på en önskad kategori i butikens navigering.
Klicka på ett önskat produktkort på produktsidan och välj sedan färg, storlek för att aktivera knappen Lägg till i kundvagnen.
Öppna tillägget Snowplow Inspector från webbläsarens tilläggspanel och välj Experience Platform Wed SDK i den vänstra listen.
Gå tillbaka till produktsidan och klicka på Lägg till i kundvagnen. Detta skickar data till Experience Platform. Händelseinformationen visas i tillägget Adobe Experience Platform Debugger.
I Experience Platform produktgränssnitt går du till Datauppsättningar > My Demo StoreFront, under fliken Datauppsättningsaktivitet. Om Mått och diagram är aktiverade visas händelsedatastatistik.

Implementeringsinformation implementation-details

CIF Experience Platform Connector byggs ovanpå dataanslutningen för Adobe Commerce, som ingår i PWA Studio -projektet.

Med PWA Studio-projektet kan du skapa Progressive Web Application-butiker (PWA) med Adobe Commerce eller Magento Open Source i botten. Projektet innehåller också ett komponentbibliotek med namnet Premiere som du kan använda för att lägga till logik i visuella komponenter. Premiere-biblioteket innehåller även anpassade React-kopplingar som används av CIF Experience Platform Connector för att integreras med Experience Platform sömlöst.

Händelser som stöds supported-events

Från och med nu stöds följande händelser:

Upplev XDM-händelser :

Lägg i kundvagnen (AEM)
Visa sida (AEM)
Visa produkt (AEM)
Sökning har skickats (AEM)
Söklösningar mottagna (AEM)

När Premiere-komponenter återanvänds i AEM Commerce-projektet:

Upplev XDM-händelser :

Ta bort från kundvagnen
Open Cart
Visa kundvagn
Omedelbart köp
Starta utcheckning
Fullständig utcheckning

Profil-XDM-händelser :

Logga in
Skapa konto
Redigera konto

Ytterligare resurser additional-resources

Mer information finns i följande resurser:

recommendation-more-help

fbcff2a9-b6fe-4574-b04a-21e75df764ab

AEM-CIF kärnkomponenter och Adobe Experience Platform-integrering aem-cif-aep-integration

Skicka händelsedata för addToCart till Experience Platform send-addtocart-to-aep

Förutsättningar prerequisites

Installation av AEM Commerce as a Cloud Service aem-setup

Lokal installation

Projektinställningar

Installera anslutningsberoenden för Premiere och CIF-AEP

Konfigurera Maven att använda argumentet --force

Ändra konfigurationsformat för Label

Konfigurera webbpaket för användning av babel

Konfigurera Apollo-klient

Initiera kärnkomponenterna Peregrine och CIF

Bygg och driftsätt det uppdaterade AEM-projektet build-and-deploy

Experience Platform aep-setup

Skapa schema med fältgruppen Commerce create-schema

Skapa datauppsättning create-dataset

Skapa dataström create-datastream

Lägg till datastream-värde i AEM Commerce-konfigurationen add-aep-values-to-aem

Utlös händelsen addToCart och verifiera datainsamling event-trigger-verify

Implementeringsinformation implementation-details

Händelser som stöds supported-events

Ytterligare resurser additional-resources

Skicka händelsedata för `addToCart` till Experience Platform send-addtocart-to-aep

Konfigurera Maven att använda argumentet `--force`

Utlös händelsen `addToCart` och verifiera datainsamling event-trigger-verify