Der ultimative Leitfaden für die Einrichtung von Stripe-Abonnements und Gutscheinen

By Stripe Developers · 2024-03-11

In dieser Ausgabe der Stripe Developer Office Hours geht es um die Integration von Gutscheinen in den Anmeldeprozess von Unternehmen, die Stripe-Abonnements nutzen. Hier erfahren Sie, wie Sie Ihren Kunden die Möglichkeit bieten, Gutscheincodes einzulösen und Rabatte auf ihre Abonnements zu erhalten.

Einrichten eines Unternehmens mit Stripe-Abonnements und Gutscheinen

  • Hallo, ich bin Ali, und dies ist eine weitere Ausgabe der Stripe Developer Office Hours. Wir gehen gerade durch beispiellose Zeiten, und Unternehmen müssen sehr schnell auf sich schnell verändernde Umstände reagieren. Bei Stripe ist es unsere Priorität, sicherzustellen, dass Sie Ihren Kunden weiterhin Dienstleistungen anbieten können und dass Ihre Zahlungsinfrastruktur zuverlässig bleibt. Besonders Unternehmen mit wiederkehrenden Geschäftsmodellen möchten ihren Kunden verständlicherweise in den nächsten Monaten etwas Komfort und Entlastung bieten. Heute werden wir behandeln, wie ein Unternehmen, das Stripe-Abonnements verwendet, Gutscheine in ihren Anmeldeprozess integrieren kann.

  • Wir werden damit beginnen, eine Webintegration zu erstellen, die Stripe-Elemente verwendet und Abonnements erstellt. Anschließend werden wir die Unterstützung für Gutscheine in unsere Integration einfügen, damit Kunden beim Anmelden einen Gutscheincode eingeben und einen Rabatt auf ihr Abonnement erhalten können.

  • Willkommen zurück zu den Stripe Developer Office Hours. Ich bin Ali, und lassen Sie uns beginnen. Wir werden traxionly verwenden, um unseren Grundcode einzurichten. Ich habe bereits Stripe CLI auf meiner Seite eingerichtet, also werde ich 'stripe samples create' ausführen. Es fragt uns nach der serverseitigen Sprache, die wir verwenden werden, also wähle ich Ruby. Wir haben jetzt einen neuen Ordner. Lassen Sie uns hineingehen. Dieser Ordner enthält zwei Unterordner, einen für die Implementierung auf der Clientseite und einen für die Serverimplementierung. Öffnen wir diesen Ordner in Visual Studio Code.

  • Was wir hier haben, sind zwei Ordner. In einem haben wir unsere HTML-Javascript-Dateien, das ist die Clientseite, und dann haben wir eine server.rb-Datei in unserem Server, die unseren serverseitigen Code enthält. Alles, was dies im Moment tut, ist, dass es das Stripe-Gem, das Sinatra-Gem und die 'dotenv'-Datei importiert, die wir verwenden werden, um mit unserer serverseitigen Integration zu beginnen.

  • Ich werde hier hereinspringen und in den Serverordner wechseln, um die Ruby-Gems zu installieren, die wir angegeben haben. Ich werde 'bundle install' im speziellen Pfad hier im 'vendor/bundle'-Ordner ausführen. Es sieht so aus, als ob das funktioniert hat. Es gab zwar einen Fehler, aber das können wir jetzt ignorieren. Ich bin mir ziemlich sicher, dass das Gem korrekt installiert wurde. Ich werde auch die 'index.html'-Datei öffnen und das ausprobieren. Ich werde 'Ruby server.rb' aufrufen, und der Server läuft. Ich werde ein neues Fenster erstellen, das hier einfügen und zu 'localhost:4242' navigieren. Das ist die 'index.html'-Seite, die über unseren lokalen Webserver bereitgestellt wird. Das sieht großartig aus.

  • Lassen Sie uns einige Anpassungen vornehmen. Wir nennen das jetzt 'Abonnements mit Gutscheinen Demo'. Wir aktualisieren die Seite. Ich werde auch diese Datei tatsächlich umbenennen und von einer HTML-Datei zu einer RB-Datei ändern. Wir werden tatsächlich RB-Templates für diese Demo verwenden, also ist es wirklich hilfreich, jetzt einfach umzuschalten. Ich gehe zurück zu unserer 'server.rb'-Datei und anstatt die HTML-Datei zurückzugeben, die wir nicht mehr haben, werden wir das ERP für den Index zurückgeben. Für diese Demo werden wir auch den '/webhook'-Endpunkt nicht verwenden. Wir werden das nicht benutzen und die Dinge vorerst vereinfachen. Außerdem verwenden wir die 'dotenv' zum Laden der '.env'-Datei, und aus der '.env'-Datei nehmen wir den Wert für den Stripe-Geheimschlüssel. Das erinnert mich daran, in meine '.env'-Datei zu gehen und hier möchte ich meinen veröffentlichten Schlüssel ersetzen und hier möchte ich meinen geheimen Stripe-Schlüssel hinzufügen. Wir werden den Webhook-Geheimschlüssel nicht verwenden, also werde ich das nicht berühren. Alles andere ist in Ordnung. Lassen Sie uns unseren Server neu starten und dies neu laden, und wir können sehen, dass das immer noch in Arbeitsordnung ist.

  • Um kurz zu verdeutlichen, welche nächsten Schritte wir unternehmen werden: Zunächst werden wir Stripe-Elemente zu unserer 'index.rb'-Datei hinzufügen. Wir können einstufen. Wir werden Rep-GS importieren. Wir werden eine Instanz von Stripe-Elementen erstellen und eine Instanz des Kartelements einbinden. Wir richten einen Button auf der Clientseite ein, der 'Abonnieren' heißt, und wenn dieser Button gedrückt wird, tokenisieren wir die Zahlungsmethode, die Karte im Wesentlichen, die in das Kartelement eingegeben wurde, und übermitteln das an unseren Server. Auf der Serverseite werden wir einen '/abonnieren'-Endpunkt haben. Der 'Abonnieren'-Endpunkt wird die tokenisierte Zahlungsmethode, die von der Clientseite übergeben wurde, entgegennehmen. Wir werden sie an einen Stripe-Kunden anhängen und ein Stripe-Abonnement auf diesem Kundenobjekt erstellen. Lassen Sie uns starten. Bevor ich das schnell mache, muss ich tatsächlich eine neue Datei erstellen. Ich werde eine benutzerdefinierte CSS-Datei erstellen, um unsere UI-Elemente etwas besser zu identifizieren, und ich werde sie CSS nennen. In unserer 'index.erb'-Datei werde ich einfach einen Link zu dieser CSS-Datei einfügen, damit wir diese importiert haben. Innerhalb unserer Webseite werden wir ein 'div'-Tag erstellen, und es wird eine ID des Kartelements haben. Das 'div'-Tag schließen. Ich werde hier einen Kommentar einfügen, warum wir das machen. Wir binden das Kartelement hier ein. Lassen Sie uns auch einen Button 'Abonnieren' erstellen. Dieser Button wird einfach 'Abonnieren' sagen. Wir können auch ein Label hinzufügen, das 'Fehlerlabel' nennen, und der Grund, warum wir das tun, ist es ist hilfreich, Fehler in einer UI anzuzeigen.

