‫Jonas: Lassen Sie uns nun einen
‫Route-Handler für Post-Requests implementieren, damit wir tatsächlich eine Natour zu unserem Datensatz
‫hinzufügen können.
‫Beginnen wir also wie beim
‫doGET()-Request-Handler mit dem Hinzufügen einer neuen Route.
‫Also App. post dieses Mal, und denken
‫Sie daran, dass wir hier post, also die post-Methode,
‫verwenden, denn das ist die Art von Anfrage, die wir bearbeiten möchten.
‫Also Anfragen, die mit dem HTTP-Post-Verb gestellt werden, richtig?
‫V1
‫und Touren.
‫Genau wie wir in der REST-API-Vorlesung gesprochen haben, ist
‫die URL tatsächlich genau dieselbe.
‫Egal, ob wir alle Touren abrufen oder
‫eine neue Tour erstellen möchten, die
‫URL ist genau gleich.
‫Dann ändert sich nur die http-Methode, die wir
‫für diese Anfragen verwendet haben.
‫Um alle Touren zu erhalten und zu posten, um eine
‫neue Tour zu erstellen, dann hier unsere typische
‫Rückruffunktion, bei der wir Zugriff auf
‫die Anfrage und das Antwortobjekt erhalten, damit wir einige Daten aus
‫der Anfrage erhalten und eine entsprechende Nachricht zurücksenden können Antwort.
‫Denken Sie jetzt daran, dass wir
‫mit einer Post-Anfrage Daten vom Client an den Server senden können, oder?
‫Diese Daten stehen dann idealerweise auf Anfrage zur Verfügung.
‫Das Anfrageobjekt enthält wiederum alle Daten, alle
‫Informationen über die durchgeführte Anfrage.
‫Wenn diese Anfrage gesendete Daten enthält,
‫sollten diese Daten in der Anfrage enthalten sein, oder?
‫Express stellt diese Körperdaten jetzt nicht mehr auf die Anfrage,
‫und um diese Daten zur Verfügung zu haben, müssen
‫wir eine sogenannte Middleware verwenden.
‫Wir werden in einigen Vorträgen ausführlich über
‫Middleware sprechen, aber damit dies
‫funktioniert, müssen wir
‫hier oben in der Datei eine einfache Middleware einfügen.
‫Also eigentlich genau hier.
‫Was wir tun müssen, ist App zu sagen. verwenden, dann ausdrücken.
‫json Okay, und das war's.
‫Also noch einmal, dies [express. json] hier ist Middleware.
‫Und Middleware ist im Grunde
‫eine Funktion, die die eingehenden Anforderungsdaten ändern kann.
‫Es wird Middleware genannt, weil es zwischen,
‫also in der Mitte der Anfrage und der Antwort, steht.
‫Es ist nur ein Schritt, den die
‫Anfrage während der Verarbeitung durchläuft.
‫Und der Schritt, den die Anfragen durchlaufen, besteht
‫in diesem Beispiel darin, dass die Daten aus dem Hauptteil hinzugefügt werden.
‫Es wird also mit dieser Middleware
‫zum Anforderungsobjekt hinzugefügt.
‫Wir verwenden App. verwenden, um Middleware wie diese zu verwenden.
‫Und wieder werden wir etwas später in
‫diesem Abschnitt noch viel mehr über Middleware sprechen.
‫Im Moment wissen Sie nur, dass wir Middleware so verwenden.
‫Alle Details folgen dann später.
‫Für den Anfang möchte ich Ihnen
‫die Daten des Hauptteils in der Konsole anzeigen, um zu
‫überprüfen, ob es tatsächlich funktioniert, also req. Karosserie.
‫Auch hier ist body die
‫Eigenschaft, die auf Anfrage verfügbar sein wird, da
‫wir diese Middleware vor ein paar Augenblicken verwendet haben.
‫Also wollen wir log[req. body] an die Konsole und
‫dann müssen wir auch eine Antwort zurücksenden.
‫Also res. senden und vorerst nur einige Platzhalter hier.
‫Einfach 'Fertig'.
‫Wir müssen
‫also immer etwas zurücksenden, um den
‫sogenannten Anfrage/Antwort-Zyklus abzuschließen, über den wir später in diesem Abschnitt
‫noch einmal etwas mehr erfahren werden.
‫Lassen Sie uns dies
‫jetzt testen und eine neue Anfrage für den Beitrag erstellen.
‫Jetzt können wir hier im Postboten
‫etwas wirklich Schönes tun, nämlich all diese Anfragen zu speichern.
‫Ich werde damit beginnen, eine neue
‫Kollektion zu erstellen, die ich Natours nennen werde.
‫Neue Kollektion.
‫Jetzt werde ich diese Anfrage in dieser Sammlung speichern.
‫Dies ist also Holen Sie sich alle Touren.
‫Legen Sie es in Natours ein und speichern Sie es.
‫Jetzt haben wir hier unsere Get-Anfragen.
‫Nun, lass uns diesen hier jetzt kopieren und
‫einen neuen erstellen.
‫Dies ist also eine Post-Anfrage.
‫Bevor ich es mache,
‫werde ich es tatsächlich auch direkt in dieser Sammlung speichern.
‫Erstellen Sie also eine neue Tour.
‫Hier auf der linken Seite haben wir nun unsere beiden Anfragen.
‫Geben wir hier nun tatsächlich unseren Körper an, also die Daten,
‫die wir im Grunde an den Server senden wollen.
‫Wir kommen hier zu Body, und es gibt verschiedene Möglichkeiten, dies
‫jetzt zu tun, aber die einfachste ist,
‫einfach Raw und dann Application JSON zu sagen.
‫Alles, was wir hier tun müssen, ist im Grunde etwas JSON anzugeben,
‫und das wird dann an den Server übertragen.
‫Das erste, was wir angeben möchten, ist der
‫Name der Tour, und
‫Sie erinnern sich, dass in JSON alles in Anführungszeichen und
‫tatsächlich in doppelten Anführungszeichen stehen muss, nicht nur in Anführungszeichen.
‫Lassen Sie mich dies einfach eine
‫Testtour nennen und schauen wir uns an, was wir sonst noch in den Tourdaten haben.
‫Wir haben also den Namen, wir haben die Dauer und
‫sagen wir einfach auch die Schwierigkeit.
‫Daher werde ich nicht alle diese Angaben machen, weil das viel
‫zu viel Zeit in Anspruch nimmt.
‫Sagen wir einfach, die Dauer
‫beträgt 10 Tage und die Schwierigkeit ist
‫einfach.
‫Das wird als unser Körper an den Server übermittelt.
‫Das ist jetzt also getestet, drücken Sie auf Senden und hier erhalten wir
‫unsere Antwort zurück, die erledigt ist, denken Sie daran.
‫Hier ist die Antwort, die wir gesendet haben, fertig.
‫Und Sie sehen, dass wir hier unten in
‫unserer Konsole ein Objekt haben, das im
‫Grunde genommen der JSON ist, den wir in unseren Körper gesendet haben, richtig?
‫So perfekt, es funktioniert!
‫Es ist kein JSON mehr, wie Sie sehen können.
‫Es ist wirklich ein JavaScript-Objekt.
‫Um Ihnen zu zeigen, dass wir
‫wirklich Middleware brauchten, lassen Sie uns diese auskommentieren.
‫Erneut senden.
‫Habe jetzt die Anfrage nicht mehr. Körper, oder?
‫Deshalb ist es jetzt undefiniert, weil es nicht mehr existiert.
‫Speichern Sie es, senden Sie unsere
‫Anfrage erneut und jetzt ist es wieder da.
‫Wir haben unsere Post-Route
‫alle eingerichtet, sie funktioniert jetzt und wir erhalten auch Zugriff auf den
‫Hauptteil, und was wir jetzt tun möchten, ist,
‫diese Daten tatsächlich in dieser einfachen JSON-Datei der Tour beizubehalten.
‫Wir werden diese Datei tatsächlich ändern, sodass die Daten
‫hier in unserer fiktiven Datenbank gespeichert werden.
‫Diese JSON-Datei funktioniert im Moment sozusagen
‫als unsere fiktive Datenbank.
‫Also kümmern wir uns jetzt darum.
‫Ich werde weitermachen und dieses auskommentieren.
‫Also lasst uns anfangen.
‫Als erstes müssen
‫wir die ID des neuen Objekts herausfinden.
‫Denken Sie auch in der
‫Vorlesung über REST-APIs daran, dass wir beim Erstellen eines neuen Objekts
‫niemals die ID des Objekts angeben.
‫Dafür sorgt in der Regel die Datenbank.
‫Ein neues Objekt erhält normalerweise automatisch seine neue ID.
‫Nun, in diesem Fall haben wir keine Datenbank, also
‫nehmen wir einfach die ID
‫des letzten Objekts und fügen dann +1 hinzu.
‫Lassen Sie uns das sehr schnell tun, und das ist
‫nur grundlegendes JavaScript.
‫Also neuId es Touren sind, oder?
‫Denken Sie daran, dass Touren wir bereits die
‫Daten in dieser Tour-Variable haben.
‫Das ist also
‫ein Array aller Tour-Objekte, und wir wollen
‫das letzte, nämlich Touren. length - 1, dann die
‫id-Eigenschaft davon und wir fügen + 1 hinzu.
‫Das ist also die neue ID.
‫Als nächstes erstellen wir eine neue
‫Tour, und diese Tour ist
‫im Grunde der Körper, den wir senden, plus die neue ID, die wir gerade erstellt haben.
‫Wir können also Objekt verwenden. Assign, die uns im Grunde erlaubt,
‫ein neues Objekt zu
‫erstellen, indem wir zwei vorhandene Objekte zusammenführen.
‫Das erste
‫Objekt ist also id=newId, und
‫dann wollen wir
‫request. Karosserie.
‫Wir hätten auch req. Karosserie. id=newId, aber
‫ich wollte das ursprüngliche Körperobjekt nicht mutieren.
‫Ich habe es einfach so belassen.
‫Das ist die neue Tour,
‫und jetzt wollen wir diese Tour ins Tour-Array schieben, oder?
‫Touren, ist die Auswahl der neun Touren, die
‫wir an dieser Stelle haben.
‫Wir sagen schieben und schieben die neue Tour rein.
‫Das ist das Array, das jetzt die neue Tour enthält, aber natürlich
‫müssen wir das jetzt in der Datei beibehalten.
‫Das ist an dieser Stelle wieder ganz einfach
‫für Sie, also verwenden Sie fs. Datei schreiben.
‫Welchen sollten wir also verwenden?
‫writeFile oder writeFileSync?
‫Die Antwort darauf ist ganz einfach.
‫Wir befinden uns in einer Rückruffunktion, die
‫in der Ereignisschleife ausgeführt wird.
‫Wir können die Ereignisschleife niemals blockieren.
‫Was wir tun werden, ist
‫writeFile zu verwenden und nicht zu synchronisieren.
‫Wir möchten eine Callback-Funktion übergeben,
‫die im Hintergrund verarbeitet wird und
‫sobald sie fertig ist, wird ihr
‫Ereignis in
‫eine der Ereignisschleifen-Warteschlangen gestellt, die dann verarbeitet werden, sobald die Ereignisschleife
‫erfolgt passiert diese Phase.
‫Erinnern Sie sich noch an den Event Loop-Vortrag?
‫Wie auch immer, holen wir uns den
‫Dateinamen von hier oben, denn wir werden diese Datei wirklich
‫überschreiben, damit sie beim Neustart dieses
‫Servers dort ist.
‫Also wo
‫- genau hier.
‫Das ist also die Datei, in die wir schreiben möchten.
‫Die Daten, die wir schreiben wollen, das sind Touren, und
‫dann unsere Callback-Funktion, die in diesem Fall
‫nur den Fehler hat.
‫Hier ist mir gerade aufgefallen,
‫dass wir dieses Objekt auch stringifizieren müssen, oder?
‫Wir wollen json in
‫dieser JSON-Datei, und dies ist im Moment
‫nur ein einfaches, normales JavaScript-Objekt und daher müssen wir es konvertieren.
‫Aber das ist wieder einfach, hab das schon gemacht.
‫JSON. Stringify des Objekts.
‫Was wollen wir tun, sobald die Datei geschrieben ist?
‫Normalerweise senden wir das neu erstellte Objekt
‫als Antwort.
‫Lass uns das tun.
‫Also Antwort, und
‫dann beginnen wir wie immer mit der Angabe des Statuscodes.
‫In diesem Fall wird es kein 200, sondern ein 201.
‫Also 201, was erstellt bedeutet.
‫200 steht für okay, 201
‫steht für erstellt, und genau das ist hier passiert.
‫Wir haben eine neue Ressource auf einem Server erstellt.
‫Also JSON, und diese Nachricht wird hier immer wieder hinzugefügt.
‫Status ist wieder Erfolg.
‫Ich verwende hier nicht die Results-Eigenschaft,
‫die wir zuvor hatten, da ich jetzt nur ein Ergebnis zurücksende.
‫Daten sind hier unser Umschlag.
‫Tour ist neue Tour.
‫Das ist es!
‫Speichern Sie es
‫hier und formatieren Sie es oder codieren Sie ein wenig.
‫Lassen Sie uns hier etwas mehr Platz hinzufügen.
‫Ich denke, wir sind bereit, es jetzt auszuprobieren.
‫Wir können tatsächlich eine neue Tour erstellen, indem wir diese Daten hier verwenden.
‫Passen Sie also diese Testtour und diese Daten an
‫und warten wir darauf.
‫Was ist hier passiert?
‫Mal sehen, ah okay.
‫Wir haben ein Problem, dass wir im Grunde zweimal eine Antwort gesendet haben.
‫Also haben wir eine Antwort mit JSON und
‫dann noch einmal mit . senden.
‫Das ist nicht erlaubt.
‫Deshalb bekommen wir hier diesen Fehler.
‫Also eigentlich schön, dass es hier passiert ist, damit ihr
‫wisst, was dieser Standardfehler hier bedeutet.
‫HTTP_HEADERS_SENT kann keine Header setzen, nachdem sie
‫an den Client gesendet wurden.
‫Das passiert, wenn Sie versuchen, zwei Antworten zu senden.
‫Das müssen wir loswerden.
‫Ja, das war der einzige Fehler, den wir hatten.
‫Das sollte jetzt Abhilfe schaffen.
‫Versuche es.
‫Und tatsächlich, los geht's.
‫Wir haben also unsere ID von
‫10, die unser Code für uns erstellt hat, und dann die gesamte Tour,
‫die genau die Daten sind, die wir als Body in unserer Anfrage gesendet haben.
‫Jetzt ist die Sache, dass wenn wir alle Touren
‫hier haben, es noch nicht angezeigt wird.
‫Wenn wir hier runter gehen, ist
‫es eigentlich schon da.
‫Wir haben die von vorhin, also als wir diesen Fehler
‫hatten, hat er tatsächlich auch diese Tour hier erstellt.
‫Dann natürlich die Tour, die wir mit der ID 10 erstellt haben.
‫Diese Tour hier ist also genau die,
‫die gerade erstellt wurde.
‫Wenn wir jetzt tun, Testtour 2, mit der Dauer von nur 5.
‫Probieren wir das mal aus, und wenn ich alle Touren bekomme, dann zeigt
‫sich das auch hier.
‫Ich habe am Anfang gesagt, dass es nicht funktionieren würde, damit es nicht gleich auftauchen
‫würde, weil das nur
‫funktioniert, wenn wir den Server neu starten.
‫Diese Datei, die Tour-einfach.
‫json-Datei, aus der unsere Touren stammen,
‫wird nur am Anfang gelesen, wenn wir den Server starten.
‫Die Sache ist nun, dass jedes Mal, wenn wir etwas in dieser
‫JSON-Datei speichern, auch der Server neu geladen wird.
‫Lass mich dir das beweisen, also wenn ich jetzt auf Speichern
‫drücke, dann schau, was hier unten passiert.
‫Also speichere ich es, und Sie sehen, dass
‫hier unten der Server neu gestartet wurde.
‫Es hat auch den Code formatiert, weil er hübscher ist.
‫Aber was hier zählt, ist, dass dieser Code aktualisiert wurde.
‫Deshalb wird jedes Mal, wenn wir hier mit unserer
‫API etwas speichern, der
‫Server sofort neu geladen und der Inhalt aus der Datei
‫in die Touren neu geladen, und wir können das dann sofort lesen.
‫Deshalb haben wir
‫sofort Zugriff auf alle neu erstellten Touren.
‫Sinn ergeben?
‫Nun, wenn
‫nicht, stellen Sie bitte einfach Ihre Fragen und natürlich den Fragen-und-Antwort-Bereich, oder?