Partager via

Créer une application iOS

Aperçu

Ce tutoriel montre comment ajouter Azure App Service Mobile Apps, un service back-end cloud, à une application iOS. La première étape consiste à créer un serveur principal mobile sur Azure. Ensuite, téléchargez un exemple d’application iOS de liste de tâches simple qui stocke les données dans Azure.

Pour suivre ce didacticiel, vous avez besoin d’un Mac et d’un compte Azure

Créer un serveur principal d’application mobile Azure

  1. Connectez-vous au portail Azure.

  2. Cliquez sur Créer une ressource.

  3. Dans la zone de recherche, tapez application web.

  4. Dans la liste des résultats, sélectionnez Web App du Marketplace.

  5. Sélectionnez votre abonnement et de groupe de ressources (sélectionnez un groupe de ressources existant ou créez-en un (en utilisant le même nom que votre application)).

  6. Choisissez un nom unique pour votre application web.

  7. Choisissez l’option Publier par défaut en tant que Code.

  8. Dans la pile Runtime, vous devez sélectionner une version pour ASP.NET ou Node.js. Si vous créez un back-end .NET, sélectionnez une version sous ASP.NET. Sinon, si vous ciblez une application basée sur Node, sélectionnez l’une des versions à partir de Node.

  9. Sélectionnez l'système d’exploitation approprié, Linux ou Windows.

  10. Sélectionnez la région où vous souhaitez que cette application soit déployée.

  11. Sélectionnez le plan de service d'application approprié et cliquez sur Vérifier et créer.

  12. Sous groupe de ressources, sélectionnez un groupe de ressources existant ou créez-en un (en utilisant le même nom que votre application).

  13. Cliquez sur Créer. Patientez quelques minutes pour que le service soit déployé correctement avant de continuer. Regardez l’icône Notifications (cloche) dans l’en-tête du portail pour les mises à jour d’état.

  14. Une fois le déploiement terminé, cliquez sur la section Détails du déploiement, puis sur la ressource de type Microsoft.Web/sites. Il vous permet d’accéder à l’application web App Service que vous venez de créer.

  15. Cliquez sur le volet Configuration sous Paramètres et, dans Paramètres de l’application, cliquez sur le bouton Nouveau paramètre d’application.

  16. Dans la page Ajouter/modifier une application, entrez Nom comme MobileAppsManagement_EXTENSION_VERSION et Valeur comme la plus récente et appuyez sur OK.

Vous êtes tous configurés pour utiliser cette application web App Service nouvellement créée en tant qu’application mobile.

