Expand my Community achievements bar.

SOLVED

How can we Implement/Use In Apache Sling Dynamic Include in AEM Headless cms project?

Avatar

Level 2

I am working on an AEM Headless CMS project where AEM serves content as JSON via Content Fragments/API, and React is used as the front end. Since SDI is typically used for HTML-based components in traditional AEM pages, how can we leverage SDI for dynamically changing content while keeping the benefits of caching in an AEM Headless setup?

 

   Thanks in advance. 

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi @Syed_Shaik 

 

Sling Dynamic Include is an important feature of sling, that allows us to not cache part of component on the AEM page.

As far as i know, you can't leverage this SDI features in headless AEM projects as application is completely hosted in front end based react application. You should go with another approach for this requirement

 

Hope this helps

View solution in original post

4 Replies

Avatar

Level 5

hi @Syed_Shaik ,

 

In AEM Headless implementation assuming that the AEM server (author and publish) serves as the content repository and provides content via content fragments or content APIs, while a separate front-end application server is responsible for rendering and serving the pages.

 

Coming to the caching implementation, it depends on various factors like what type of content is being served, static content or dynamic content and accordingly we can plan the caching

  • In general, In AEM dispatcher caches the content Json (served via API/Content Fragments)
  • If the content is static we can consider the caching at CDN or the application server
  • If the content is dynamic, cache the static content and render the dynamic content via client side.

Thanks,

Anil

Avatar

Correct answer by
Community Advisor

Hi @Syed_Shaik 

 

Sling Dynamic Include is an important feature of sling, that allows us to not cache part of component on the AEM page.

As far as i know, you can't leverage this SDI features in headless AEM projects as application is completely hosted in front end based react application. You should go with another approach for this requirement

 

Hope this helps

Avatar

Level 9

hi @Syed_Shaik,

Are you looking to utilize the out-of-the-box features of SDI for JSON, similar to how it's used for HTML? According to the official documentation (https://sling.apache.org/documentation/bundles/dynamic-includes.html), there's only one single mention regarding JSON:

 

If a component does not generate HTML but JSON, binary data or any format that doesn't allow XML-style comments, make sure to turn off the Comment option in configuration.

 

Logically, I would expect the JSON generated by the component to include something like this:

{
  "staticContent": { ... },
  "dynamicContent": "<!-- SDI-INCLUDE /api/dynamic-data -->"
}

Additionally, the OSGI configuration allows us to specify an extension for components, which doesn't have to be HTML; it could be JSON. This suggests that JSON capability is possible, although I haven't encountered any examples yet. This presents an interesting scenario. Please share any experiments or findings you have!

Avatar

Administrator

@Syed_Shaik Did you find the suggestions helpful? If you need more information, please let us know. If a response resolved your issue, kindly mark it as correct to help others in the future. Alternatively, if you discovered a solution on your own, we'd appreciate it if you could share it with the community. Thank you!



Kautuk Sahni