Einrichten eines Unternehmens mit Stripe-Abonnements und Gutscheinen
Einrichten eines Unternehmens mit Stripe-Abonnements und Gutscheinen

Einrichten von Stripe-Elementen in einer Javascript-Integration

  • Zunächst einmal ist es wichtig, dass wir das Stripe JS-Skript einbinden, um die Stripe-Elemente zu initialisieren.

  • Wir erstellen ein Div-Element für die Kartendarstellung, fügen einen Abonnieren-Button hinzu und kennzeichnen dies.

  • Als nächstes initialisieren wir die Stripe-Elemente, indem wir das Stripe JS3-Skript einbinden.

  • Wir erstellen die Karte und fügen diese über das Stripe-Element hinzu, wobei wir auch eine Option zur Deaktivierung der Postleitzahl hinzufügen, um die Testbarkeit zu verbessern.

  • Wir zeigen die Montage der Stripe-Elemente auf der Webseite an und fügen eine Ereignisbehandlung für den Abonnieren-Button hinzu.

  • Sobald der Abonnieren-Button geklickt wird, tokenisieren wir die eingegebene Karte, rufen die Zahlungsmethode von Stripe ab und behandeln den Erfolg oder Fehler entsprechend.

  • Schließlich implementieren wir die Server-seitige Anbindung, um die Zahlungsmethode an den Kunden anzuhängen und ein Abonnement zu erstellen.

Einrichten von Stripe-Elementen in einer Javascript-Integration
Einrichten von Stripe-Elementen in einer Javascript-Integration

