Intégration du SDK Parse dans Ionic: guide pour développeurs
12 min
commencez votre projet ionic en utilisant un modèle préconstruit introduction dans cette section, vous apprendrez comment installer le sdk javascript de parse dans votre projet ionic voir plus sur le sdk de parse à référence api du sdk javascript de parse https //parseplatform org/parse sdk js/api/4 3 1/ et documentation open source de parse pour le sdk javascript https //docs parseplatform org/js/guide/ prérequis pour compléter ce tutoriel, vous aurez besoin de une application créée sur back4app suivez le tutoriel de nouvelle application parse https //www back4app com/docs/get started/new parse app pour apprendre à créer une application parse sur back4app un projet ionic démarré suivez le tutoriel de démarrage https //ionicframework com/docs/intro/cli si vous ne l'avez pas configuré 1 installer le sdk puisque les paquets ionic sont gérés par \<font color="#2166ae">npm\</font> , tout ce que vous avez à faire est d'exécuter la commande suivante au niveau de votre dossier de projet $ npm install parse 2 connectez votre application parse importez \<font color="#2166ae">parse\</font> dans \<font color="#2166ae">home ts\</font> ou dans la page que vous souhaitez utiliser home ts 1 import parse from 'parse'; utilisez \<font color="#2166ae">parse serverurl\</font> pour configurer l'url du serveur parse back4app home ts 1 parse serverurl = 'https //parseapi back4app com/'; utilisez \<font color="#2166ae">parse initialize\</font> méthode pour configurer le jeton d'authentification, connectant votre page aux serveurs back4app home ts 1 parse initialize("your app id", "your js key"); trouvez votre id d'application et votre clé client allez sur votre tableau de bord d'application sur le site web de back4app accédez aux paramètres de l'application cliquez sur \<font color="#2166ae">paramètres du serveur\</font> > \<font color="#2166ae">paramètres principaux\</font> > \<font color="#2166ae">paramètres\</font> retournez à votre fonction parse initialize et collez votre \<font color="#2166ae">applicationid\</font> et \<font color="#2166ae">javascriptkey\</font> 3 testez votre connexion créez un code de test testez votre configuration initiale avec le code suivant qui crée un \<font color="#2166ae">installation\</font> objet tout d'abord, allez y et créez une variable pour afficher le résultat sur votre application \<font color="#2166ae">accueil\</font> page home ts 1 result string; ensuite, affichez cette variable sur votre \<font color="#2166ae">accueil\</font> vue home html 1 2 {{result}} 3 enfin, ajoutez le code qui instancie un \<font color="#2166ae">installation\</font> objet et le sauvegarde ajoutez ce morceau de code après avoir configuré la communication home ts 1 let install = new parse installation(); 2 3 install save(null, { 4 success (install) => { 5 // execute any logic that should take place after the object is saved 6 this result = 'new object created with objectid ' + install id; 7 }, 8 error (install, error) => { 9 // execute any logic that should take place if the save fails 10 // error is a parse error with an error code and message 11 this result = ('failed to create new object, with error code ' + error message tostring()); 12 } 13 }); exécutez votre application sur votre navigateur $ ionic serve 2 attendez qu'un nouvel onglet s'ouvre dans votre navigateur je pour voir la page dans un cadre de téléphone, appuyez sur \<font color="#2166ae">f12\</font> 3 connectez vous à site web back4app https //www back4app com/ 4 trouvez votre application et cliquez sur \<font color="#2166ae">tableau de bord\</font> 5 cliquez sur \<font color="#2166ae">noyau\</font> 6 allez à \<font color="#2166ae">navigateur\</font> si tout fonctionne correctement, vous devriez trouver une classe nommée \<font color="#2166ae">installation\</font> comme suit c'est fait! à ce stade, vous avez appris comment commencer avec les applications ionic