‫Kursleiter: In diesem Video integrieren
‫wir Stripe in unser Backend, indem wir diesen
‫API-Endpunkt erstellen, der eine Stripe-Checkout-Sitzung erstellt und zurücksendet.
‫Und an diesem Punkt werden wir tatsächlich damit beginnen, unsere
‫nächste Ressource zu erstellen.
‫Und das sind die Buchungen.
‫Und ich beginne hier mit den Buchungsrouten.
‫Also
‫Routen buchen. js.
‫Und das haben wir jetzt schon so oft gemacht.
‫Also kopiere ich einfach den
‫ganzen Code und
‫füge ihn hier in die Buchungsrouten ein.
‫Und dann einfach alles entfernen.
‫Und auch dieser.
‫Wir brauchen auch keine Merge-Parameter
‫und werden einen Buchungs-Controller anstelle eines Überprüfungs-Controllers
‫haben.
‫Also Buchungscontroller, lassen Sie uns das tatsächlich erstellen.
‫So. js, das sieht richtig
‫aus und lasst uns dies
‫auch direkt in die App integrieren. js.
‫Lassen Sie uns das gleich hier
‫nach dem Testrouter platzieren.
‫Also hier
‫nochmal Buchungen und das dann natürlich hier unten
‫in unsere API einbinden.
‫Also Buchungen
‫und hier Buchungen Router.
‫Und ich denke, das sollte nur Buchung sein.
‫Also lass uns das auch hier reparieren.
‫Und tatsächlich nennen wir es Buchungsrouter.
‫Und auch hier geht es nicht um Buchungen, sondern
‫um die Buchung von Routen.
‫Also lass es dir sparen.
‫Schließen Sie dieses
‫und dieses und dieses hier auch.
‫Und so können wir jetzt tatsächlich unsere
‫erste Route hier erstellen.
‫Kommen wir also zum Router. get und die Route,
‫die hier erstellt wird, wird wieder nicht dem
‫Restprinzip folgen, da es hier nicht wirklich darum geht, eine Buchung
‫zu erstellen oder zu erhalten oder zu aktualisieren.
‫Stattdessen wird diese Route nur für den Kunden zur
‫Verfügung gestellt, um eine Checkout-Sitzung zu erhalten.
‫Also nennen wir diese
‫eine Checkout-Sitzung.
‫Dann müssen wir diese Route
‫schützen, damit nur
‫authentifizierte Benutzer tatsächlich eine Checkout-Sitzung erhalten.
‫Das macht also Sinn, oder?
‫Und dann Buchungscontroller hinzufügen.
‫Wir werden einen Route-Handler
‫namens get checkout session erstellen.
‫Gut.
‫Also
‫kopieren wir diesen hier und erstellen ihn hier bei exports. getCheckoutSession, dann antwortet die Anfrage als
‫nächstes.
‫Und jetzt fangen wir an zu arbeiten.
‫Jetzt müssen wir hier in den Routen noch
‫etwas tun, nämlich einen URL-Parameter anzugeben.
‫Und das wird die Tour-ID sein.
‫Okay, im Grunde möchten wir, dass der
‫Kunde die ID der Tour mitschickt, die gerade gebucht wird.
‫Und damit wir den Checkout mit allen notwendigen
‫Daten wie Tourname und Tourpreis und
‫so weiter füllen können.
‫In Ordnung, wir haben jetzt Zugriff auf die Tour-ID in
‫dieser Handler-Funktion und das erste, was wir tatsächlich tun
‫werden, ist, diese
‫Tour in unserer Datenbank zu finden.
‫Also gut, dafür brauchen wir natürlich das Tourmodell.
‫Kommen wir also zum Tourcontroller und holen
‫das von dort ab.
‫Außerdem brauchen wir
‫dieses catchAsync und das alles.
‫Also kopiere ich alles und auch
‫wenn ich es nicht sofort
‫brauche, werde ich es wahrscheinlich sowieso etwas später brauchen.
‫Gut.
‫Also lassen Sie uns unsere Schritte hier noch einmal planen.
‫Holen Sie sich also die aktuell gebuchte Tour.
‫Im zweiten Schritt erstellen wir dann die Checkout-Sitzung
‫und senden sie schließlich an den Kunden.
‫Alles klar, der erste Schritt ist also ganz einfach.
‫Also werden wir warten.
‫Also Tour. findbyId,
‫die erforderlich ist. Parameter. tourId.
‫Richtig, das
‫war der Name, den wir ihm im URL-Parameter gegeben haben.
‫Und natürlich ist
‫dies jetzt eine asynchrone Funktion mit einem catchAsync daneben oder tatsächlich.
‫Großartig, als nächstes erstellen wir diese Sitzung hier.
‫Und dafür müssen wir tatsächlich
‫dieses Laufwerk-NPM-Paket installieren.
‫Also machen wir das hier.
‫NPM installiert Stripe.
‫Und in der Zwischenzeit gehen wir zu unserem Stripe-Dashboard
‫und holen unseren geheimen Schlüssel von hier.
‫Klicken Sie also einfach hier auf
‫diese Schaltfläche und kopieren Sie es dann.
‫Und Sie sehen, dass hier in den Tasten
‫tatsächlich Test steht.
‫Und so wieder, diese
‫hier sind nur zum Testen und sobald Sie Ihr Stripe-Konto
‫aktiv haben, können Sie Ihre Live-API-Schlüssel erhalten.
‫Okay, jetzt werden wir sie wie
‫alle anderen Schlüssel hier in unsere Konfigurationsdatei einfügen.
‫Also Stripe Secret Key gleich
‫diesem.
‫Und das ist hier nicht richtig.
‫Alles klar, also kopiere diesen hier.
‫Zurück zu unserem Buchungscontroller.
‫Lassen Sie uns nun
‫dieses Laufwerkspaket mit erfolgreich installierter Installation hier anfordern.
‫Und nur bei allen anderen Paketen stelle bitte vorher
‫sicher, dass du tatsächlich auf der
‫gleichen Version bist wie ich.
‫Und du siehst, ich bin hier bei der brandneuen 7. 0. 0.
‫Das ist also wirklich ganz neu.
‫Und das liegt tatsächlich daran,
‫dass sich mit Stripe vor ein paar Tagen einiges geändert hat.
‫Also musste ich ein paar dieser Implementierungen ändern.
‫Wie auch immer,
‫const stripe gleich require und dann stripe.
‫Nun wird dies hier dann im Grunde eine Funktion exponieren.
‫Und normalerweise geben wir dann sofort
‫unseren geheimen Schlüssel ein.
‫Und so erhalten wir dann ein Stripe-Objekt, mit
‫dem wir arbeiten können.
‫Also das jetzt am Prozess. env. STRIPE_SECRET_KEY.
‫Okay, und jetzt verwenden wir das.
‫Also sagen wir Streifen. Kasse. Sitzung. erstellen.
‫Und dann das übliche Optionsobjekt.
‫Alles klar, jetzt gibt es eine Menge Optionen,
‫die wir hier einstellen können.
‫Aber nur drei davon sind erforderlich.
‫Der erste sind also die Zahlungsmethodentypen.
‫Also Zahlungsmethodentypen.
‫Das ist also ein Array, in dem wir mehrere
‫Typen angeben können und Karte für Kreditkarte ist.
‫Und das sind im Moment eigentlich
‫alle Zahlungsoptionen, die wir für den Stripe-Checkout verwenden können.
‫Aber ich habe gelesen, dass sie in Zukunft noch viel mehr hinzufügen werden.
‫So können Sie sich darüber informieren.
‫Dann müssen wir die Erfolgs-URL angeben.
‫Das ist also im Grunde die URL,
‫die aufgerufen wird, sobald eine Kreditkarte erfolgreich belastet wurde.
‫Sobald der Kauf erfolgreich war, wird der
‫Benutzer auf diese URL weitergeleitet.
‫Und jetzt legen wir das einfach als unsere Homepage fest.
‫Alles klar, und das machen wir
‫wie zuvor mit req. Protokoll:// und dann
‫anfordern. den Gastgeber bekommen.
‫Also im Grunde nur unsere Home-URL.
‫Dann müssen wir auch die Abbruch-URL angeben.
‫Also einfach so.
‫Und dieser wird ähnlich sein.
‫Im Grunde ist es die Seite,
‫auf die der Benutzer geht, wenn er die aktuelle Zahlung storniert.
‫Und bringen wir sie tatsächlich dazu, auf die Tourseite zu
‫gehen, auf der sie sich zuvor befanden.
‫Und das ist im Grunde Tour/Tour. Schnecke.
‫Als nächstes können wir auch die Kunden-E-Mail angeben.
‫Und das ist sehr praktisch, denn natürlich haben wir bereits
‫Zugriff auf die E-Mail des Kunden.
‫Damit können wir dem Benutzer einen Schritt sparen
‫und das Bezahlerlebnis viel reibungsloser machen.
‫Also denken Sie daran, dass dies eine geschützte Route ist.
‫Und so kommt der User wie immer schon auf die Anfrage.
‫Und so können wir Bitte sagen. Nutzer. Email.
‫Als nächstes können wir
‫dann auch ein benutzerdefiniertes Feld angeben, das als Client-Referenz-ID bezeichnet wird.
‫Und das klingt ein bisschen komisch,
‫aber eigentlich wird es für uns wirklich wichtig.
‫In diesem Feld können wir
‫also einige Daten über die Sitzung eingeben, die wir gerade erstellen.
‫Und das ist wichtig, denn später, nach
‫erfolgreichem Kauf, erhalten wir
‫dann wieder Zugriff auf das Sitzungsobjekt.
‫Und bis dahin wollen wir eine neue Buchung
‫in unserer Datenbank anlegen.
‫Denken Sie also an das Diagramm,
‫das ich Ihnen in der letzten Vorlesung gezeigt habe.
‫Im Grunde spreche ich hier
‫von dem letzten Schritt in diesem Diagramm.
‫Denken Sie auch daran, dass
‫dies nur mit bereitgestellten Websites funktioniert.
‫Aber trotzdem, bereiten wir uns hier schon darauf vor.
‫Okay, um eine neue Buchung in unserer
‫Datenbank zu erstellen, benötigen wir die Benutzer-ID, die Tour-ID und den Preis.
‫Erinnere dich daran?
‫Und in dieser
‫Sitzung haben wir bereits Zugriff auf die
‫E-Mail des Benutzers und können daraus
‫dann die ID des Benutzers neu erstellen, da die E-Mail hier eindeutig ist.
‫Auch den Preis der Tour werden wir
‫hier gleich angeben und so fehlt dann nur noch die Tour-ID.
‫Und das ist es, was wir hier in diesem benutzerdefinierten
‫Feld im Grunde angeben werden.
‫Das nennt man Client-Referenz-ID.
‫Und all das, was ich gerade erklärt habe, wird tatsächlich viel mehr
‫Sinn machen, wenn wir den
‫letzten Schritt des Erstellens einer Buchung
‫in der Datenbank tatsächlich implementieren, oder?
‫Wie auch immer, diese Tour-ID ist auf Anfrage. Parameter. tourId.
‫In Ordnung, und jetzt
‫werden wir endlich einige Details zum Produkt selbst angeben.
‫So unsere Tour in diesem Fall.
‫Und das nennt man
‫Zeilenelemente, die ein Array von Objekten akzeptieren.
‫Also im Grunde einer pro Artikel
‫und in unserem Fall wird das nur einer sein.
‫Wir müssen also den Namen des
‫Produkts angeben und das ist bei Tour. Namen und wie immer fügen wir auch
‫die Tour zu diesem Namen hinzu.
‫Dann können wir auch eine Beschreibung angeben.
‫Und all diese Feldnamen hier kommen wirklich von Stripe.
‫Wir können also keine eigenen Felder bilden.
‫Wenn Sie also versuchen, dies zu tun, werden Sie wirklich einen Fehler bekommen.
‫In Ordnung, also in die Beschreibung werde ich die Tourzusammenfassung
‫einfügen, also einen schönen kurzen Satz,
‫der jede Tour beschreibt.
‫Dann können wir auch ein Array von Bildern angeben.
‫Jetzt müssen diese Bilder hier Live-Bilder sein.
‫Im Grunde also Bilder, die im Internet
‫gehostet werden, da Stripe dieses Bild tatsächlich
‫auf seinen eigenen Server hochlädt.
‫Dies ist also eines der Dinge, die
‫wir erst dann wirklich tun können, wenn die Website bereitgestellt ist.
‫Aber als Platzhalter werde ich vorerst grundsätzlich die von
‫unserer gehosteten Beispiel-Website auf natours verwenden. dev.
‫Gehen wir also zu dieser Website.
‫Das ist also dieser bei natours. dev.
‫Und das Bild, das ich wählen werde, ist das Titelbild.
‫Sehen wir uns also dieses Bild an.
‫Also diese hier und Linkadresse hier kopieren.
‫Gut.
‫Dies ist also ein
‫Array, weil wir mehrere Bilder angeben können, aber wir wollen wirklich nur eines davon.
‫Und tatsächlich haben wir Natur. dev/images/tours und dann den
‫Namen des Images.
‫Und diese werde ich einfach durch Tour ersetzen. Bild-Cover.
‫Und das wird funktionieren,
‫weil die Namen der Bilder auf natours sind. dev sind genau die gleichen, die wir hier
‫in unserem Projekt haben.
‫Also Tour. BildAbdeckung.
‫Dies ist also
‫eine weitere Sache, die wir tatsächlich ändern müssen, sobald wir unsere Website in Produktion nehmen.
‫Und ich führe tatsächlich eine
‫Liste von dem Zeug, damit wir nichts vergessen.
‫Wie auch immer, als nächstes kommt die Menge.
‫Also im Grunde der Preis des
‫Produkts, das gekauft wird.
‫Das ist also Tour. Preis und jetzt müssen
‫wir das mit 100 multiplizieren.
‫Denn dieser Betrag soll in Cent angegeben werden.
‫Und so hat ein Dollar oder ein Euro oder
‫wirklich die meisten Währungen 100 Cent.
‫Ein Dollar entspricht also 100 Cent.
‫Um es in Cent umzurechnen, multiplizieren Sie es einfach mit 100.
‫Dann müssen wir auch die Währung angeben.
‫Und das ist in diesem Fall USD.
‫Aber es könnte auch so
‫sein, für Euro ist es EUR und für andere Währungen sollten Sie
‫wahrscheinlich einen Blick in die Dokumentation werfen.
‫Ich kann also natürlich
‫nicht alle Währungen abdecken, die es gibt, oder?
‫Wie auch immer, schließlich geben wir auch die Menge an.
‫Und das ist in diesem Fall nur eine Tour.
‫Das ist es also tatsächlich.
‫Dieser Teil hier ist
‫also im Grunde die Information über die Sitzung selbst.
‫Und dann sind hier
‫die Informationen über das Produkt, das der Benutzer kaufen möchte.
‫In Ordnung, jetzt speichern wir die Sitzung tatsächlich.
‫Also const session und nun warten
‫wir darauf.
‫Das Erstellen hier gibt also im Grunde eine
‫Prämisse zurück, da das Festlegen all dieser Optionen
‫hier im Grunde einen API-Aufruf
‫an Stripe ausführt, und das ist dann natürlich
‫eine asynchrone Funktion, auf die wir hier warten sollten.
‫Okay, aber wie auch immer,
‫dies ist jetzt unsere Sitzung und der letzte Schritt
‫ist natürlich, sie an den Kunden zurückzusenden.
‫Der Status ist
‫also wie immer Erfolg.
‫Und dann senden wir die Sitzung einfach so.
‫Alles klar, das sollte es eigentlich sein.
‫Unser Router ist bereits konfiguriert und ich
‫denke, wir könnten
‫das jetzt tatsächlich im Postboten ausprobieren.
‫Okay, jetzt, später, werden
‫wir natürlich niemandem erlauben, dies mit dem Postboten zu tun,
‫weil das nicht viel Sinn macht.
‫Aber jetzt, da wir das
‫nur testen, macht es wirklich viel Sinn.
‫In Ordnung, also gehen
‫wir zum Postboten und erstellen eine brandneue Anfrage.
‫Das wird also bei den
‫Buchungen sein / äh, ich bin mir nicht wirklich sicher.
‫Ja, also Checkout-Sitzung und dann /tourId.
‫In Ordnung, also lass uns unsere Touren hier bekommen.
‫Um die ID von dort im Grunde zu bekommen.
‫Also machen wir den Sea Explorer.
‫Okay, und das sollte eigentlich reichen.
‫Oh warte, wir sind natürlich nicht eingeloggt.
‫Loggen Sie sich also hier ein.
‫Jetzt sind wir im Adminbereich, aber
‫lassen Sie uns hier jemand anderen verwenden.
‫Und ich denke, wir haben Leo
‫schon früher verwendet, also verwenden wir jetzt diesen Benutzer.
‫Jetzt haben wir ein falsches Passwort.
‫Alles klar, also schauen wir mal, was wir noch haben.
‫Also, was andere Benutzer könnten wir verwenden.
‫Und tatsächlich verwenden wir hier Monica.
‫Warum nicht?
‫Hoffentlich ist ihr Passwort richtig.
‫Nun, versuchen wir tatsächlich, dies hier
‫durch test1234 zu ersetzen.
‫Nun, vielleicht haben wir die
‫Passwörter all dieser Benutzer schon in einigen anderen Vorlesungen geändert.
‫Lassen Sie uns hier John verwenden.
‫Ich weiß also, dass wir John nie benutzt
‫haben, also muss es jetzt funktionieren.
‫Oh, ich sehe tatsächlich den Fehler, den ich gerade gemacht habe.
‫Hier ist es also nicht natours, es muss ein Beispiel sein. com.
‫Versuchen wir es also noch einmal mit Monica hier.
‫Oder wirklich nur mit John.
‫Das ist schwieriger als ich erwartet hatte.
‫Aber jetzt sind wir endlich eingeloggt.
‫Alles klar, und
‫damit versuchen wir, unsere Checkout-Sitzung zu erhalten.
‫Uns fehlt die Berechtigung von hier.
‫Noch einmal, und jetzt bekommen wir hier einen echten Fehler.
‫Also etwas, das wirklich aus dem Code kommt,
‫den wir gerade geschrieben haben.
‫Gut.
‫Lassen Sie uns das also überprüfen.
‫Und das Problem ist, dass es hier tatsächlich Sitzungen sind.
‫Also Streifen. Kasse. Sitzungen.
‫Ein Mal noch.
‫Diesmal dauert es viel länger, was ein gutes Zeichen ist.
‫Und wir haben einen weiteren Fehler.
‫Zeile 15 kann also keinen Slug des Knotens lesen.
‫Okay, das ist sicher seltsam, denn auf dieser
‫Tour sollte es eine Schnecke geben.
‫Also äh ja, Sie sehen, dass es
‫hier tatsächlich ist.
‫Vielleicht ist also beim
‫Lesen dieser Tour etwas schief gelaufen.
‫Was ich nicht wirklich verstehen kann, warum das so sein soll.
‫Aber versuchen wir einfach, die Tour auf der Konsole zu loggen.
‫In Ordnung, und tatsächlich bekommen wir null.
‫Was wahrscheinlich bedeutet, dass
‫eine Tour-ID nicht richtig definiert ist.
‫Oh, hier ist das Problem.
‫Also habe ich es, ID nur
‫in Großbuchstaben, aber hier im Controller habe ich das D in Kleinbuchstaben.
‫Also so.
‫Und das sind
‫die kleinen Fehler, die offensichtlich die ganze Zeit passieren.
‫Mal sehen, was als nächstes kommt.
‫Oh, und diesmal haben wir es richtig gemacht.
‫Sie sehen, das ist die Sitzung, die wir gerade erstellt haben.
‫Und es bearbeitet hier noch einige andere Sachen, aber das ist für
‫uns im Moment nicht wirklich wichtig.
‫Wirklich interessant zu sehen ist jedoch, dass
‫wir diese Zahlung
‫oder zumindest diese Zahlungsaufforderung bereits jetzt
‫sehen können, sagen wir in unseren Drive-Dashboards.
‫Wenn wir also dorthin
‫gehen und zu Zahlungen und dann zu allen gehen, werden Sie
‫sehen, dass das letzte hier tatsächlich gerade passiert ist.
‫Wenn wir also darauf klicken, werden Ihnen einige Daten darüber angezeigt.
‫So sieht man zum Beispiel, dass es eigentlich um die
‫Sea Explorer Tour geht.
‫Sie haben auch den Preis, Sie haben auch das Bild.
‫Wahrscheinlich auch einige Daten über den Benutzer.
‫Und eigentlich nein, nicht wirklich.
‫Aber was hier zählt, ist, dass es unvollständig heißt.
‫Und das liegt daran, dass wir nur die Checkout-Sitzung
‫auf dem Server erstellt haben.
‫Und so fehlt
‫uns der zweite Schritt, in dem
‫wir dann die Kreditkarte auf Kundenseite tatsächlich belasten.
‫Da uns das fehlt, machen
‫wir es im nächsten Video tatsächlich richtig.