AEM Experience Fragments | Community
Skip to main content
AEM_Forum
AEM_Forum
Level 10
November 2, 2023
Solved

AEM Experience Fragments

  • November 2, 2023
  • 3 replies
  • 2501 views

Hi all,

 

Once we create an AEM Experience Fragment, will it be ready to be consumed by both AEM and other channels?

What is the output? HTML and CSS? Do not think it is JSON, as we need layout as well.

 

From AEM Front end, we use Experience Fragment component and select this fragment.

From other channels how to consume it?

 

What is the role of HTTP API in this process?

 

Apologies for the number of queries.

 

Appreciate all your responses.

 

Thanks,

Rama.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by kautuk_sahni

@aem_forum My 2 cents:

The HTTP API plays a crucial role in the process of consuming Experience Fragments from other channels beyond AEM. It serves as a standardized interface for exchanging Experience Fragment data between AEM and external applications, enabling seamless integration and utilization of Experience Fragments across various platforms.

Here's a some explanation of how the HTTP API facilitates the consumption of Experience Fragments:

  1. Data Retrieval and Access: The HTTP API provides a standardized way to retrieve Experience Fragment data from AEM. Developers can use HTTP GET requests to fetch the content and metadata of Experience Fragments, including their HTML, CSS, and layout information. This allows external applications to access and utilize Experience Fragments programmatically.

  2. Content Integration and Delivery: By leveraging the HTTP API, developers can integrate Experience Fragments into their own applications and workflows. They can retrieve Experience Fragment data, parse it to extract the necessary components and render the fragments within their applications. This enables the delivery of consistent and reusable content across various channels.

  3. Decoupling and Flexibility: The HTTP API decouples the consumption of Experience Fragments from AEM's front-end presentation layer. Developers can utilize Experience Fragments without relying on AEM's WCM (Web Content Management) knowledge or the Experience Fragment component. This fosters flexibility and allows for integration with diverse front-end frameworks and platforms.

  4. Headless CMS Capabilities: The HTTP API empowers AEM to function as a headless CMS (Content Management System), enabling it to serve as a content repository for external applications. Developers can access and manage Experience Fragments using the API, without the need for direct integration with AEM's presentation layer.

  5. Standardized Communication: The HTTP API adheres to the widely adopted HTTP protocol, ensuring compatibility with a vast range of programming languages, frameworks, and platforms. This promotes interoperability and simplifies the integration of Experience Fragments into various development environments.

3 replies

MarkusBullaAdobe
Adobe Employee
MarkusBullaAdobeAdobe Employee
Adobe Employee
November 2, 2023

Hi @aem_forum!

There has been a similar question on usage and consumption of Experience Fragments (XF) by 3rd party applications / other channels than AEM itself.

Let me cite my answer from the other post:

Experience Fragments (short: XF) in AEM are a great way to reuse your content at various places, being it inside of AEM or on other channels. See also here for a high level overview. XF are usually meant to be consumed as rendered HTML for external applications/channels, see also the Plain HTML rendition.

 

If you want to expose rendered HTML to a 3rd party application, XF is the right option.

If you are looking to expose content as structured data, please refer to Content Fragments (short: CF) instead.

 

In addition to the official documentation on the differences, there's also an article that outlines the concepts and differences of the two pretty well.

Especially the links about rendered HTML and the Plain HTML rendition should be useful with regards to your query.

You are right that XF are HTML and not JSON. Once an XF is published, it should be ready for consumption through other channels. The exact way of consumption depends on the desired output channel.

 

Hope that helps!

    AEM_Forum
    AEM_ForumAuthor
    Level 10
    November 2, 2023

    Hi,

     

    What is the role of HTTP API in this process?

     

    Thanks,

    Rama.

      kautuk_sahni
      Community Manager
      kautuk_sahniCommunity ManagerAccepted solution
      Community Manager
      November 6, 2023

      @aem_forum My 2 cents:

      The HTTP API plays a crucial role in the process of consuming Experience Fragments from other channels beyond AEM. It serves as a standardized interface for exchanging Experience Fragment data between AEM and external applications, enabling seamless integration and utilization of Experience Fragments across various platforms.

      Here's a some explanation of how the HTTP API facilitates the consumption of Experience Fragments:

      1. Data Retrieval and Access: The HTTP API provides a standardized way to retrieve Experience Fragment data from AEM. Developers can use HTTP GET requests to fetch the content and metadata of Experience Fragments, including their HTML, CSS, and layout information. This allows external applications to access and utilize Experience Fragments programmatically.

      2. Content Integration and Delivery: By leveraging the HTTP API, developers can integrate Experience Fragments into their own applications and workflows. They can retrieve Experience Fragment data, parse it to extract the necessary components and render the fragments within their applications. This enables the delivery of consistent and reusable content across various channels.

      3. Decoupling and Flexibility: The HTTP API decouples the consumption of Experience Fragments from AEM's front-end presentation layer. Developers can utilize Experience Fragments without relying on AEM's WCM (Web Content Management) knowledge or the Experience Fragment component. This fosters flexibility and allows for integration with diverse front-end frameworks and platforms.

      4. Headless CMS Capabilities: The HTTP API empowers AEM to function as a headless CMS (Content Management System), enabling it to serve as a content repository for external applications. Developers can access and manage Experience Fragments using the API, without the need for direct integration with AEM's presentation layer.

      5. Standardized Communication: The HTTP API adheres to the widely adopted HTTP protocol, ensuring compatibility with a vast range of programming languages, frameworks, and platforms. This promotes interoperability and simplifies the integration of Experience Fragments into various development environments.

      Kautuk Sahni
        aanchal-sikka
        Community Advisor
        aanchal-sikkaCommunity Advisor
        Community Advisor
        November 2, 2023

        Hello @aem_forum 

         

        Please refer to following links:

        https://medium.com/exadel-digital-marketing-technology-practice/aem-experience-fragments-consuming-outside-aem-81cb5b6bdc65

        https://kiransg.com/2023/05/09/exporting-aem-experience-fragment-page-content-for-a-b-testing-and-external-systems-without-html-tags/

         

        Both the links contain code-snippets with use-cases on how you can export XF to external applications

        Aanchal Sikka
          kautuk_sahni
          Community Manager
          kautuk_sahniCommunity Manager
          Community Manager
          November 6, 2023

          @aem_forum Did you find the suggestions from users helpful? Please let us know if more information is required. Otherwise, please mark the answer as correct for posterity. If you have found out solution yourself, please share it with the community.

          Kautuk Sahni
          AEM_Forum
          AEM_ForumAuthor
          Level 10
          November 6, 2023

          Hi,

           

          Yes. All my queries were answered, except for the below:

          What is the role of HTTP API in this process for both CFs and EFs.

           

          Thanks,

          Rama.

          Terms & ConditionsAccessibility statement

          Loading footer...