Plan du site  
pixel
pixel

Articles - Étudiants SUPINFO

Publication d'une application Ionic sur Apple Store

Par Lucas MARTINI Publié le 16/07/2018 à 20:30:37 Noter cet article:
(0 votes)
Avis favorable du comité de lecture

Introduction

Cet article a été créé afin d’aider les personnes débutant en développement mobile à créer et publier leur propre application tout en étant guidé. Au sein de cet article vous ne trouverez pas une référence en la matière dans la publication d’application IOS mais plutôt un guide sur lequels vous pourrez vous appuyer pour avoir une vision plus claire et concise des différents processus à effectuer pour parvenir à la publication d’une application IOS.

Prérequis :

Afin de pouvoir suivre cet article, vous devez impérativement avoir le matériel ci-dessous :

- Etre en pocession d'un Mac

- Xcode installé sur la machine

/!\ Si ce n'est pas le cas voici ci-dessous le liens de téléchargement :

Lien : https://developer.apple.com/xcode/

- Cmder installé (optionel)

Lien : http://cmder.net/

/ ! \ : Les explications et les manipulations ci-dessous prennent en compte le fait que vous ayez déjà créé votre application ionic et que cette dernière est prête à être publiée sur le Store Apple.

Si ce n’est pas le cas je vous conseille de lire préalablement mes deux derniers articles portant sur ce sujet :

- Présentation et Utilisation de IONIC Framwork :

Lien : o https://www.supinfo.com/articles/single/6828-presentation-utilisation-ionic-framwork

- Créer une application multiplateforme avec Ionic :

Lien : o https://www.supinfo.com/articles/single/6834-creer-une-application-multiplateforme-avec-ionic

Génération du projet Xcode de votre application :

Lorsque que votre application est prête à être générée, vous devez ouvrir le cmder ou invite de commande (Terminal pour mac), vous rendre ensuite dans le dossier de votre application puis taper les commandes suivantes :

- « cordova platform add ios »

Cette commande va tout simplement vous permettre de créer la plateforme qui va accueillir votre application

- « cordova build ios »

Cette commande nous permets ensuite de générer l’application ;

PS : Vous devez absolument être sur un Mac car Windows ne possède pas d’émulateur Mac permettant de générer votre application ! Sur Windows vous pourrez uniquement créer la plateforme accueillant l’application. Pour la seconde commande un Mac est obligatoire.

Une fois ces commandes entrées, il vous suffit de vous rendre à la racine de votre projet puis dans le dossier suivant :

« platforms/ios/ »

Vous trouverez dans ce dossier un projet Xcode, il vous suffit de l’ouvrir. Une fois ouvert vous pourrez alors le tester, grâce aux nombreux émulateurs présents dans Xcode, mais l’étape suivante consiste a signé notre application.

Signature d’une application IOS :

Il faut savoir que pour toutes les applications créées et publier sur le store Apple possèdent une sorte de carte d’identité, Apple l’appel « Le Provisioning Profile » celui-ci est complémenté d’un Identifiant unique appelé « Bundle ID » ainsi que d’un certificat de distribution. La signature d’une application permet tout simplement de dévoiler votre application au grand public sans crainte qu’elle ne soit volée. Vous disposerez d’un identifiant unique et d’une signature unique vous permettant d’effectuer des mises à jour ou des modifications de votre application après qu’elle ait été mise en ligne.

Le processus va se dérouler selon les étapes suivantes :

- Création du Bundle ID, identifiant unique a votre application

- Création du Certificat, preuve que cette application vous appartient

- Génération du Provisioning Profile, descriptif et informations de votre application

- Création du Certificat P12 - Création de la fiche d’application

- Lier le « build » de l’application à la fiche de cette dernière grâce à Xcode.

Création du bundle ID :

Comme nous l’avons dit précédemment, chaque application possède un identifiant unique (Bundle ID), c’est à vous de le créer. Pour ce faire, suivez les étapes ci-dessous :

- Rendez-vous pour commencer sur l’espace développer Apple :

Lien : https://developer.apple.com

/ ! \ : Si ce n’est déjà fait, vous devez créer un compte développeur Apple afin de pouvoir publier une application.

- Vous devez ensuite cliquez sur « Account »

Connectez vous avec vos identifiants dévélopper Apple :

- Dans le menu de gauche, cliquez sur la catégorie « Certificates, IDs & Profiles »

- Dans l’onglet a gauche, sélectionnez « App IDs »

- Cliquez ensuite sur le petit plus en haut à droite de votre écran :

