Intégrer la sélection de destinations et de chargements du gestionnaire d’accès AEM dans une application Angular
Cet article explique comment intégrer des fonctions de chargement et de sélection de destination du gestionnaire d’accès AEM dans une application Angular à l’aide de modules UMD. Il explique également comment réutiliser l’authentification IMS et fournir une sélection de dossiers de destination. Pour résoudre ce problème, utilisez l’exportation UMD du lot de chargement de ressources, transmettez le jeton d’accès IMS au MFE de chargement et indiquez le chemin d’accès au dossier sélectionné via targetUploadPath.
Description description
Environnement
- Adobe Experience Manager as a Cloud Service
- Adobe Experience Manager Assets avec gestionnaire de contenu
- Application Angular personnalisée utilisant des modules UMD
Symptômes
- Le package
@assets/uploadn’est pas disponible dans le registre npm public. - L’intégration nécessite la réutilisation d’une session d’authentification IMS.
- L’intégration nécessite une logique personnalisée pour sélectionner le dossier de destination.
Résolution resolution
Pour intégrer le chargement du gestionnaire d’accès et la sélection de destination dans votre application Angular, procédez comme suit :
-
Utilisez l’exportation UMD du lot
assets-uploaddans votre application Angular, car le package@assets/uploadn’est pas disponible dans le registre npm public. -
Réutilisez la session d’authentification IMS à partir de l’intégration du gestionnaire d’accès UMD PureJSSelectors :
- Utilisez
PureJSSelectors.registerContentAdvisorAuthServiceavec le rappelonAccessTokenReceivedpour obtenir le jeton d’accès. - Transmettez le jeton obtenu à la prop
apiTokendu MFE de téléchargement.
- Utilisez
-
Implémentez la sélection du dossier de destination :
- Fournissez la
targetUploadPathcar le composantAllInOneUploadne fournit pas d’interface utilisateur pour sélectionner le dossier de destination. - Utilisez le MFE DestinationSelector pour permettre aux utilisateurs de sélectionner le dossier de destination.
- Utilisez l’exportation
PureJSSelectors.renderDestinationSelectorWithAuthFlowpour effectuer le rendu de DestinationSelector avec son flux d’authentification. - Une fois que l’utilisateur a sélectionné un dossier, transmettez le chemin d’accès sélectionné au MFE de téléchargement en tant que
targetUploadPath.
- Fournissez la
-
Après avoir implémenté l’intégration, vérifiez les points suivants :
- L’interface utilisateur de chargement s’affiche dans l’application Angular.
- La session d’authentification IMS est réutilisée.
- Les chargements réussissent dans le dossier de destination sélectionné.
Remarque : reportez-vous au référentiel d’exemples Adobe officiel pour un exemple Angular complet illustrant l’intégration du module UMD.
Lecture connexe
- Personnaliser le gestionnaire d’accès
- Propriétés du gestionnaire d’accès
- Sélecteur de destination pour AEM as a Cloud Service
- Charger des fichiers et des dossiers dans le sélecteur de ressources
- Utilisez le gestionnaire de contenu pour accéder au contenu d’AEM dans les applications Adobe et non Adobe