Fermer

juin 26, 2021

AEM Content Services : Utilisation des API Sling et Node pour fournir des collections d'actifs – Partie 1


AEM est un framework éprouvé pour la livraison d'applications. Les fonctionnalités de création intuitives et les vues de contenu pilotées par HTL (anciennement Sightly) facilitent la création de pages servies à partir d'un environnement AEM. La stratégie de composants standard est excellente, mais AEM offre plus de flexibilité dans la façon dont vous utilisez le contenu créé. AEM Content Services permet de consommer du contenu créé via une approche CMS sans tête.

Les fragments de contenu offrent des morceaux de texte et/ou de balisage discrets, et l'API Assets fournit des références à vos actifs (y compris des fragments de contenu), tous pouvant être utilisés par des applications externes au format JSON.

Dans un DAM mature, vous constaterez que vous avez des images et des fragments qui conviennent à une exposition externe et d'autres qui ne le sont pas. AEM fournit des Asset Collections pour exposer des actifs spécifiques et organiser ces actifs de manière simplifiée. Vous pouvez ajouter des ressources ou des fragments à une collection depuis n'importe où dans le DAM et afficher facilement tous les éléments qu'elle contient.

Pour fournir ces collections dans le cadre de votre solution CMS sans tête, vous devez pouvoir les afficher dans la réponse JSON fournie par le servlet Sling GET. L'implémentation des fragments prêts à l'emploi vous permet d'utiliser des références de contenu, mais cela ne sert qu'une référence à la collection, il ne fournit pas le contenu à l'intérieur. En utilisant le modèle familier de Sling + le modèle de composant HTL, le code ici permet d'accéder aux éléments d'une collection :

https://github.com/PRFTAdobe/AEM-Tutorials/blob/a7dda966be3843e9220d7b005ab3b307f7d51190/sample/core/ src/main/java/com/sample/core/models/IncludeCollectionsModel.java

 

Il y a quelques points à noter ici, car il s'agit d'un modèle Sling, vous avez accès aux propriétés de dialogue configurées via l'annotation ValueMapValue. Via l'annotation Source, vous avez accès à un résolveur de ressources qui est géré par Sling.

La méthode clé dans cette classe est setCollectionProperties(). Cela écrit le contenu de la ou des collections sélectionnées en tant que propriétés du nœud d'instance de composant.

Consumer Markets - Keeping Up with Connected Customers

 

Invoquez le modèle ci-dessus dans votre modèle HTL via :


    ${addcollections .setCollectionProperties}

 

La boîte de dialogue du composant a besoin de 2 champs clés, le type de contenu pour définir le type de contenu que contient la collection et le chemin d'accès au nœud JCR de la collection. Notez que le chemin du nœud de collection devra peut-être être obtenu via CRX/DE et fourni à vos auteurs. Organiser vos collections sous /content/dam/collections de manière logique et fournir une option de dialogue pour les filtrer est un exercice que je vous laisse.

Votre boîte de dialogue doit ressembler à ceci : https://github.com/PRFTAdobe/AEM-Tutorials/blob/4f3ba40b6d1fbb0125d60dc20b9a114130079c8a/sample/ui.apps/src/main/content/jcr_root/compon/sample/sample/ include-collections/_cq_dialog/.content.xml

 

Autorisez le composant (ou son nom de groupe) dans votre stratégie de modèle. Une fois ces éléments en place, vous pouvez ajouter le composant à une page et configurer sa boîte de dialogue pour utiliser la collection requise. La connaissance du but et du contenu de la collection est utile pour sélectionner le bon type de contenu. Sélectionnez images dans le champ de type de contenu pour répertorier uniquement les éléments de la collection :

Collection Source Info

 

Avec une ou plusieurs instances de ce composant configuré dans une page, demandez la page au format HTML. Cela définira les valeurs de propriété dans chaque instance de composant, pour inclure les collections/le contenu associé dans la réponse JSON pour la page.

Remarque, vous devez appeler la page au format HTML chaque fois que les collections sont mises à jour, afin d'inclure ces dernières mises à jour dans la réponse JSON. Il existe un moyen d'éviter cela et de faire en sorte que le JSON se mette automatiquement à jour chaque fois que les collections changent. Cela sera fourni dans la partie 2, alors soyez à l'affût !

 

Ensuite, vous (ou un tiers) pouvez appeler la page avec les sélecteurs et l'extension suivants : model.tidy.json. Les collections DAM sont référencées via le composant et incluses dans la représentation JSON du contenu de la page ! Une application mobile ou un autre tiers peut facilement analyser et extraire les valeurs de ces objets, pour les inclure dans une vue qu'ils contrôlent.

En utilisant cette technique, vous pouvez profiter du double avantage des fonctionnalités de création d'interface utilisateur tactile d'AEM et des fonctionnalités CMS sans tête. Cela donne le pouvoir à vos auteurs de contenu de générer du contenu utilisable dans et hors d'AEM !

 

À propos de l'auteur

J'ai des années d'expérience dans le support et le développement d'applications Web, en mettant l'accent sur AEM Framework et Java. J'aime écrire sur tout ce qui concerne AEM (Sling, OSGi, le JCR, Dispatcher, etc.).

Plus de cet auteur






Source link