Більшість headless-проєктів розводять контент і комерцію по двох системах і двох командах, і шов між ними стає для когось постійною роботою. Патерн AEM-as-proxy цей шов закриває. AEM стоїть попереду, тримає роутинг, SEO і кешування, а транзакційні виклики передає в Adobe Commerce через GraphQL. Маркетологи працюють в AEM. Чекаут лишається там, де йому місце.
Це не альтернативи одне одному
Порівняння спливає досить часто, щоб відповісти прямо. Adobe Experience Manager і Adobe Commerce - це не два варіанти на вибір. AEM - це те, де живуть сторінки, контент і ассети. Adobe Commerce - це каталог, кошик і замовлення. У компаній на стеку Adobe зазвичай є і те, і інше.
Справжнє питання в тому, як вони розмовляють між собою. Відповідь самої Adobe - Commerce Integration Framework: він підключає GraphQL-схему Adobe Commerce всередину AEM, і товар ставиться на сторінку так само, як будь-який інший компонент.
У що обходиться експлуатація цієї інтеграції
Саме з'єднання - легка половина. Важка половина, яка з'їдає графік, - це все навколо нього.
Кожен run-mode в AEM має дивитись на потрібне оточення Adobe Commerce, і GraphQL-клієнту потрібна своя конфігурація під кожне. Author і publish розділені, і обидва існують для local, dev, test, UAT, stage і production. На корпоративному впровадженні, над яким я працював, це вилилось у три з лишком десятки конфігураційних профілів, які треба тримати в згоді між усіма оточеннями.
Нічого цікавого в цьому немає. Саме сюди йде час, і саме це пропускають в оцінках.
Звідки це в мене і що саме я роблю
Це дві різні речі, і їх варто розділити.
Headless-шаблон вітрини на цьому сайті - цілком мій, разом з його адаптерами під Adobe Commerce і AEM. Платформена робота по AEM і Adobe Commerce робилась у складі команди, на корпоративному впровадженні з Adobe Commerce Integration Framework 2.15.
Я не AEM-агенція і не видаю себе за неї. Бекенд AEM корпоративного масштабу - це командний вид спорту. Я роблю фронт: вітрину, шар компонентів і той шов інтеграції, де два продукти Adobe зустрічаються.
Що входить в інтеграцію
AEM як точка входу
AEM стоїть перед Adobe Commerce. Він приймає вхідний запит, віддає закешовані Experience Fragments і передає динамічні виклики в комерційний бекенд: кошик, покупець, залишки.
CIF і що він дає маркетингу
Commerce Integration Framework підтягує живі дані про товари на сторінки AEM. Налаштований як треба, він дає Commerce Teasers: маркетолог перетягує товар на сторінку, і нікому не треба заводити задачу.
Dispatcher і CDN
HTML віддає AEM, тому сторінку можна кешувати на Dispatcher і на CDN. Ті частини, які мусять лишатись персональними, вирізаються і підставляються окремо: вміст кошика, ціни для залогіненого покупця. Яка частка сторінки під це потрапить, залежить від сторінки, і той, хто називає вам відсоток, не побачивши вашої, просто вгадує.
Регіональні налаштування в одному місці
Context-aware конфігурація AEM тримає валюту, мову і store view по регіонах, тому новий ринок не потребує фронтенд-деплою Adobe Commerce.
Та сама модель, зібрана в шаблон
Патерн постачається як відкритий шаблон вітрини. Один доступний UI на токенах, адаптери під Adobe Commerce і під AEM як джерело контенту, Lighthouse у CI як умова збірки і self-hosting на вашій інфраструктурі. У живому демо розгорнутий адаптер Shopify; адаптери Adobe Commerce і AEM лежать у репозиторії з тестами.
Дорожня карта інтеграції
- 1
Discovery. Розбір потоків даних між GraphQL-схемою Adobe Commerce і компонентами AEM
- 2
Архітектура. Проксі-шар, правила CORS і обмін токенами
- 3
Розробка. Компоненти, зібрані під контракт Adobe CIF
- 4
Оптимізація. Правила Dispatcher і Varnish для hole-punching, щоб кеш переживав персоналізацію
Корпоративний стек
Що у вас є, коли роботу закінчено
Це результати роботи, а не прогнози. Кожен з них можна перевірити в день здачі.
- AEM віддає сторінку, Adobe Commerce віддає транзакцію, і з'єднує їх CIF, а не саморобна склейка.
- Записана карта того, який run-mode AEM дивиться на яке оточення Adobe Commerce, по всіх стадіях.
- Commerce Teasers, які маркетинг ставить на сторінку, не заводячи задачу.
Пов’язані матеріали
Цей маршрут допоможе оцінити глибину імплементації до старту вашого проєкту.