Créer une connexion de base de données et configurer le projet client et serveur

  1. Téléchargez les guides de démarrage rapide du Kit de développement logiciel (SDK) client pour les plateformes suivantes :

    iOS (Objective-C)
    iOS (Swift)
    Android (Java)
    Xamarin.iOS
    Xamarin.Android
    Xamarin.Forms
    Cordoue
    Windows (C#)

    Remarque

    Si vous utilisez le projet iOS, vous devez télécharger « azuresdk-iOS-*.zip» à partir de dernière version de GitHub. Décompressez et ajoutez le fichier MicrosoftAzureMobile.framework à la racine du projet.

  2. Vous devrez ajouter une connexion de base de données ou vous connecter à une connexion existante. Tout d’abord, déterminez si vous allez créer un magasin de données ou utiliser un magasin de données existant.

    • Créer un magasin de données: si vous allez créer un magasin de données, utilisez le guide de démarrage rapide suivant :

      Démarrage rapide : Prise en main des bases de données uniques dans Azure SQL Database

    • source de données existante: suivez les instructions ci-dessous si vous souhaitez utiliser une connexion de base de données existante

      1. Format de la chaîne de connexion de la base de données SQL - Data Source=tcp:{your_SQLServer},{port};Initial Catalog={your_catalogue};User ID={your_username};Password={your_password}

        {your_SQLServer} Nom du serveur, il se trouve dans la page vue d’ensemble de votre base de données et se présente généralement sous la forme « server_name.database.windows.net ». {port} généralement 1433. {your_catalogue} Nom de la base de données. {your_username} nom d’utilisateur pour accéder à votre base de données. {your_password} Mot de passe pour accéder à votre base de données.

        En savoir plus sur le format de chaîne de connexion SQL

      2. Ajoutez la chaîne de connexion à votre application mobile Dans App Service, vous pouvez gérer les chaînes de connexion pour votre application à l’aide de l’option Configuration dans le menu.

        Pour ajouter une chaîne de connexion :

        1. Cliquez sur l’onglet Paramètres de l’application.

        2. Cliquez sur [+] Nouvelle chaîne de connexion.

        3. Vous devez fournir nom, valeur et type pour votre chaîne de connexion.

        4. Tapez Nom avec MS_TableConnectionString

        5. La valeur doit être la chaîne de connexion que vous avez formée à l’étape précédente.

        6. Si vous ajoutez une chaîne de connexion à une base de données SQL Azure, choisissez SQLAzure sous type.

  3. Azure Mobile Apps dispose de kits SDK pour .NET et Node.js back-ends.

    • Node.js back-end

      Si vous allez utiliser Node.js application de démarrage rapide, suivez les instructions ci-dessous.

      1. Dans le portail Azure, accédez à Easy Tables, vous verrez cet écran.

        Nœud Tables Faciles

      2. Vérifiez que la chaîne de connexion SQL est déjà ajoutée dans l’onglet Configuration. Cochez ensuite la case Je reconnais que cela remplacera tous les contenus du site, puis cliquez sur le bouton Créer une table TodoItem.

        Configuration facile des tables de nœuds

      3. Dans Easy Tables, cliquez sur le bouton + Ajouter.

        Bouton Ajouter des tables simples de nœud

      4. Créez une table TodoItem avec un accès anonyme.

        Tables faciles de nœud Ajouter table

    • back-end .NET

      Si vous allez utiliser l’application de démarrage rapide .NET, suivez les instructions ci-dessous.

      1. Téléchargez le projet de serveur .NET Azure Mobile Apps à partir du dépôt référentiel azure-mobile-apps-quickstarts.

      2. Générez le projet de serveur .NET localement dans Visual Studio.

      3. Dans Visual Studio, ouvrez l’Explorateur de solutions, cliquez avec le bouton droit sur ZUMOAPPNAMEService projet, cliquez sur Publier, une fenêtre Publish to App Service s’affiche. Si vous travaillez sur Mac, consultez d’autres façons de déployer l’application ici.

        Publication dans Visual Studio

      4. Sélectionnez App Service comme cible de publication, puis cliquez sur Sélectionner existant, puis cliquez sur le bouton Publier en bas de la fenêtre.

      5. Vous devez d’abord vous connecter à Visual Studio avec votre abonnement Azure. Sélectionnez le Subscription, Resource Group, puis sélectionnez le nom de votre application. Lorsque vous êtes prêt, cliquez sur OK, ce qui déploie le projet serveur .NET que vous avez localement dans le serveur principal App Service. Une fois le déploiement terminé, vous êtes redirigé vers http://{zumoappname}.azurewebsites.net/ dans le navigateur.

Exécuter l’application iOS

  1. Ouvrez le projet client téléchargé à l’aide de Xcode.

  2. Accédez au portail Azure et accédez à l’application mobile que vous avez créée. Dans le panneau Overview, recherchez l’URL qui est le point de terminaison public de votre application mobile. Exemple : le nom de site de mon nom d’application « test123 » sera https://test123.azurewebsites.net.

  3. Pour le projet Swift, ouvrez le fichier ToDoTableViewController.swift dans ce dossier - ZUMOAPPNAME/ZUMOAPPNAME/ToDoTableViewController.swift. Le nom de l’application est ZUMOAPPNAME.

  4. Dans viewDidLoad() la méthode, remplacez ZUMOAPPURL le paramètre par le point de terminaison public ci-dessus.

    let client = MSClient(applicationURLString: "ZUMOAPPURL")

    devient

    let client = MSClient(applicationURLString: "https://test123.azurewebsites.net")

  5. Pour le projet Objective-C, ouvrez le fichier QSTodoService.m dans le dossier suivant : ZUMOAPPNAME/ZUMOAPPNAME. Le nom de l’application est ZUMOAPPNAME.

  6. Dans init la méthode, remplacez ZUMOAPPURL le paramètre par le point de terminaison public ci-dessus.

    self.client = [MSClient clientWithApplicationURLString:@"ZUMOAPPURL"];

    devient

    self.client = [MSClient clientWithApplicationURLString:@"https://test123.azurewebsites.net"];

  7. Appuyez sur le bouton Exécuter pour générer le projet et démarrer l’application dans le simulateur iOS.

  8. Dans l’application, cliquez sur l’icône plus (+), tapez du texte explicite, par exemple Terminer le didacticiel, puis cliquez sur le bouton Enregistrer. Cela envoie une requête POST au back-end Azure que vous avez déployé précédemment. Le back-end insère des données de la requête dans la table SQL TodoItem et retourne des informations sur les éléments nouvellement stockés dans l’application mobile. L’application mobile affiche ces données dans la liste.

    Application de démarrage rapide s’exécutant sur iOS