Programmierung eines Abonnement-Services mit Stripe in Ruby

  • Wir werden den Namen des Teams und die Zahlungsmethode ID symbolisieren

  • Der Parameter, den wir auswerten möchten, ist die Zahlungsmethode, denn das ist der Parameter, den uns die Benutzeroberfläche schickt und es ist auch für die Lesbarkeit und zur Fehlerbehebung wichtig

  • Wir werden die Zahlungsmethode ID ausgeben, damit wir sie in unserem Terminalfenster sehen können

  • Durch die Verwendung eines 'Try-Catch' Blocks können wir Fehler abfangen

  • Zuerst erstellen wir einen Kunden, indem wir 'stripe' aufrufen

  • Anschließend rufen wir 'stripe customer.create' auf, um einen Kunden zu erstellen und die Zahlungsmethode daran anzuhängen

  • Wir geben außerdem eine Beschreibung an, optional, aber nennen sie 'Bürozeiten-Kunde'

  • Wir geben die Kunden-ID aus

  • Als nächstes erstellen wir ein Abonnement, indem wir 'stripe subscription.create' aufrufen

  • Es gibt einige erforderliche Parameter bei diesem Aufruf, wie z.B. den Kunden, die zu belastende Standardzahlungsmethode und die Abonnementartikel

  • Der Artikel-Parameter akzeptiert ein Array von Hashes

  • Nachdem wir das Abonnement erstellt haben, geben wir die Abonnement-ID aus und kehren eine Status 200 zurück, zusammen mit dem gesamten Abonnementobjekt als JSON

  • Wir fügen auch eine Fehlerbehandlung hinzu, um Fehler zu loggen und eine entsprechende Meldung zurückzugeben

Programmierung eines Abonnement-Services mit Stripe in Ruby
Programmierung eines Abonnement-Services mit Stripe in Ruby

Erweitern der Stripe-Abonnementfunktionalität

Erweitern der Stripe-Abonnementfunktionalität
Erweitern der Stripe-Abonnementfunktionalität

Schrittleitung für die Integration von Gutscheincodes in Stripe-Demos

  • Bevor wir mit der Schrittleitung beginnen, lassen Sie uns überprüfen, ob die Daten gültig sind, um sicherzustellen, dass der angewendete Gutscheincode korrekt ist.

  • Wenn die Daten gültig sind, möchten wir das Label 'Gutschein angewendet' anzeigen und den angewendeten Gutschein als Variable 'coupon' referenzieren.

  • Wenn ein Fluggutschein noch nicht initialisiert wurde, initialisieren wir ihn hier als 'flight coupon' und setzen ihn auf 'null'.

  • Wenn die Daten ungültig sind, zeigen wir 'Ungültiger Gutschein' an und folgen dem vorherigen Satz. Anschließend starten wir den Server neu und aktualisieren die Seite, um den Gutschein 'ABC' anzuwenden.

  • Wenn der Gutschein ungültig ist, probieren wir einen anderen aus, z.B. 'stay safe'. Sobald der Gutschein angewendet wurde, müssen wir ihn zusammen mit dem Abonnement-Erstellungsantrag senden, damit der Benutzer den Rabatt erhält.

  • Im Backend müssen wir einen Parameter namens 'coupon name' übergeben, der den angewendeten Gutschein enthält, sofern vorhanden, andernfalls sollte er ein leerer String sein.

  • Des Weiteren fügen wir einen neuen Schritt hinzu, um den angewendeten Gutschein dem Abonnement hinzuzufügen.

  • In der Abonnementstatusseite fügen wir ein weiteres Element hinzu, das den Namen des angewendeten Gutscheins anzeigt, falls vorhanden.

  • Abschließend wurde auch auf zusätzliche Ressourcen von Stripe sowie auf Feedback- und Supportmöglichkeiten hingewiesen.

Schrittleitung für die Integration von Gutscheincodes in Stripe-Demos
Schrittleitung für die Integration von Gutscheincodes in Stripe-Demos

Conclusion:

Mit diesem Leitfaden haben Sie alle notwendigen Schritte kennengelernt, um Ihr Unternehmen mit Stripe-Abonnements und Gutscheinen auszustatten. Die Integration von Gutscheinen in Ihren Anmeldeprozess bietet Ihren Kunden zusätzlichen Komfort und Entlastung. Sie sind jetzt bereit, Gutscheine in Ihrem Abonnementdienst zu implementieren und Ihren Kunden attraktive Angebote zu bieten.

Q & A

Stripe-AbonnementsGutscheineinbindungRabatte auf AbonnementsWebintegration mit GutscheinenStripe Developer Office Hours
Wie gründe ich eine Agentur für Kurzform-Inhalte in 2023?Warum Netflix 50% Rabatt anbietet und wie es die Zukunft des Streaming-Dienstes beeinflusst

@Heicarbook All rights reserved.