- Vous arrivez alors sur la fiche d’enregistrement de votre application. Il vous faut donc remplir les champs « App ID Description » qui sera simplement le nom de votre application. Ce dernier ne sera pas le nom qui apparaitra sur l’appStore, il s’agit juste d’un identifiant caché.

- Vous avez surement remarqué que le champ « App ID Prefix » aussi appelé « Team ID » contient un identifiant ? Notez le soigneusement car il risque de vous être demandé.

- Dans la Sélection « App ID Suffix » sélectionnez « Explicit App ID »

- Nous arrivons ensuite au champ Bundle ID, ce dernier sera donc l’identifiant unique de votre application. La forme conventionnelle de ce dernier est « com.[nom de votre société].[nom de votre appli] » . Cet identifiant est à garder soigneusement.

- Dans la sélection « App Services », sélectionnez « Associated Domains », vous pouvez également cocher la case « notification push » si votre application sera susceptible d’en envoyer aux utilisateurs.

- Cliquez ensuite sur « Continuer »

ATTENTION : Si vous n’avez pas encore posté d’application à partir de votre Mac actuel, vous devez obligatoirement passé par cette étape. Dans le cas contraire vous pouvez la sauter et allez a létape "Génération du certificat de Distribution ".

Si vous n'avez jamais posté d'application vous devez tout d'abord faire une demande de création de certificat CSR :

Le certification Request est une sorte d’identifiant unique présent sur votre ordinateur qui permet à ce dernier de s’identifier auprès du store Apple.

Dans un premier temps, vous devez :

- vous rendre sur « le trousseaux d’accès» de votre Mac.

- Dans le menu « Trousseaux d’accès » en haut à droite, puis cliquez sur « Préférence ».

- Une fois dans préférence, cliquez sur « Certificats »

- Une fenêtre s’ouvre à vous, désactiver les options « Protocole d’état des certificats en ligne» et « Liste des certificats révoqués », puis fermez cette fenêtre.

Une fois cette fenêtre clos, cliquez sur « Assistant de certification » puis « Demander un certificat à une autorité de certificat ».

Entrez ensuite les identifiants de votre compte Apple.

Ne prêtez pas attention à l’e-mail AC, ce dernier n’est pas requis, il s'agit d'un paramètre optionnel.

Une fois ce dernier remplis, enregistrez le sur votre ordinateur. Il faut désormais générer un certificat de distribution.

Génération du certificat de Distribution :

Pour commencer, rendez-vous sur l’espace développer Apple :

Lien : https://developer.apple.com/

- Allez dans la rubrique « Certificates, Identifier & Profiles ».

- Cliquez sur « Certificates » dans le menu de gauche puis sélectionnez « Production »

- Ajoutez un certificat en cliquant sur le petit plus en haut a droite de votre écran

- Dans la rubrique « AppbStorecetaAdzHoc » sélectionnez « Production »

- Ensuite vous n’avez plus qu’à suivre les démarches afin de générer et installer votre certificat de distribution.

Faites attention à l’endroit où vous enregistrez ce certificat car il vous sera demandé ultérieurement.

ATTENTION : Si vous n’avez pas encore posté d’application à partir de votre Mac actuel, vous devez obligatoirement passé par cette étape. Dans le cas contraire vous pouvez la sauter.

Dans le cas ou vous n'avez jamais publier d'application vous devez impérativement générer le Certificat P12 :

Le certificat vous permet de lié vos applications a votre compte développeur, c’est pour cela que lorsque que ce certificat est installé sur votre ordinateur il n’est plus nécessaire de le refaire. Cette manipulation doit etre fais qu'une fois appart si vous changez d'ordinateur.

Pour commencer rendez-vous sur l’espace développer Apple :

Liens : https://developer.apple.com/

Dans l’onglet « Certificates, Identifier et Profiles », cliquez sur « Certificat » et sélectionnez « Production ».

Vous allez alors tombez sur le certificat que vous venez de créer, téléchargez le. Une fois téléchargé, double-cliquez dessus. Une fenêtre va alors apparaitre, vous devez choisir l’option « Ajouter au trousseau de session ». Ouvrez ensuite votre application « Trousseaux d’accès ».

En bas à gauche de votre écran sélectionnez la catégorie « Certificats ».

Cherchez alors votre certificat parmi la liste qui s’affiche devant vous, une fois que vous l’avez trouvé, cliquez dessus et faite « exporter ». Enregistrez-le ensuite sur votre ordinateur, il s’agit de votre certificat P12.

Nous avons désormais terminé la création des certificats, il nous reste plus qu’à créer notre fiche d’application et d’y insérer notre build.

Création de la fiche d'application

Rendez-vous sur Itunes Connect pour créer votre fiche d'application:

Lien : https://itunesconnect.apple.com/login

Une fois que vous vous êtes authentifié, cliquez sur le plus en haut à gauche de la page.

Puis cliquez sur « Nouvelle app », la fenêtre ci-dessous apparait alors à l’écran :

Sélectionnez «application IOS »

Vous arrivez alors sur fenêtre suivante :

Entrez le nom de votre application dans le champ « Nom »

Mettez « Français » dans le champ « Langue Principale »

Dans le champ « identifiant de lot » vous devez choisir celui que vous avez précédemment créé pour cette application lors de la création du « Bundle ID ».

Dans le champ « UGS » il s’agit de rentré un identifiant unique pour votre app, il ne s’agit en aucun cas de son nom donc libre a vous de mettre ce que vous désirez.

Une fois ces champs rempli cliquez sur « créer »

Vous allez arriver sur la fiche de votre application :

A vous de remplir cette fiche avec toutes les informations de votre application ainsi qu’avec les captures d’écrans nécessaires.

/ ! \ Attention pour les captures d’écrans :

Des dimensions sont imposées pour l’importation de captures d’écrans.

La Best Practice est de prendre les captures d’écran directement à partir de Xcode en utilisant les émulateurs :

- Utilisez l’émulateur IPhone 6 S plus ou plus (pour les captures d’écrans IPhone)

- Utilisez l’émulateur IPad Pro (Pour les captures d’écrans IPad)

Joindre son build à partir de Xcode sur la fiche d’application Itunes Connect :

Pour joindre votre application sur l’iTunes connect, rien de plus simple, il vous suffit d’ouvrir votre projet Xcode que vous avez créé précédemment avec Ionic.

Une fois dans votre projet, vous devez vérifier que tout est conforme au niveau de votre « build » d’application. Il vous sera également demandé votre « Bundle Identifier » que vous aurait normalement déjà créé un peu plus tôt dans cet article. Quelques champs seront également a remplir comme la version, la signature de l’application … Une fois cette vérification effectuée et que tout est conforme vous pouvez alors débuter la démarche de mise en ligne de votre application.

Il vous faut pour cela :

- Cliquer sur l’onglet « Product »

- Puis sur « Archive »

Cette manipulation va nous permettre de créer une archive. C’est cette archive que nous allons ensuite importer sur notre iTunes connect. A la fin du processus, une fenêtre va s’ouvrir en vous proposant de d’uploader cette archive vers ITunes connect. Il est bien évident que vous accepterez et vous n’aurez plus qu’à sélectionner dans la liste s’offrant à vous l’archive correspondant à l’application que vous désirez mettre en ligne.

Une fois cette manipulation effectuer, il ne vous restera plus qu’a retourner sur l’iTunes connect, a validé tous les paramètres et les détails de votre application puis vous pourrez enfin terminer votre mise en ligne en cliquant sur le bouton « Soumettre pour validation » en haut a droite de votre écran.

Votre application sera alors vérifiée et testée par les ingénieurs d’Apple qui valideront ou non votre application dans les 48 heures suivant votre soumission.

Conclusion :

Dans cet article vous avez pu voir et comprendre les étapes nécessaires à la publication d’une application IOS faite avec le Framework multiplateformes IONIC.

Cet article est bien évidement une description générale du cheminement nécessaire à la publication d’une application IOS. Certain détail et type d’application ne correspondront pas forcément a la méthode employé tout au long de ce dernier.

Je vous laisse désormais le soin de créer vos propres applications et de les publier vous-mêmes afin de vous familiariser avec ces outils. Je vous remercie d’avoir pris le temps de lire cet article.

Si cet article vous a plus n’hésitez pas à lire mes autres articles en suivant le lien ci-dessous :

https://www.supinfo.com/articles/author/171562-lucas-martini

A propos de SUPINFO | Contacts & adresses | Enseigner à SUPINFO | Presse | Conditions d'utilisation & Copyright | Respect de la vie privée | Investir
Logo de la société Cisco, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société IBM, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Sun-Oracle, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Apple, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Sybase, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Novell, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Intel, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Accenture, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société SAP, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Prometric, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo de la société Toeic, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management Logo du IT Academy Program par Microsoft, partenaire pédagogique de SUPINFO, la Grande École de l'informatique, du numérique et du management

SUPINFO International University
Ecole d'Informatique - IT School
École Supérieure d'Informatique de Paris, leader en France
La Grande Ecole de l'informatique, du numérique et du management
Fondée en 1965, reconnue par l'État. Titre Bac+5 certifié au niveau I.
SUPINFO International University is globally operated by EDUCINVEST Belgium - Avenue Louise, 534 - 1050 Brussels