Découvrir Ember.js

Configurer l'adaptateur

Testez gratuitement nos 1270 formations

pendant 10 jours !

Tester maintenant Afficher tous les abonnements
Vous allez apprendre à configurer l'adaptateur pour indiquer à Ember Data comment il doit communiquer avec votre service web.
05:50

Transcription

La première chose que vous aurez à faire pour utiliser ember data, est de configurer un Adapter. L'Adapter, c'est l'objet qui va être responsable de transformer vos demandes du type, j'aimerais avoir la liste des groupes, ou alors j'aimerais avoir le groupe numéro 3, ou alors, j'aimerais modifier le groupe numéro 3, en lui donnant ces données-là etc, donc c'est celui qui va convertir vos demandes en requête web, vers un mode serveur, Bon justement sont rôle, ça va être de construire les URL, de choisir les types de requêtes, de trouver l'adresse du serveur, toutes ces informations qu'on ne souhaite plus gérer nous-mêmes. Si vous souhaitez, il existe un Adapter 100% automatique, mais qui va essayer de communiquer avec la même URL de votre site. Donc par exemple nous, ça nous poserait problème, puisque si vous essayez de récupérer la liste des groupes, et bien il va essayer d'appeler la même URL, sur le même serveur, et espérez retenir du json, ce qui forcément n'est pas très logique, puisque nous, notre root correspond exactement au nombre des données qu'on veut charger. Donc au lieu d'obtenir le json qu'il aurait besoin, il va obtenir le HTML de notre page, donc c'est pas ce qu'on veut. Le minimum qu'on doit faire, c'est au moins fournir l'URL du serveur. Puisque généralement l'URL de votre site web ne sera pas forcément la même que celle du serveur. Ça peut être possible, vous pouvez aussi le mettre dans un sous-dossier de votre site web le serveur, c'est faisable aussi et c'est configurable. Donc pour générer un Adapter, il vous suffit comme d'habitude d'utiliser la ligne de commandes et le générateur On va se rendre ici, je vais arrêter mon serveur. ember... generate... alors tiens ! Si vous souhaitez très souvent générer des choses, plutôt que de chaque fois taper generate, il y a un raccourci, c'est ember g C'est pareil que generate, ça fait la même chose, c'est juste plus court à écrire. Adapter... et nous ça sera un Adapter pour toute l'application. Donc on va faire application, Si c'est pour que certaines roots, vous pouvez redéfinir des acteurs pour chaque root sur le même principe que ce qu'on fait depuis le début, en créant des sous-dossiers, vous pouvez redéfinir à chaque fois les Adapters pour chacun des sous-chemins de votre site Donc en faisant ça, il m'a créé mon fichier, application.js dans Apps/Adapter et encore une fois, il a créé un test unitaire. Je vais relancer mon serveur... et on va aller voir le projet. Donc si j'ouvre mon dossier App, donc il est bien présent, donc dans App, il m'a ajouté Adapter, et quand je clique sur application.js, j'ai déjà du code qui a été ajouté pour moi. Alors là, on arrive à un petit problème par rapport à notre configuration, qu'on utilise depuis le début. Nous avons utilisé json server qui est un petit utilitaire qui permet de générer, vous vous rappelez, un serveur très rapidement, sans se préoccuper de normes ou quoique ce soit, il est très bien pour débuter et pour tout ce qu'on a fait jusqu'à présent. Par contre, en terme de respect des normes il n'a pas adhéré à des normes particulières, et notamment, ember par contre, attend des normes spéciales. La norme par défaut utilisée par ember, c'est json API donc vous avez un site officiel qui décrit tout le format, et ils fournissent aussi plusieurs exemples et plusieurs implémentations dans des languages de serveurs différents, comme le PHP, le Ruby, le Java, Node.js peu importe, ils vous fournissent des bases d'implémentation toutes prêtes, pour convertir dans un bon format, le json envoyé. Donc on ne va pas pouvoir utiliser notre serveur actuel, donc ce que j'ai fait pour essayer de simplifier les choses, c'est, j'utilise déjà, au lieu d'utiliser Gson API, je vais utiliser un autre qui s'appelle le restAdapter, c'est l'ancien format utilisé par ember, qui est beaucoup plus simple. C'est pas encore exactement le même que celui qu'on utilise sur json server, mais il s'en rapproche beaucoup. C'est à dire que c'est exactement le même que json, sauf que les résultats doivent être encapsulés dans une balise avec le nom de la donnée qu'on cherche à récupérer. Par exemple, si on cherche la liste des groupes, donc Groups, au lieu de mettre directement en Gson la liste de tous les groupes, il faudra qu'il y ait marqué Groups, deux points, ouvrez les crochets et là, la liste de tous les groupes. Donc ce que j'ai fait pour continuer ce projet-là, et ce qui est évident c'est que sur un serveur réel, vous n'utiliserez pas Gson server, et il vaut mieux vous concentrer sur json API Et là, pour continuer à regarder des choses simples, voici ce que j'ai fait J'ai repris le code source de json server, alors je suis allé voir sur le site, la documentation officielle. Il explique qu'on peut l'utiliser comme un module node.js, donc j'ai recréé un mini projet node.js, avec uniquement mon fichier db.json et un fichier index.js et il explique qu'on peut rajouter du contenu, donc c'est ce que j'ai fait. juste avant qu'il renvoie le résultat, je rajoute la clé, c'est à dire le nom de l'URL. Je mettrai ce projet-là dans les sources du projet, pour ceux qui n'ont pas accès aux sources, vous pouvez très facilement le faire, c'est expliqué sur le site, donc ça je vais le mettre de côté. Et à partir de maintenant, on va changer de serveur. Alors une fois qu'on a choisi notre type d'Adapter, moi j'ai pris l'Adapter rest, il faut aussi lui préciser l'hôte, par défaut je vous dis, gardez exactement le même hôte que celui qu'on a nous, c'est à dire localhost, deux points, 4200. Dans mon cas, je vais le changer. Donc la clé s'appelle host, et je vais utiliser http, deux points, slash, slash... localhost... deux points, et là je vais mettre le port 3000. Parce que les projets node.js tournent sur le port 3000, ce qui était le cas d'ailleurs de json server, que l'on utilise depuis le début. Voilà donc en faisant ça, au lieu d'essayer de communiquer avec le port 4200 qui est le port de notre site, il va communiquer sur un port différent, donc je serais sur la même machine, mais il va contacter un autre serveur de la machine, c'est ce que je souhaite. Donc notre Adapter est prêt, nous allons pouvoir, à partir de maintenant, alors je vais tourner l'autre serveur à la place, et vous expliquer, mais sinon en terme de projet, notre projet à nous, ça ne change rien les changements sont côté serveur, le lien avec ember, c'est quelque chose de différent. Pour les Adapters, on a vu tout ce qu'il y avait à voir, avec ça, ça suffit. Si vous souhaitez personnaliser aussi le chemin d'accès aux ressources, au niveau du serveur, vous pouvez le faire avec la propriété namespace, deux points... par exemple, vous pouvez faire api slash v1 donc toutes les requêtes iront sur localhost, 3000, slash, api, slash, v1 et ensuite la requête normale, donc groups ou groups, slash 2 etc.

Découvrir Ember.js

Créez vos composants et mettez en page vos sites avec une facilité déconcertante avec Ember.js. Apprenez à créer des routes et à charger vos modèles depuis un service web externe.

2h57 (37 vidéos)
Aucun commentaire n´est disponible actuellement
 
Logiciel :
Spécial abonnés
Date de parution :31 mars 2016

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !