Configuration requise

Connaissances préalables

  • Compréhension d'AEM Mobile
  • Maîtrise du processus de création et de publication de contenu via le portail à la demande
  • Maîtrise d'Apache Cordova (http://cordova.apache.org)

Produits requis

  • AEM Mobile

Extensibilité Cordova

Experience Manager Mobile Runtime permet aux utilisateurs de créer des applications optimisées avec l'extensibilité Apache Cordova et des outils de développement (bêta) à des fins de test.

L'extensibilité Cordova, disponible dans les articles HTML et les incrustations web dans les articles basés sur InDesign, permet d'accéder aux fonctionnalités suivantes :

  • Plug-ins Cordova de base : tirez parti des plug-ins Cordova de base, tels que l'appareil photo, les contacts, la géolocalisation et le partage de fichiers.
  • Plug-ins Cordova personnalisés : utilisez les plug-ins fournis par la communauté Cordova/Phonegap ou créez vos propres plug-ins. Exemples : numérisation du code à barres et des bases de données mobiles.
  • Plug-ins spécifiques à AEM Mobile activés via Cordova : plug-ins pour les métadonnées d'application locale et de contenu.

 

Plug-ins Cordova

L'ensemble de plug-ins Cordova de base permet d'accéder à des fonctionnalités natives de périphérique au sein des vues de contenu AEM Mobile à l'aide de JavaScript. Les plug-ins peuvent être activés ou désactivés suivant les applications lors de la création de celles-ci.

