AEM GraphQL

🔍 What Is It?

AEM provides a GraphQL endpoint that exposes Content Fragment data. Key concepts:

• →GraphQL Endpoint — /content/cq:graphql/global/endpoint.json (or custom endpoints)
• →Persisted Queries — Pre-saved GraphQL queries accessible via simple GET URLs
• →Content Fragment Models — Define the GraphQL schema automatically
• →Delivery API — Read-only API for fetching content (not for mutations)

Each Content Fragment Model automatically generates GraphQL types. An "Article" model generates ArticleModel, ArticleModelList, ArticleByPath, etc.

🎯 Why Do We Need It?

GraphQL enables the headless and hybrid AEM patterns:

• →Headless — React/Vue/Angular apps fetch content via GraphQL, render their own UI
• →Hybrid — Some pages use AEM page editor; some sections fetch via GraphQL
• →Omnichannel — Same content delivered to web, mobile, kiosk, voice assistants
• →Performance — Fetch exactly the fields you need, no over-fetching

🏗️ What Happens in Real Projects?

Real Project: React App consuming AEM Content

1. Content team creates "Product" fragments in AEM
2. React developer writes a GraphQL query to fetch products
3. React app calls the persisted query endpoint
4. AEM returns JSON with exactly the requested fields
5. React renders the product listing

Persisted Query URL:

GET /graphql/execute.json/mysite/product-listing

This URL is cacheable by CDN and Dispatcher — much better than ad-hoc POST queries.

⚙️ How It Works

Query Types:

• →{ModelName}ByPath — Fetch single fragment by path
• →{ModelName}List — Fetch multiple fragments with filtering/sorting
• →{ModelName}Paginated — Paginated results

Filtering:

{
  articleList(
    filter: { category: { _expressions: [{ value: "Technology" }] } }
    sort: "publishDate DESC"
    limit: 10
    offset: 0
  ) { items { title publishDate } }
}

Authentication:

For public content: no auth needed (if content is published)

For preview/draft content: use AEM authentication tokens

💻 Example

GraphQL Queries in Practice — Common GraphQL patterns for AEM Content Fragments.

# Fetch article list with filtering
query GetTechArticles {
  articleList(
    filter: {
      category: {
        _expressions: [{ value: "Technology", _operator: EQUALS }]
      }
      _path: { _expressions: [{ value: "/content/dam/mysite/articles", _operator: STARTS_WITH }] }
    }
    sort: "publishDate DESC"
    limit: 12
  ) {
    items {
      _path
      headline
      publishDate
      category
      author {
        ... on AuthorModel {
          name
          photo { _path }
        }
      }
      featuredImage {
        _path
        width
        height
      }
      body {
        plaintext
      }
    }
    _count
  }
}

🤔 Common Confusions

🚨 Common Production Issues

✅ Best Practices

🏛️ Architect's Note

💬 Frequently Asked Questions

🎯 Key Takeaways

🔗 Related Topics

🎯 Practice this topic in interviews

↗ Where this topic fits