If not, it will create it on the fly and. Please ensure that the previous chapters have been completed before proceeding with this chapter. Send GraphQL queries using the GraphiQL IDE. The following are examples of possible approaches for constructing URLs for AEM GraphQL API and image requests, for several popular headless frameworks and platforms. GraphiQL is included in all environments of AEM (but will only be accessible/visible when you configure your endpoints). Learn how Experience Manager as a Cloud. This document is part of a multi-part tutorial. AEM exposes a variety of HTTP endpoints that can be interacted with in a headless manner, from GraphQL, AEM Content Services to Assets. Manage AEM Author access using Adobe IMS via the Adobe Admin Console. The SPA retrieves this content via AEM’s GraphQL API. Authorization. To facilitate this, AEM supports token-based authentication of HTTP. the query object type). In this video you will: Learn how to enable GraphQL Persisted Queries. allowedpaths specifies the URL path patterns allowed from the specified origins. Content Fragments used in AEM Headless content modeling, often reference image assets intended for display in the headless experience. Learn how to enable, execute queries against, and publish and secure GraphQL endpoints. FAQs. Project Configurations; GraphQL endpoints;. Using the Access Token in a GraphQL Request. Rich text with AEM Headless. In the Basic Tutorial - Build a React app that uses AEM’s GraphQL APIs step we had reviewed and enhanced few key files to get hands-on expertise. The WKND client application connects to AEM publish service, so it is important that you published the following to the AEM publish service. Schema & Table Visibility#. The AEM Headless quick setup gets you hands-on with AEM Headless using content from the WKND Site sample project, and a sample React App (a SPA) that consumes the content over AEM Headless GraphQL APIs. Manage. AEM 6. AEM has a large list of available content types and you’re able to select zero or more. The GraphiQL component is a combination of both the above. To query a resource you would type so: { resource } That's not enough, however. Recommendation. The endpoint is the path used to access GraphQL for AEM. This is the authentication token. The AEM Headless quick setup gets you hands-on with AEM Headless using content from the WKND Site sample project, and a sample React App (a SPA) that consumes the content over AEM Headless GraphQL APIs. In the basic tutorial multi-step GraphQL tutorial, you used the GraphiQL Explorer to test and refine the GraphQL queries. 5 the GraphiQL IDE tool must be manually installed. Contribute to lamontacrook/aem-headless-portal development by creating an account on GitHub. How to use Clone the adobe/aem-guides-wknd-graphql repository: Tap the Local token tab. 5 . Select the Keystore tab. Project Configurations; GraphQL endpoints; Content Fragment. Select Save. The axios implementation is quite similar to fetch, axios is a bit more high level and developer. js. Complete the quick setup for AEM as a Cloud Service to configure your AEM as a Cloud Service. AEM Headless is a CMS solution from Experience Manager that allows structured content (Content Fragments) in AEM to be consumed by any app over HTTP using GraphQL. The AEM Headless Client for JavaScript is used to execute the GraphQL persisted queries that power the app. The GraphiQL tool also enables users to persist or save queries to be used by client applications in a production setting. g. I'm receiving this error when trying to query my graphQL API that uses Basic authentication: Response to preflight request doesn't pass access control check: No. Complete the quick setup for AEM as a Cloud Service to configure your AEM as a Cloud Service. Non-Apple Single Sign-On TV Provider Authentication Flow; Errors while publishing segments created on VRS to Experience Cloud;. Overview; 1 - Defining Content Fragment Models; 2 - Authoring Content Fragments; 3 - Explore GraphQL APIs; 4 - Build a React app; Advanced Tutorial. In ASP. Select GraphQL to create a new GraphQL API. 10. js application demonstrates how to query content using AEM’s GraphQL APIs using persisted queries. Developer. The GraphQL schema can contain sensitive information. The best way to get started with GraphQL and AEM is to start experiment with queries using our sample content fragment data. scratch file. setDefaultHeader ( "X-request-id", "100004f00ab5" ); We can clear the global headers anytime: Unirest. AEM provides a Translation Integration Framework for headless content, allowing Content Fragments and supporting assets to be easily translated for use across locales. Step 2: Adding data to a Next. AEM Headless single-page app (SPA) deployments involve JavaScript-based applications built using frameworks such as React or Vue, that consume and interact with content in AEM in a headless manner. By leveraging AEM Headless APIs, you can retrieve content, assets, and data from your AEM instance and use them to power your React application. Documentation AEM GraphQL configuration issues. Content Fragments are used in AEM to create and manage content for the SPA. Authentication options. Content Fragments in AEM provide structured content management. Without Introspection and the Schema, tools like these wouldn't exist. In other to do this, we must first add a user model, then model method for authentication, then add it to our GraphQL schema . Explore the dynamic world of content delivery through the lenses of 'Content Fragments' and 'GraphQL. Experience LeagueAn end-to-end tutorial illustrating how to build-out and expose content using AEM’s GraphQL APIs and consumed by an external app, in a headless CMS scenario. Select the AEM as a Cloud Service development environment from the Eligible Deployment Environments select box. GraphQL Authenticating Client - Authentication is the process or action of verifying the identity of a user or a process. directly; for. Adobe Experience Manager as a Cloud Service’s Cross-Origin Resource Sharing (CORS) facilitates non-AEM web properties to make browser-based client-side calls to AEM’s GraphQL APIs, and other AEM Headless resources. To securely setup AEM GraphQL for use with Content Fragments and your apps you need to configure various components. For authentication, the third-party service must retrieve an Access Token that can then be used in the GraphQL Request. 7 - GraphQL Persisted Queries; Basic Tutorial. AEM GraphQL API. The GraphiQL tool also enables users to persist or save queries to be used by client applications in a production setting. Learn how to create relationships between Content Fragment Models in Adobe Experience Manager (AEM) and how to leverage these relationships in GraphQL queries. The AEM Developer Portal; AEM Headless tutorials - If you prefer to learn by doing and have existing knowledge of AEM, take our hands-on tutorials organized by API and framework, that explore creating and using applications built on. AEM Headless as a Cloud Service. Limited content can be edited within AEM. I want to set-up authentication on GraphQL endpoint before sharing it with third-party Apps. In this tutorial, we’ll cover a few concepts. In this example, we’re restricting the content type to only images. Browse the following tutorials based on the technology used. Select the Keystore tab. Overview; 1 - Create Content Fragment Models; 2 - Author Content Fragments; 3 - Explore the AEM GraphQL API; 4 - Persisted GraphQL. See full list on experienceleague. In previous releases, a package was needed to install the. Contact Adobe to enable this capability for your AEM Cloud Service program and environments. The GraphiQL Explorer tool enables developers to create, and test queries against content on the current AEM environment. This is the same framework used to translate other AEM content, such as Pages, Experience Fragments, Assets, and Forms. AEM’s GraphQL queries can be written to provide URLs to images based on where the image is referenced from. cif-connector-graphql: the CIF GraphQL connector, based on Magento GraphQL; cif-virtual-catalog: the bundle that permits to bind products in the AEM Commerce console; content: contains the following content packages in the sub-folders cif-connector-graphql: the content package for the CIF GraphQL connectorAs defined in GraphQL, offset-based pagination is quite simple: type User { id: ID! } type Query { signedUpUsers (limit: Int, offset: Int): [User!]! } As you can see, to add pagination, all you have to do is add the arguments 'limit' and 'offset' to the field 'signedUpUsers'. Learn how AEM can go beyond a pure headless use case, with options for in-context authoring and experience management. To create the signature part you have to take the encoded header, the encoded payload, a secret, the algorithm specified in the header, and sign that. Prerequisites. One simple way to add authentication to your project is with Okta. AEM GraphQL API requests. This document is part of a multi-part tutorial. Authentication can provide context to a session and personalize the type of data that a user sees. Understand how the Content Fragment Model. GraphQL API. The AEM Headless Client for JavaScript is used to execute the GraphQL persisted queries that power the app. Prerequisites. ”. js v18; Git; 1. Download Advanced-GraphQL-Tutorial-Starter-Package-1. #3 is what brand new apps might explore, to avoid accumulating non-GraphQL flows. This guide uses the AEM as a Cloud Service SDK. It's focussed on Assets, but it is basically the same for sites. Control access to your GraphQL API. A GraphQL server can be seen as an API proxy: the query is a tree of API functions (resolvers) executed by the GraphQL server. For more information, see "About authentication with SAML single sign-on" and "Authorizing a personal access token for use with SAML single sign-on. View the source code on GitHub. . Build a React JS app using GraphQL in a pure headless scenario. Can't set Authentication header for Apollo client. In the Basic Tutorial - Build a React app that uses AEM’s GraphQL APIs step we had reviewed and enhanced few key files to get hands-on expertise. In this example, we’re restricting the content type to only images. Headless implementations enable delivery of experiences across platforms and channels at scale. The sample React app has three main parts: The src/api folder contains files used to make GraphQL queries to AEM. Next, we’ll use the AEM Headless SDK to retrieve Content Fragment data from AEM’s GraphQL APIs. See Authentication for Remote AEM GraphQL Queries on Content Fragments. Apollo GraphQL Server authentication with passportJS. In this video you will: Learn how to enable GraphQL Endpoints. Setting up NestJs. Next, explore the power of AEM’s GraphQL API using the built-in GraphiQL Explorer. Please ensure that the previous chapters have been completed before proceeding with this chapter. Tap in the Integrations tab. You can surely wrap the Firebase API into GraphQL resolvers, and make calls that way. express or nginx) take care of authentication. Review Adventures React Component Adobe Experience Manager as a Cloud Service’s Cross-Origin Resource Sharing (CORS) facilitates non-AEM web properties to make browser-based client-side calls to AEM’s GraphQL APIs, and other AEM Headless resources. The configured AEM service’s host/domain is then used to construct the AEM GraphQL API URLs and Image URLs. The following configurations are examples. Also, one should consider the Pros after its implementation : Very flexible to support new items and update existing behaviour. An end-to-end tutorial illustrating how to build-out and expose content using AEM and consumed by a native mobile app, in a headless CMS scenario. They can be requested with a GET request by client applications. The following tools should be installed locally: JDK 11; Node. Next, explore the power of AEM’s GraphQL API using the built-in GraphiQL Explorer. src/api/aemHeadlessClient. js are gaining popularity in the recent years. Cash will no longer be. So that all about part-1 of the GraphQL authentication series. Headless implementation forgoes page and component management, as is. The AEM GraphQL API is a customized version based on the standard GraphQL API specification, specially configured to allow you to perform (complex) queries on your Content Fragments. The AEM GraphQL API is a customized version based on the standard GraphQL API specification, specially configured to allow you to perform (complex) queries on your Content Fragments. Questions that have arisen: Q: “How is the GraphQL API for AEM different from Query Builder API?” A: “The AEM GraphQL API offers total control on the JSON output, and is an industry standard for querying content. AEM provides a Translation Integration Framework for headless content, allowing Content Fragments and supporting assets to be easily translated for use across locales. An end-to-end tutorial illustrating how to build. These are defined by information architects in the AEM Content Fragment Model editor. It is the authentication that an author instance expects (which we cannot disable or it is not the way an AEM author instance works) To put it with example - This document is part of a multi-part tutorial. This React application demonstrates how to query content using AEM’s GraphQL APIs using persisted queries. The AEM GraphQL API allows you to update the default cache-control parameters to your queries in order to. Tests for running tests and analyzing the. This flow gives. Handle authentication in GraphQL itself. 4. Apollo Server 2 + Auth0. . If your modeling requirements require further restriction, there are some other options available. Tap the Technical Accounts tab. AEM has a large list of available content types and you’re able to select zero or more. Update cache-control parameters in persisted queries. GraphQL consists of a schema definition. Example applications are a great way to explore the headless capabilities of Adobe Experience Manager (AEM). Content Fragments. Before enhancing the WKND App, review the key files. See Submitting your Documents for Authentication. Persisted queries are queries that are stored on the Adobe Experience Manager (AEM) server. To get started with GraphQL queries and how they work with AEM Content Fragments, it helps to see some practical examples. Because . Net approach there is no issue. GraphQL Query optimization Usually, it relies on invalidation techniques that ensure that any content changed in AEM is properly updated in the Dispatcher. In the Basic Tutorial - Build a React app that uses AEM’s GraphQL APIs step we had reviewed and enhanced few key files to get hands-on expertise. We are using AEM 6. Command line parameters define: The AEM as a Cloud Service Author service host. Experiment constructing basic queries using the GraphQL syntax. 02. The GraphQL API in AEM is primarily designed to deliver AEM Content Fragment’s to downstream applications as part of a headless deployment. For a third-party service to connect with an AEM instance it must. Sign In. Authentication. Authorization patterns in GraphQL are quite different than in a REST API. Tap Create new technical account button. pg_graphql uses Postgres' search_path and permissions system to determine which schemas and entities are exposed in the GraphQL schema. The WKND client application connects to AEM publish service, so it is important that you published the following to the AEM publish service. 2. Navigate to the Software Distribution Portal > AEM as a Cloud Service. Before enhancing the WKND App, review the key files. 6. 1. We have implemented GraphQL endpoint in AMS environment (AEM 6. js v18; Git; 1. Anatomy of the React app. One such advantage is that it allows you to implement permissions and granular access control in the API. Querying AEM using GraphQL using persisted queries (as opposed to client-defined GraphQL queries) allows developers to persist a. Users with an IMS org administrator role, and who are a member of the AEM Users or AEM Administrators Product Profile on AEM Author, can generate a set of credentials from AEM as a Cloud Service. The basic operation of queries with GraphQL for AEM adhere to the standard GraphQL specification. Otherwise, this will create a new . The following tools should be installed locally: JDK 11;. Author in-context a portion of a remotely hosted React application. Prerequisites. Deploying a SPA that interacts AEM in a headless manner involves hosting the SPA and making it accessible via a web browser. But if you want to develop all endpoint in GraphQL including authentication that is also fine. Getting started with authNext. 7 - GraphQL Persisted Queries; Basic Tutorial. Learn how AEM can go beyond a pure headless use case, with options for in-context authoring and experience management. An implementation of the standard GraphiQL IDE is available for use with the GraphQL API of Adobe Experience Manager (AEM) as a Cloud Service. This doesn't mean that there aren't solutions for these issues when using GraphQL, just that they're outside the description about what GraphQL is and instead. This session dedicated to the query builder is useful for an overview and use of the tool. Authentication for GraphQL APIs. Next, explore the power of AEM’s GraphQL API using the built-in GraphiQL IDE. Project Configurations; GraphQL endpoints; Content Fragment. Example: if one sets up CUG, the results returned will be based on user's session. This guide uses the AEM as a Cloud Service SDK. The GraphiQL tool also enables users to persist or save queries to be used by client applications in a production setting. js initializes and exports the AEM Headless Client used to communicate with AEM; src/api/usePersistedQueries. Prerequisites. Browse the following tutorials based on the technology used. Further information More information on. This server-to-server application demonstrates how to query content using AEM’s GraphQL APIs using persisted queries and print it on terminal. Retrieving an Access Token. It can be considered as a GraphQL client meant to provide ease of use and can be put above a normal fetch or axios API call, but it does not have as many advanced features like cache management as the apollo client, so functionality wise it lies somewhere. Developer. TIP. The advanced tutorial illustrates in-depth aspects of working with Content Fragment Models, Content Fragments, and the AEM GraphQL persisted queries, including using the GraphQL persisted queries in a client application. It will be used for application to application authentication. However, I checked on Software Distribution but could not find the tooling (Managed Service version) of "GraphiQL" to download: (. Get started with Adobe Experience Manager (AEM) and GraphQL. Both GraphQL and Next. 6. Project Configurations; GraphQL endpoints; Content Fragment. The GraphiQL tool also enables users to persist or save queries to be used by client applications in a production setting. The WKND client application connects to AEM publish service, so it is important that you published the following to the AEM publish service. In this example, we’re restricting the content type to only images. Please ensure that the previous chapters have been completed before proceeding with this chapter. Content Models are structured representation of content. This guide uses the AEM as a Cloud Service SDK. Learn how to create GraphQL queries to return content from Adobe Experience Manager (AEM) and how to use the GraphiQL tool to quickly test, refine, and debug queries. Specify JWT. Courses Recommended courses Tutorials Certification Events Instructor-led training Browse content library View all learning options. Through GraphQL, AEM also exposes the metadata of a Content Fragment. Retrieving an Access Token. Authentication of requests; As well as authentication of all the servlet requests coming into a server; Checking resource type, path, and request coming on from a particular page, etc. Click Tools | HTTP Client | Create Request in HTTP Client. Please ensure that the previous chapters have been completed before proceeding with this chapter. Learn about advanced queries using filters, variables, and directives. Complete the quick setup for AEM as a Cloud Service to configure your AEM as a Cloud Service. GraphQL Authentication with React and Apollo. For GraphQL queries with AEM there are a few extensions: . In this example, we’re restricting the content type to only images. This tutorial explores how AEM Content Services can be used to power the experience of an Mobile App that displays Event information (music, performance, art, etc. Content Fragments are used, as the content is structured according to Content Fragment Models. Learn about the various data types used to build out the Content Fragment Model. The following are examples of possible approaches for constructing URLs for AEM GraphQL API and image requests, for several popular headless frameworks and platforms. In GraphQL, we’d use this to manage access to particular queries and mutations based on identity, role, or permissions. Authorization. This document is part of a multi-part tutorial. These remote queries may require authenticated API access to secure headless content delivery. For testing and development, you can also access the AEM GraphQL API directly using the GraphiQL interface. And some sample GraphQL queries, based on the sample content fragment structure (Content Fragment Models and related Content Fragments). We recommend upgrading from 3. Review Adventures React Component The advanced tutorial illustrates in-depth aspects of working with Content Fragment Models, Content Fragments, and the AEM GraphQL persisted queries, including using the GraphQL persisted queries in a client application. x. org. Further Reference. If you expect a list of results: Manage GraphQL endpoints in AEM. Next, I will expose our types to GraphQL for querying. The following tools should be installed locally: JDK 11; Node. In this chapter, you use the GraphiQL Explorer to define more advanced queries to gather data of the. Explore the AEM GraphQL API. Select main from the Git Branch select box. AEM GraphQL API requests. A series of articles on building a fullstack app with TypeScript, Next. We are going to spin off a simple GraphQL server using express-graphql and get it connected to a MySQL database. AEM Headless supports management of image assets and their optimized delivery. Example: if one sets up CUG, the results returned will be based on user's session. The source code and the MySQL files are in this repository. A primary use case for The Adobe Experience Manager as a Cloud Service (AEM) GraphQL API for Content Fragment Delivery is to accept remote. Next, explore the power of AEM’s GraphQL API using the built-in GraphiQL Explorer. Depending on the type selected, there are three flavors available for use in AEM GraphQL: <code>onlyDate</code>, <code>onlyTime</code>,. This document is part of a multi-part tutorial. NET Core, authentication is handled by the authentication service, IAuthenticationService, which is used by authentication middleware. The zip file is an AEM package that can be installed directly. js initializes and exports the AEM Headless Client used to communicate with AEM; src/api/usePersistedQueries. An end-to-end tutorial illustrating how to build-out and expose content using AEM’s GraphQL APIs and consumed by an external app, in a headless CMS scenario. Learn how AEM can go beyond a pure headless use case, with options for in-context authoring and experience management. AEM GraphQL API requests. 1. AEM exposes a variety of HTTP endpoints that can be interacted with in a headless manner, from GraphQL, AEM Content Services to Assets HTTP API. This opens a side panel with several tabs that provide a developer with information about the current page. a) User logs in with username and password. Dedicated Service accounts when used with CUG should allow to. Step 1 — Setting Up GraphQL with Node. While we give a brief introduction to GraphQL, the focus of this tutorial is developing a GraphQL server in Java. An end-to-end tutorial illustrating how to build-out and expose content using AEM Headless. 2. 5 . On the Source Code tab. Querying AEM using GraphQL using persisted queries (as opposed to client-defined GraphQL queries) allows developers to persist a query (but not its results) in AEM, and then request the query to be executed by name. I was wondering if I will need to place the authentication logic/function. Authentication is an essential part of most applications. 5 Serve pack 13. Next, explore the power of AEM’s GraphQL API using the built-in GraphiQL IDE. 5 Using basic authentication and postman I am able to run all the requests GET,POST,PUT,DELETE on AEM. Open the Program containing the AEM as a Cloud Service environment to integrate set up the Service Credentials for. In this chapter, you use the GraphiQL Explorer to define more advanced queries to gather data of the. In this example, we’re restricting the content type to only images. This document is part of a multi-part tutorial. 2. Adobe Experience Manager as a Cloud Service’s Cross-Origin Resource Sharing (CORS) facilitates non-AEM web properties to make browser-based client-side calls to AEM’s GraphQL APIs, and other AEM Headless resources. AEM Headless single-page app (SPA) deployments involve JavaScript-based applications built using frameworks such as React or Vue, that consume and interact with content in AEM in a headless manner. Headless implementations enable delivery of experiences across platforms and channels at scale. There are three functions currently defined in Weaviate's GraphQL: Get{}, Aggregate{} and Explore{}. The WKND client application connects to AEM publish service, so it is important that you published the following to the AEM publish service. See Authentication for Remote AEM GraphQL Queries on Content. The React app should contain one. This document is part of a multi-part tutorial. Learn how to create, update, and execute GraphQL queries. After receiving and verifying the request, our custom authenticator would then forward the token to a web service endpoint where it will be confirmed, and then user details will be returned upon success. Previous page. Tap Get Local Development Token button. Create a user model class named User to store the login credentials of the user. Specify a secret key in the appsettings. Please ensure that the previous chapters have been completed before proceeding with this chapter. Your GraphQL API probably needs to control which users can see and interact with the various data it provides. Example: if one sets up CUG, the results returned will be based on user's session. 1. c) If successful, the server returns a JSON Web Token (JWT) that is a Base64 encoded token with an expiration date. With GraphQL, you model your business domain as a graph by defining a schema; within your schema, you define different types of nodes and how they connect/relate to one another. On February 25, 2022, GitLab for CVE-2021-4191, which is an instance of CWE-359, "Exposure of Private Personal Information to an Unauthorized Actor. AEM Local Development Access Tokens are used to accelerate the development of integrations with AEM as a Cloud Service that programmatically interacts with AEM Author or Publish services over HTTP. For authentication, the third-party service needs to authenticate, using the AEM account username and password. Build a React JS app using GraphQL in a pure headless scenario. 5. Once we have the Content Fragment data, we’ll integrate it into your React app. 0 specification, and it is responsible for validating authorization grants and issuing the access tokens that give the app access to the user's data on the resource server. Author in-context a portion of a remotely hosted React. This is your 24 hour, developer access token to the AEM as a Cloud Service environment. 5 . LearnUse AEM GraphQL pre-caching. Authentication and Authorization would be dependent on the backend framework. Adobe Experience Manager as a Cloud Service’s Cross-Origin Resource Sharing (CORS) facilitates non-AEM web properties to make browser-based client-side calls to AEM’s GraphQL APIs, and other AEM Headless resources. Learn how AEM automatically generates a GraphQL schema based on a Content Fragment model. Authentication Apollo Graphql for android. Search for “GraphiQL” (be sure to include the i in GraphiQL ). For each type that you want to expose. Rest APIs require the client to send multiple requests to different endpoints on the API to query data from the backend database. In the basic tutorial multi-step GraphQL tutorial, you used the GraphiQL Explorer to test and refine the GraphQL queries. 7 - GraphQL Persisted Queries; Basic Tutorial. Authorization server: The authorization server is implemented in compliance with the OAuth 2. js file. In AEM 6. Click into the corresponding link below to for details on how to set up and use the authentication approach. The GraphQL endpoints are publicly accessible, but the content that they return depends on user's access. Tap the Technical Accounts tab. Project Configurations; GraphQL endpoints; Content Fragment. Allow applications and middleware to. Experience LeagueInstall the AEM SDK, add sample content and deploy an application that consumes content from AEM using its GraphQL APIs. The WKND client application connects to AEM publish service, so it is important that you published the following to the AEM publish service. Select Add private key from DER file, and add the private key and chain file to AEM: Yes, since few days I am going through this article, in this article Albin has explained through basic authentication only, token based may be supporting in AEMAaCS not sure if it is there in AEM6. The GraphQL API in AEM allows you to expose Content Fragment data to downstream applications. 1. If no JWT is present for a client request, this context value is the empty tuple, (). Available for use by all sites. Prerequisites. json. adobe. This is a good. This is the same framework used to translate other AEM content, such as Pages, Experience Fragments, Assets, and Forms. g. Step 1: Adding Apollo GraphQL to a Next. Tap the ellipsis next to the environment in the Environments section, and select Developer Console. Authentication options. The advanced tutorial illustrates in-depth aspects of working with Content Fragment Models, Content Fragments, and the AEM GraphQL persisted queries, including using the GraphQL persisted queries in a client application. And some sample GraphQL queries, based on the sample content fragment structure (Content Fragment Models and related Content Fragments). This Next. AEM has a large list of available content types and you’re able to select zero or more. js app. Send GraphQL queries using the GraphiQL IDE. Developer.