Les plug-ins Cordova de base suivants sont disponibles :

  • Appareil photo - Pour la prise de photos et le choix d'images dans la bibliothèque des images du système.
  • Contacts – Fournit un accès à la base de données des contacts de l'appareil. Pour les applications Windows, la seule API du plug-in prise en charge est « pickContact ».
  • Informations sur l'appareil – Décrit le matériel et les logiciels de l'appareil.
  • Mouvement de l'appareil (accéléromètre) – Fournit un accès au capteur de mouvements qui détecte les mouvements relatifs par rapport à l'orientation actuelle de l'appareil, en trois dimensions avec les axes x, y et z.
  • Orientation de l'appareil (compas) – Capteur détectant la direction ou le sens vers lequel est pointé l'appareil, généralement à partir de la partie supérieure de celui-ci.
  • Accès aux fichiers – Fournit un accès en lecture/écriture aux fichiers résidant sur l'appareil.
  • Transfert de fichier – Permet de charger et télécharger des fichiers.
  • Emplacement géographique – Fournit des informations GPS sur l'emplacement de l'appareil, telles que la latitude et la longitude.
  • Globalisation – Utilise des opérations spécifiques aux paramètres régionaux, à la langue et au fuseau horaire de l'utilisateur.
  • Médias (médias de plug-in Cordova) – Permet d'enregistrer et de lire des fichiers audio sur un appareil.
  • Capture de médias – Fournit un accès aux fonctionnalités de capture audio, vidéo et d'images de l'appareil.
  • Informations sur le réseau – Informations sur la connexion cellulaire et Wi-Fi de l'appareil, et si l'appareil a une connexion Internet.
  • Boîtes de dialogue de notification – Fournit un accès à des éléments natifs de l'interface utilisateur des boîtes de dialogue, tels qu'une alerte et un signal sonore.
  • Vibration (iOS, Android uniquement) – Moyen de faire vibrer l'appareil.
  • WKWebView (iOS uniquement) – Vous pouvez activer le plug-in WKWebView afin d'afficher les fichiers HTML comme ils s'affichent dans Safari mobile. Cette option utilise WKWebView (WebKit) au lieu d'UIWebView pour les articles HTML et les incrustations web sur les appareils iOS 9. Une application s'exécutant sur les appareils iOS 8 affiche toujours le contenu à l'aide d'UIWebView. (Reportez-vous à la page Création d'applications iOS pour AEM Mobile.)

Pour plus d'informations, reportez-vous à la page Plug-ins Cordova de base.

Pour des exemples, reportez-vous à la page Download examples from Github (Téléchargement d'exemples de Github) (en anglais).

Plug-ins Cordova personnalisés

Avec la possibilité d'ajouter des plug-ins Cordova personnalisés à une application AEM Mobile, vous pouvez créer un contenu qui utilise les différents plug-ins fournis par la communauté de Cordova/PhoneGap ou vous pouvez créer vos propres plug-ins personnalisés. Vous pouvez, par exemple, activer la numérisation du code à barres mobile, accéder aux données Geofence et utiliser des bases de données mobiles dans votre application.

Le flux de travaux pour la création d'applications utilisant des plug-ins Cordova personnalisés est différent de la méthode standard pour la création d'applications. Utilisez AEM Mobile Developer Tool pour indiquer les plug-ins Cordova que vous envisagez d'utiliser. Pour les applications iOS, utilisez l'outil de développement pour modifier le ficher .ipa que vous avez téléchargé. Pour les applications Android, utilisez l'outil de développement pour créer un fichier .apk, que vous chargerez ensuite en utilisant le nouvel onglet Shell personnalisé de l'application qui s'affiche lors de la création ou de la modification d'une application Android.

Voir https://cordova.apache.org/plugins/

 

Remarque :

actuellement, les plug-ins Cordova sont limités au niveau de l'article. Un article doit être ouvert pour que l'application AEM Mobile utilise le plug-in. Pour les appareils iOS, notez que si un article est le premier élément dans votre collection globale, cet article est chargée lorsque l'application est lancée et est conservé en mémoire. Cet article peut continuer à s'exécuter et faire les mêmes appels du plug-in Cordova après que l'utilisateur accède à un autre contenu. Toutefois, les plug-ins de cet article de niveau supérieur ne sont pas disponibles pour être référencés par d'autres articles.

 

Plug-ins Cordova spécifiques à AEM Mobile

Les plug-ins activés pour Cordova spécifiques à AEM Mobile sont un ensemble d'API JavaScript proposant un accès à des données spécifiques liées à l'application AEM Mobile Runtime et à son contenu depuis l'affichage du contenu de l'article. Pour utiliser les plug-ins Cordova pour AEM Mobile, l'extensibilité doit être activée pour le contenu, l'option « Activer les fonctionnalités d'extensibilité » étant sélectionnée dans les propriétés de l'article. Ces plug-ins sont automatiquement activés dans les applications AEM Mobile.

Les plug-ins Cordova spécifiques à AEM Mobile comportent notamment les API suivantes :

  • Accès aux métadonnées d'entité (titre du contenu, droits)
  • Informations sur l'appareil (plate-forme, version, identifiants)
  • Informations de notification Push (jeton Push)
  • Vignettes (image d'arrière-plan et de partage sur les réseaux sociaux)

Pour une documentation détaillée, reportez-vous à la page Utilisation des plug-ins activés pour Cordova spécifiques à AEM Mobile.

Exemples de plug-ins Cordova

Activer les fonctionnalités d'extensibilité dans l'application

  1. Créez un contenu HTML source pour l'affichage du contenu ou l'incrustation web référençant les interfaces Cordova API.

    Si le code HTML référence les plug-ins Cordova de base ou les plug-ins activés pour Cordova spécifiques à AEM Mobile, ajoutez la ligne suivante :

    <script type="text/javascript" src="cordova.js"></script>

    Le fichier cordova.js est automatiquement inclus dans votre application ; vous devez simplement le charger lors de l'exécution.

    Les plug-ins Cordova et les plug-ins Cordova spécifiques à AEM Mobile nécessitent que Cordova soit entièrement chargé avant de pouvoir être utilisés en toute sécurité. Dans le cas contraire, un script appelant une interface Cordova API donnée peut échouer, Cordova n'étant pas encore chargé.

    Lorsque Cordova est prêt, il déclenche un événement deviceready que vous pouvez utiliser pour déterminer quand commencer votre code.

    Incluez le code suivant dans votre fichier HTML :

    document.addEventListener("deviceready", function() {
        // Cordova is now ready,
        // start initializing the rest of the code
    }, false);

    Pour plus d'informations, reportez-vous à la page Événements Cordova.

  2. Pour chaque contenu utilisant ces plug-ins, sélectionnez « Activer les fonctionnalités d'extensibilité » dans les propriétés du contenu. (Modifiez les propriétés du contenu dans la section Contenu et mises en page du portail à la demande.)

    Vous pouvez également activer les fonctionnalités d'extensibilité pour les articles via l'interface On-Demand Services API. Lors de la création ou la mise à jour des métadonnées de l'entité de l'article, définissez le paramètre isTrustedContent avec la valeur Vrai (booléenne). Par défaut, ce paramètre a la valeur Faux.

    Par défaut, le paramètre « Activer les fonctionnalités d'extensibilité » est désactivé pour tous les articles. Vous pouvez modifier la valeur par défaut dans les paramètres du projet.

  3. Pour une application faisant appel à des plug-ins Cordova de base (non personnalisés), créez une application qui autorise les plug-ins Cordova. (Pour les plug-ins Cordova personnalisés, suivez les étapes décrites dans la section suivante.)

    Utilisez l'onglet Plug-ins lors de la création d'une application afin d'activer les API que vous utiliserez dans vos contenus.

    L'activation des plug-ins n'est pas requise pour les plug-ins activés pour Cordova spécifiques à AEM Mobile.

    Plug-ins pour application iOS

    Remarque :

    pour de meilleurs résultats, sélectionnez uniquement les plug-ins Cordova que vous prévoyez d'utiliser.

  4. Testez l'application.

Flux de travaux pour la création d'applications utilisant des plug-ins Cordova personnalisés

Si vous utilisez des plug-ins Cordova personnalisés dans votre application, vous devez utiliser AEM Mobile Developer Tool pour spécifier les plug-ins Cordova que vous utilisez. Utilisez l'outil de développement web pour modifier le fichier .ipa (iOS) ou créer un shell d'application .apk (Android) que vous pouvez charger lors de la création de votre application Android.

Ces étapes ne sont nécessaires que si vous souhaitez utiliser les plug-ins Cordova personnalisés dans votre application. Utilisez l'outil de développement pour indiquer tous les plug-ins (personnalisés, de base et spécifiques à AEM Mobile) utilisés dans votre application. Lorsque vous utilisez l'outil de développement pour modifier ou créer une application, tous les paramètres indiqués sur l'onglet « Plug-ins » lors de la création de l'application sont ignorés. Utilisez l'outil de développement pour indiquer toutes les informations sur les plug-ins Cordova.

Vidéo sur les plug-ins Cordova personnalisés

Vidéo sur les plug-ins Cordova personnalisés

Flux de travaux iOS pour les applications utilisant des plug-ins Cordova personnalisés

  1. Créez un contenu qui utilise des plug-ins Cordova. Suivez les étapes décrites dans la section « Activer les fonctionnalités d'extensibilité dans l'application » afin d'autoriser l'extensibilité dans chaque article utilisant des plug-ins Cordova.

  2. Dans le portail à la demande, créez une application iOS et téléchargez le fichier .ipa. (Reportez-vous à la page Création d'applications iOS pour AEM Mobile.)

  3. Utilisez AEM Mobile Developer Tool pour configurer un projet, testez votre contenu et identifiez les plug-ins Cordova utilisés dans l'application. Utilisez l'outil de développement pour modifier le fichier .ipa téléchargé afin qu'il comporte les informations Cordova que vous avez indiquées.

    Pour plus d'informations, reportez-vous à la section ci-dessous concernant l'utilisation d'AEM Mobile Developer Tool.

  4. Signez le fichier .ipa modifié.

Flux de travaux Android pour les applications utilisant des plug-ins Cordova personnalisés

  1. Créez un contenu qui utilise des plug-ins Cordova. Suivez les étapes décrites dans la section « Activer les fonctionnalités d'extensibilité dans l'application » afin d'autoriser l'extensibilité dans chaque article utilisant des plug-ins Cordova.

  2. Utilisez AEM Mobile Developer Tool pour configurer un projet, testez votre contenu et identifiez les plug-ins Cordova que vous prévoyez d'utiliser dans votre application. Utilisez l'outil de développement pour créer un shell d'application (fichier .ipa) comportant les informations Cordova que vous avez indiquées.

    Pour plus d'informations, reportez-vous à la section ci-dessous concernant l'utilisation d'AEM Mobile Developer Tool.

  3. Dans le portail à la demande, créez une application Android. Sur l'onglet « Shell personnalisé de l'application », indiquez le fichier .apk que vous avez créé à l'aide de l'outil de développement.

  4. Dans le portail à la demande, téléchargez et signez le fichier .apk.

Utilisation d'AEM Mobile Developer Tool

AEM Mobile Developer Tool est un utilitaire de ligne de commande simplifiant le flux de travaux de développement. Cet outil est installé sur l'ordinateur local d'un développeur et offre les fonctionnalités suivantes :

  • Création de projets : crée une structure de dossiers de projet AEM Mobile prête pour le développement local. Cette structure du projet est utilisée uniquement à des fins de test.
  • Création de contenus : crée un modèle de contenu AEM Mobile capable d'utiliser les interfaces Cordova API et d'exécution disponibles.
  • Ajout de plug-ins Cordova et création d'une application : si vous utilisez les plug-ins Cordova personnalisés dans votre application, utilisez l'outil de développement pour spécifier les plug-ins et créez un shell d'application (Android) ou modifiez un fichier (iOS) comportant les plug-ins Cordova que vous spécifiez.
  • Exécution sur simulateur : (1) lance le simulateur ; (2) installe le simulateur ; et (3) démarre le simulateur AEM Mobile Runtime afin d'afficher le contenu local depuis l'environnement local. Si le simulateur cible est lancé, l'étape 1 est ignorée ; si le simulateur est installé, l'étape 2 est ignorée.
  • Aide : affiche l'aide pour les commandes de ligne de commande.

Structure de commande AEM Mobile

AEM Mobile Developer Tool est requis pour deux flux de travaux principaux :

  • Développement et test de contenu utilisant des plug-ins Cordova.
  • Création d'applications comportant des plug-ins Cordova personnalisés.

 

Contrat de licence

Remarque :

en installant les logiciels suivants, vous reconnaissez avoir lu et accepter les conditions énoncées dans le document Conditions d'utilisation d’Adobe.com.

Installation des dépendances

Vous devez installer les dépendances requises suivant le système d'exploitation :

  • Mac OS X :
    • Node JS (actuel recommandé ; v6.2.2 ou version ultérieure requise)
    • Pour le développement sous iOS, XCode (v7.0 ou version ultérieure)
    • Pour le développement sous Android, Java (suivant la version OS X)
  • Windows :

 

Installation de l'outil de ligne de commande AEM Mobile (Mac OS)

Lors du développement sous Windows, veuillez exécuter toutes les commandes dans PowerShell au lieu de l'invite de commande.

  1. Lancez l'utilitaire Terminal.

  2. Pour installer l'outil de ligne de commande AEM Mobile via Node.js, exécutez la commande suivante :

    npm install -g aemm

    Si un message de refus d'autorisation s'affiche, essayez d'exécuter le script ci-dessus avec « sudo ».

    sudo npm install -g aemm

    Une fois l'opération terminée, un lien symbolique est créé afin que vous puissiez exécuter l'utilitaire de ligne de commande AEM Mobile (aemm) dans n'importe quel répertoire de l'utilitaire Terminal.

Mise à jour de l'outil de développement

Réexécutez npm install -g aemm (ou sudo npm install -g aemm) lorsqu'une version mise à jour d'AEM Mobile Developer Tool devient disponible.

Configuration de l'environnement pour Android

Pour émuler la version Android, vous devez installer le SDK Android requis et configurer l'environnement pour l'exécution de l'émulateur Android.

  1. Depuis l'utilitaire Terminal, exécutez la commande suivante afin d'installer le SDK requis, ainsi que les configurations :

    aemm platform install android
  2. Vous pouvez être invité à accepter l'accord de licence SDK pour Android. Saisissez O pour accepter le contrat de licence ou N pour le refuser. Si vous refusez, vous ne pouvez pas installer les SDK requis ni exécuter l'émulateur Android.

La configuration de l'environnement pour iOS (sudo aemm platform install ios) n'est requise que pour la création d'applications utilisant des plug-ins Cordova personnalisés.

Installation du simulateur

L'outil de ligne de commande AEM Mobile requiert que le simulateur AEM Mobile Runtime soit installé et s'exécute lors de la création du projet. Ce processus est requis pour le test de contenu HTML utilisant le simulateur. Il n'est pas requis pour la création d'applications avec des plug-ins Cordova personnalisés.

Pour installer le simulateur AEM Mobile Runtime, procédez de l'une des manières suivantes :

  1. Depuis l'utilitaire Terminal, exécutez la commande suivante pour installer la dernière version du simulateur :

    aemm app install <platform>

    Le champ <platform> peut prendre les valeurs suivantes : ios, android

Vous pouvez également spécifier la version du simulateur. Cela vous permet d'installer une version antérieure à partir de la liste des versions disponibles du simulateur.

  1. Depuis l'utilitaire Terminal, obtenez la liste des versions de simulateur disponibles :

    aemm app install --list
  2. Spécifiez la version du simulateur dans le processus d'installation :

    aemm app install <platform> <simulator-version>

    Par exemple, pour installer la version 2016.4 du simulateur sur iOS :

    aemm app install ios 2016.4

    Remarque :

    si vous recevez un message d'erreur lorsque vous essayez d'exécuter le simulateur, lancez XCode et signez le contrat de licence, le cas échéant. Vous pouvez également saisir sudo xcodebuild –license accept dans l'utilitaire Terminal.

     

Création d’un projet

L'outil de ligne de commande AEM Mobile comporte la structure de répertoire requise pour créer et tester le projet. Vous utilisez ce projet uniquement à des fins de test. Après avoir testé le contenu, vous pouvez l'ajouter à votre projet dans le portail à la demande.

Pour configurer la structure de ce projet :

  1. Dans l'utilitaire Terminal, accédez au dossier dans lequel vous voulez gérer le nouveau projet.
  2. Créez la structure de répertoire (remplacez « <project name> » par votre nom du projet :
aemm project create <project-name>

Le répertoire comportant le projet <project-name> spécifique est créé, contenant un exemple de répertoire de contenu témoin intitulé « SampleArticle ».

Exécution du simulateur

Le répertoire du projet étant créé, vous pouvez commencer à créer l'application. Ce processus est requis pour le test de contenu HTML utilisant le simulateur. Il n'est pas requis pour la création d'applications avec des plug-ins Cordova personnalisés.

Pour ouvrir le simulateur (s'il n'est pas déjà ouvert), installez le simulateur AEM Mobile Runtime (s'il ne l'est pas déjà) et lancez-le ; procédez comme suit :

  1. Dans l'utilitaire Terminal, accédez au répertoire du projet créé à l'aide de la commande suivante :

    cd <drag and drop the project-name directory>
  2. (Facultatif) Définissez l'orientation par défaut suivant laquelle l'émulateur/simulateur sera lancé. Les options sont les modes paysage ou portrait.

    aemm config --set screenOrientation <<orientation>>

    Par exemple, pour spécifier l'orientation Paysage :

    aemm config --set screenOrientation landscape

    L'orientation actuelle par défaut, si disponible, est remplacée. Pour connaître l'orientation actuelle par défaut :

    aemm config --get screenOrientation

    Pour supprimer l'orientation actuelle par défaut :

    aemm config --unset screenOrientation
  3. Ouvrez, installez et lancez le simulateur.

    aemm run <platform>

    Le champ <platform> peut prendre les valeurs suivantes : ios, android

  4. La commande d'exécution écoute toujours le terminal ; pour l'arrêter, utilisez la combinaison de touches suivantes dans la même fenêtre de terminal : Ctrl + C

Lorsque l'application du simulateur est lancée, vous devez pouvoir voir l'exemple « SampleArticle » créé. Toutes les modifications apportées aux fichiers dans le répertoire « SampleArticle » actualisent le simulateur et les contenus mis à jour sont automatiquement affichés.

Lors de l'exécution du simulateur, appuyez sur les touches Commande+ Maj+H pour revenir sur l'écran d'accueil.

Vous pouvez spécifier le périphérique de simulation à utiliser en indiquant le nom du périphérique. Cela peut être très utile pour le test sur un périphérique de simulation différent.

  1. Obtenez la liste des simulateurs disponibles actuellement installés sur le système :

    aemm run <platform> --list
  2. Dans la liste <uuid><device-name>, indiquez le périphérique :

    aemm run <platform> --target "<device-name>"

    Par exemple, pour exécuter le simulateur sur iPhone 6s sous iOS 9.2 :

    aemm run ios --target "iPhone-6s, 9.2"

Création de contenu

Le projet crée un modèle de contenu HTML par défaut, mais vous pouvez en ajouter d'autres à la liste en procédant comme suit :

  1. Dans l'utilitaire Terminal, accédez au répertoire du projet créé :

     cd <drag and drop the project-name directory>
  2. Créez des contenus HTML supplémentaires :

    aemm article create <article-name>

    Un autre répertoire de contenu HTML portant le nom <article-name> est créé dans le répertoire du projet.

    La structure des dossiers de contenu HTML est simplement un répertoire avec index.html et toutes les ressources nécessaires (CSS/JS/images/etc.) mises en correspondance dans index.html. Vous pouvez également simplement créer un dossier dans <project-name directory>/www/<custom-folder> et inclure index.html plutôt que d'exécuter le script ci-dessus. Cela peut être utile si vous disposez déjà de contenus HTML préparés dans un autre répertoire et voulez tester l'extensibilité Cordova. Vous pouvez glisser et déposer le contenu HTML dans le dossier <project-name directory>/www/ ; le simulateur le reconnaîtra.

Ajout de plug-ins Cordova au projet (pour les plug-ins Cordova personnalisés)

Ces commandes ne sont requises que si vous souhaitez utiliser les plug-ins Cordova personnalisés dans votre application. Si vous utilisez des plug-ins Cordova personnalisés, utilisez AEM Mobile Developer Tool pour spécifier les plug-ins Cordova (personnalisés, de base et spécifiques à AEM Mobile) que vous utilisez dans votre application.

  1. Assurez-vous que Node JS v6.2.2 ou version ultérieure est installé.

    Si vous avez déjà installé une version de LTE, nous vous recommandons de télécharger et d'installer la version actuelle.

  2. Dans l'utilitaire Terminal, accédez au répertoire du projet créé :

    cd <drag and drop the project-name directory>
  3. Ajoutez les plug-ins Cordova (personnalisés et de base) que vous souhaitez inclure dans votre application :

    aemm plugin add [plugin_0] [plugin_1] [...]

    Pour activer les plug-ins Cordova standard utilisés dans les applications AEM Mobile :

    aemm plugin add aemm-plugin-application aemm-plugin-user aemm-plugin-context aemm-plugin-device aemm-plugin-inappbrowser aemm-plugin-fullscreen-video aemm-plugin-navto aemm-plugin-html-contract

    Pour modifier la valeur par défaut de UIWebView en WKWebView (ce qui correspond à la sélection de « WKWebView » sur l'onglet Plug-ins) :

    aemm plugin add https://github.com/adobe-marketing-cloud-mobile/cordova-plugin-wkwebview-engine.git#2.0.0

    La version 2.0.0 est actuellement utilisée, mais cela peut faire l'objet d'une mise à jour. Vous trouverez la dernière version à utiliser à l'adresse suivante : https://github.com/adobe-marketing-cloud-mobile/cordova-plugin-wkwebview-engine/releases

    Pour activer tous les plug-ins Cordova de base utilisées dans les applications AEM Mobile (supprimez ceux que vous ne voulez pas utiliser) :

    aemm plugin add cordova-plugin-camera cordova-plugin-compat cordova-plugin-contacts cordova-plugin-device cordova-plugin-device-motion cordova-plugin-device-orientation cordova-plugin-dialogs cordova-plugin-file cordova-plugin-file-transfer cordova-plugin-geolocation cordova-plugin-globalization cordova-plugin-media cordova-plugin-media-capture cordova-plugin-network-information cordova-plugin-vibration

    Utilisez la commande suivante pour afficher la liste des plug-ins ajoutés au projet :

    aemm plugin list

    Utilisez la commande suivante pour supprimer les plug-ins ajoutés précédemment :

    aemm plugin remove [plugin]

    Utilisez la commande d'aide pour afficher des informations supplémentaires :

    aemm plugin help

Création d'une application personnalisée (pour les plug-ins Cordova personnalisés)

Ces commandes ne sont requises que si vous souhaitez utiliser les plug-ins Cordova personnalisés dans votre application.  

Pour les applications iOS, vous devez modifier le fichier .ipa que vous avez téléchargé dans la section Applications du portail à la demande.

Pour les applications Android, vous devez créer un fichier .apk de shell d'application que vous chargerez lors de la création de l'application dans le portail à la demande.

Notez que les paramètres que vous avez ajoutés à la section « Plug-ins » lors de la création d'une application sont ignorés et remplacés par les paramètres spécifiés à l'aide d'AEM Mobile Developer Tool.

Remarque :

la commande « aemm » a été créée sur la commande « cordova » et délègue de nombreuses commandes à cordova-lib. Il est possible que vous rencontriez des erreurs qui vous recommandent d'exécuter une commande cordova. Dans la plupart des cas, essayez d'abord de remplacer cordova par aemm, puis exécutez l'action recommandée.

  1. (iOS) Configurez l'environnement iOS afin de permettre à XCode de créer une structure non signée.

    sudo aemm platform install ios
    aemm platform add ios
  2. Accédez au répertoire de projet créé et ajoutez les plug-ins Cordova que vous souhaitez inclure dans votre application, comme décrit dans la section précédente.

  3. Créez la structure Cordova (iOS) ou le shell d'application (Android).

    aemm build [platform]

    Exemple iOS :

    aemm build ios --device --release

    L'ajout de --device crée l'application pour des appareils iOS plutôt que pour le simulateur.

    L'ajout de --release crée une version finale plutôt que la version de diagnostic par défaut.

    Exemple Android :

    aemm build android --release

    Remarque :

    si vous ne parvenez pas à créer l'application, nous vous recommandons de désinstaller NodeJS et d'installer la version actuelle de NodeJS (reportez-vous au site NodeJS pour plus d'informations). En outre, exécutez sudo npm uninstall -g aemm, puis exécutez sudo npm install -g aemm.

    Résolution du message d'erreur de signature de code

    Si vous avez mis à jour XCode, vous pouvez recevoir le message d'erreur suivant : « Error: CODE_SIGNING_REQUIRED must be set to NO in order to build for device. You can resolve this by running 'aemm platform install ios'. »

    Si vous rencontrez ce problème, la solution est d'exécuter la commande suivante dans l'utilitaire Terminal :

     

    sudo /usr/libexec/PlistBuddy -c "Set DefaultProperties:CODE_SIGNING_REQUIRED NO" "$(xcode-select -p)/Platforms/iPhoneOS.platform/Developer/SDKs/iPhoneOS.sdk/SDKSettings.plist"

    Cette solution est requise lors de toute mise à jour de XCode.

  4. (iOS) Assemblez le fichier .ipa.

    aemm package ios --device <drag and drop .ipa file>

    Exemple :

    aemm package ios --device /Users/jdoe/Downloads/coffee_2062.ipa
  5. Effectuez l’une des actions suivantes :

    • (iOS) Signez le fichier .ipa modifié.
    • (Android) Chargez le shell d'application .apk sur le portail à la demande. Créez, téléchargez et signez le fichier .apk.

    Pour plus d'informations sur ce flux de travaux, reportez-vous à la section précédente de cet article concernant la création d'applications utilisant les plug-ins personnalisés Cordova.

Test des plug-ins Cordova personnalisés dans le simulateur

Exécutez les commandes suivantes :

aemm build ios
aemm package ios
aemm run ios

Omettez le paramètre --device afin d'appliquer la commande au simulateur. L'exécution de la commande aemm package ios est requise afin d'assembler les plug-ins personnalisés dans le simulateur. Pour rétablir la version initiale du simulateur, exécutez de nouveau la commande aemm app install ios.

Débogage à distance

Depuis le simulateur, vous pouvez contrôler le contenu HTML à distance, comme vous le feriez dans un navigateur récent. Cette fonction permet de voir et manipuler l'élément DOM, de contrôler les erreurs générées à partir de la console ou saisir directement des commandes JavaScript/jQuery, etc. Pour plus d'informations, reportez-vous aux pages suivantes :

Création d'un package de contenus

Les contenus HTML dans le répertoire du projet suivent également la structure requise pour la génération du fichier de contenu pour le portail de services à la demande AEM Mobile. Vous pouvez sélectionner tous les contenus HTML dans le répertoire du projet et les déposer dans AEM Mobile Packager.

Pour plus d'informations, reportez-vous à la page Création d'articles HTML pour AEM Mobile.

Ce produit est distribué sous licence Creative Commons Attribution - Pas d’utilisation commerciale - Partage à l’identique 3.0 non transposé  Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.

Mentions légales   |   Politique de confidentialité en ligne