La première chose que nous allons faire est de comprendre comment nous obtenons les données de formulaire hors de la forme et nous avons besoin de revenir à notre formulaire et de changer une petite chose qui est sur l'entrée, nous devons donner l'entrée et le nom du nom Que nous donnons l'entrée ici sera la clé que nous regardons par l'intérieur de l'itinéraire.
Et je pense qu'un bon nom serait juste nom, mais je pense que c'est un peu déroutant.
Alors faisons juste un nouvel ami.
Donc, la valeur de cela dans ce cas Bob sera envoyé dans le corps de la demande et à l'intérieur du corps de la demande il y aura une seule propriété nommée nouvel ami.
Et ce sera égal à Bob pour rendre cela un peu plus facile à voir.
Let's go aux États-Unis dans le post pour ADD ami et nous allons annuler le corps de point de requête de journal et la demande de corps est un objet qui contiendra toutes les données du corps de la demande.
Et rappelez-vous quand nous avons un formulaire qui fait une demande post toutes les données de formulaire est mis dans le corps de la demande et puis il obtient à notre EP express et nous voulons le retirer si le corps de la demande.
Donc, si je imprime le corps de la demande, nous devrions voir que le nouvel ami est égal à Bob.
Cependant, cela ne fonctionnera pas parce que nous manquons un petit morceau et je vais vous montrer que cela ne fonctionne pas.
D'abord, ajoutons à Billie que j'ai fait un nouvel ami.
Nous obtenons que vous avez atteint la route de poste et nous obtenons un log constant demande ici corps est indéfini.
Et c'est parce que Express hors de la boîte ne crée pas réellement la demande de corps pour nous.
Nous devons explicitement lui dire de prendre le corps de la demande et de le transformer en un objet javascript pour nous d'utiliser la demande appelée du corps.
Donc, pour ce faire, nous avons réellement besoin d'installer un paquet appelé analyseur de corps.
Donc NPM installer le tableau de bord analyseur de tiret tiret sauver et la posture du corps est un peu entré et sorti de l'express où à un point, il a été livré avec l'express.
Vous n'avez pas à l'installer séparément.
Maintenant vous le faites est quelque chose que nous allons utiliser dans chaque application.
Pratiquement chaque fois que nous avons un formulaire qu'un utilisateur entre les données dans lesquelles nous voulons extraire les données sur le côté serveur.
Nous avons besoin d'utiliser analyseur de corps.
OK, il ne suffit donc pas de l'installer.
Nous devons ensuite l'exiger ici.
Donc, juste votre analyseur de corps, bien sûr, exiger l'analyseur Adi Dasch et puis la prochaine chose que nous devons faire est de dire exprimer à utiliser l'analyseur de corps de sorte que ressemble à ce besoin de faire app utiliser parser corps qui est une variable que nous venons de créer en important le Les parties du corps d'un paquet et puis nous avons besoin de faire point vous URL encodé et puis au lieu d'ici, nous allons écrire étendu est vrai et je ne veux pas bog cette vidéo en bas en entrant dans trop de détails, mais avec cela est Si vous avez des questions, vous pouvez aller aux parties du corps ou docs et de lire sur ce que vous êtes el non couché fait et ce fait étendu vrai.
C'est une de ces lignes qui verront tout le temps et honnêtement juste copier et coller la plupart du temps.
Alors maintenant que nous avons cette mise en place si nous redémarrer le serveur maintenant sans changer notre code, nous avons apt up post ajouter un ami et nous sommes constamment en prenant des demandes de corps.
Maintenant, si nous rafraîchissons Oops! Revenons à la forme de slash amis et ajouter dans un ami nommé Linda.
J'ai fait un nouvel ami et nous regardons dans le con. Nous voyons demande jusqu'à Adi est maintenant un objet et qui vient de l'analyseur de parti.
Ainsi Buddy parser a pris le corps de la demande et analysé dans un objet javascript qui a un nouvel ami est égal à Linda.
Donc, ce que nous voulons réellement faire est de demander jusqu'à body datt nouvel ami.
Et cela nous donnera la valeur de tout ce qui était à l'intérieur de la forme.
Et n'oubliez pas de nouveau ami est en raison de la propriété de nom que l'attribut de nom que nous avons mis sur l'entrée que nous mettons ici est ce que nous aurions besoin de le chercher par l'intérieur de l'itinéraire.
Nous ne voulons pas simplement annuler ce journal, mais ce que nous voulons faire est de l'ajouter au tableau des amis que nous avons défini ici.
Donc, la première chose à faire est de faire une nouvelle variable et nous allons simplement appeler un nouvel ami et nous allons juste stocker la demande de corps nouveau ami et puis nous voulons l'ajouter à ce tableau, mais malheureusement, nous ne pouvons pas simplement faire des amis Stop push new friend parce qu'il ya un problème de portée où notre ami est seulement défini au lieu de cette fonction.
Et ici il n'y a rien de tel que des amis.
C'est un monde très triste.
Il n'y a pas d'amis.
Donc nous devons copier ceci et le déplacer quelque part où il est visible à tous nos itinéraires.
Et c'est quelque chose que nous ne ferons pas pour longtemps parce que ce n'est qu'un tableau d'amis et nous pouvons ajouter de nouveaux amis, mais dès que le serveur s'arrête, ils vont disparaître et réinitialiser à disvalue.
Bientôt, nous utiliserons une base de données et nous n'aurons pas à nous préoccuper du problème de la portée.
Pour l'instant nous avons juste besoin de le déplacer en dehors des routes afin que nous puissions y accéder dans toutes les routes.
Donc, maintenant amis arrêter pousser français nouveau devrait fonctionner et je vais vous montrer que.
Maintenant redémarrez le serveur revenir à notre formulaire ici.
Rafraîchissez la page et ajoutons dans Jeanne.
J'ai fait un nouvel ami et nous arrivons à cette route.
Maintenant, si nous revenons à des amis, je vois Jean a été ajouté.
Donc cela signifie que cela fonctionne là où nous extrayons des requêtes jusqu'à un nouvel ami.
Et nous poussons aussi dans la frénésie et puis nous envoyons cette réponse.
Cependant, il est assez rare que nous voulions avoir une sorte de réponse comme celle-ci après avoir ajouté un nouvel ami.
La plupart du temps, nous ne voulons pas voir cela.
Habituellement, nous voulons juste revenir à cette page et voir le nouvel ami et de faire ce que nous pouvons faire est au lieu d'envoyer ou au lieu de rendre, nous pouvons utiliser une méthode nother sur rez appelé redirection et redirection.
Prenez bien le nom d'un itinéraire.
Et dans notre cas bien faire des amis barre et ils vont rediriger vers cette route et ils vont exécuter le code à l'intérieur de l'itinéraire des amis barre oblique et tout ce que fait est il rend le modèle français et passe dans la valeur des amis.
Alors maintenant, si nous démarrons le serveur à nouveau et nous revenons rafraîchir la page, nous allons ajouter un nouveau ami ici.
Tina et frappé J'ai fait un nouvel ami et vous pouvez voir Tina a été ajouté.
N'oubliez pas que nous ne restons pas sur cette page tout le temps.
Si vous regardez cela ici, laissez-moi le faire à nouveau.
Ajoutons à Jeanne.
J'ai frappé J'ai fait un nouvel ami.
Vous pouvez voir la page rafraîchie momentanément et c'est parce que nous envoyons une demande de poste à un autre endroit que les demandes de poste est trop embrassé post.
Ad friend il fait quelque logique ici.
Et puis il est très rapidement nous rediriger vers la même page le même itinéraire que nous sommes déjà sur.
Il est donc à peine perceptible que vous verrez simplement le clignotement de page pendant une seconde et voir cette petite icône est le cadeau que la page est révocation.
Mais comme je l'ai mentionné si je redémarrer le serveur de la valeur de la table des amis retourne à cela.
Donc, nous perdons tous ces amis et nous n'avons aucune permanence à nos données.
Nous allons corriger une fois que nous arrivons à des bases de données dans quelques-uns d'entre nous.
D'ACCORD.
Let's de-brief sur tout ce que nous avons couvert beaucoup ici.
La première chose dont nous avons parlé était la mise en place d'un itinéraire post et tout ce que nous avions à faire était post app et il fonctionne tout comme apt get, sauf que c'est déclenché uniquement par les demandes post à cette ligne en particulier.
Et puis vous savez et puis nous avons vu comment nous pouvons envoyer une demande de poste avec le facteur qui fonctionne et ensuite nous avons vu que nous pouvons envoyer une demande une demande de poste en utilisant le facteur.
Et puis aussi en utilisant un formulaire.
Et quand nous envoyons un formulaire, nous devons fournir l'action et la méthode et je présente cela très tôt lorsque nous avons parlé de l'âge à mes formes et j'ai mentionné que plus tard dans le cours, vous sauriez plus sur ce que l'action et la méthode signifie et quel post Demande est contre une demande d'obtenir.
C'est donc à ce moment-là que vous commencez à comprendre un peu plus l'espoir de la différence entre obtenir des postes et ce que signifie cette action et quels itinéraires sont de toute façon donc nous avons un forum et il n'a pas une seule entrée et sur cela Input, nous avons ajouté l'attribut name et cet attribut de nom que nous avons défini la valeur new friend est la façon dont les données sont ajoutées au corps de la requête.
Donc, quand nous présentons ce que la valeur de cette forme est de dire Tina, il va être envoyé sous le nom de nouvel ami.
Et puis à l'intérieur de notre appareil, nous pouvons l'extraire avec la demande de bodycount nouvel ami seulement si nous avons inclus analyseur de corps que nous avons dû installer NPM installer le corps du chasseur et puis nous avons dû dire à notre application de l'utiliser.
Donc, utiliser l'analyseur et cette ligne entière est un va voir tout le temps et quand nous faisons que l'analyseur prendra le corps de la demande et l'analyser dans un objet javascript que nous pouvons utiliser et accéder comme nous l'avons fait ici.
Et la dernière chose nouvelle que nous avons vu était redstart redirection qui prendra un vous savez comme l'ami barre oblique et qui va déclencher cette route à nouveau et exécuter tout le code à l'intérieur de l'itinéraire des amis barre oblique.
Très bien, je vais vous voir dans la leçon suivante.