How to Braintree - Wie neben PayPal auch andere Bezahldienste wie Google Pay und Apple Pay in Websites oder Apps angesprochen werden können

Die Bezahldienste PayPal, Google Pay und Apple Pay gelten als relativ bekannt. Welche Rolle spielt Braintree dabei, Patrick?

‍
Braintree ist ein Online-Zahlungsdienstleister, der seit 2007 existiert und schnell weite Bekanntheit erlangt hat. Seit 2013 gehört Braintree zu PayPal Holdings, Inc. und bietet eine Plattform für die Abwicklung von Online-Zahlungen an. Braintree ermöglicht es dem Handel, Kreditkartenzahlungen, PayPal-Zahlungen, und auch andere Zahlungsmethoden zu akzeptieren, darunter auch digitale Wallets wie Google Pay und Apple Pay.
Braintree ist besonders bei Online-Händlern und E-Commerce-Plattformen beliebt, da es eine einfache Integration in Websites und mobile Apps ermöglicht. Handelnde können die Dienste von Braintree nutzen, um Zahlungen sicher und effizient von ihren Kund:innen entgegenzunehmen. Braintree hilft auch bei der Verarbeitung von Transaktionen, Betrugsprävention und der Verwaltung von Abrechnungen. Es fungiert sozusagen als Middleware zwischen dem Handelnden und den verschiedenen Zahlungsanbietern, einschließlich PayPal, Google Pay und Apple Pay.
Insofern spielt Braintree eine wichtige Rolle bei der Bereitstellung von Zahlungslösungen für Online-Unternehmen und trägt dazu bei, die Akzeptanz und Abwicklung von Zahlungen zu erleichtern, einschließlich bekannter Dienste wie PayPal, Google Pay und Apple Pay.

Und wo kommt dann Capacitor ins Spiel?

Capacitor ist eine Laufzeitumgebung für Webanwendungen, in der diese auf einem Smartphone oder PC (statt eines Browser) laufen können und dabei auf mehr native Funktionen dieses Gerätes, wie z.B. Push-Nachrichten, GPS oder die Kamera zugreifen können. Um das zu ermöglichen, nutzt Capacitor, sehr ähnlich wie das ältere Cordova von Apache, eine Reihe von Plugins. Diese bilden sozusagen die Brücke zwischen der Webanwendung und den nativen Gerätefunktionen, sodass die Entwickler:innen der Webanwendung kein genaueres Wissen über jede der Zielplattformen haben müssen.

Welche Zahlungsmethoden wurden bislang angeschlossen?

Bislang haben wir mit Braintree nur PayPal Zahlungen produktiv angebunden. Das Plugin ist jedoch bereits jetzt in der Lage, auch Google Pay und Apple Pay anzusprechen. Eine Erweiterung um weitere von Braintree unterstützte Zahlungsmethoden wie „Click to Pay“, „Samsung Bezahlen“ sowie „Venmo“ sollte mit einem vergleichsweise geringen Aufwand möglich sein.

Auf welche Herausforderungen bist du bei der Entwicklung des Capacitor-Plugins zur Verwendung des Braintree Gateways gestoßen?

Bei Android und iOS sind die Vorgehensweisen sehr vergleichbar. Die Schnittstellen wurden anscheinend neu überlegt und sind intuitiver. Die Entwicklung des Plugins hat sich hierfür als vergleichsweise einfach herausgestellt. Im Web hat sich das Ganze etwas schwieriger gestaltet. Die Schnittstelle dort kommt ursprünglich aus der nun veralteten PayPal checkout.js Bibliothek. Die Parameter sind dafür sind teilweise schwer verständlich dokumentiert, sodass ich mich eine ganze Weile in der Braintree Dokumentation Home - Documentation  durchwühlen musste, um zu verstehen, wie diese Schnittstelle jedoch tatsächlich funktioniert. Im Gegensatz zu Android & iOS ist beispielsweise die Handhabung des Client-Tokens für den Zugriff auf die API anders umgesetzt. Bei den mobilen Plattformen wird dieser über einen separaten Service bereitgestellt, und man kann den Braintree Client unabhängig davon erstellen. Wird der Token dann bei der Zahlung benötigt, holt der Client sich den Token vom Service. Im Web kann der Client nur direkt unter Angabe des Tokens erstellt werden, was bedeutet, dass der Workflow bei der Nutzung durch das Plugin so angepasst werden muss, dass der Client im Web zu einem anderen Zeitpunkt instanziiert werden muss, ohne dass die Nutzenden des Plugins das berücksichtigen müssen. Eine weitere Herausforderung stellten die TypeScript Types für Braintree-Web dar. Dadurch, dass Braintree Web auf JavaScript basiert, und wir in unseren Hybrid Apps unter anderem mit TypeScript arbeiten, war hierfür eine Definition der Types erforderlich. Um diese nicht selbst schreiben zu müssen, wurde auf das Paket von GitHub - DefinitelyTyped/DefinitelyTyped: The repository for high quality TypeScript type definitions.  zurückgegriffen. Auch hier stellte sich die Verwendung als herausfordernd dar, da nur dürftig dokumentiert wurde, wie diese zu nutzen sind und die Code Beispiele sich teilweise noch auf checkout.js bezogen.

Was ist der größte Vorteil deiner Implementierung?

Wie alle Capacitor-Plugins, bündelt sie die SDKs von Web, Android und iOS unter einer gemeinsamen Javascript Schnittstelle. Damit werden Entwickler:innen von Hybrid Apps einzelne Entwicklungsaufwände für jede Plattform abgenommen und erleichtert ihnen in diesem Fall die Zahlungsabwicklung für ihre Nutzenden. Mir ist es außerdem wichtig gewesen, dass wir diese Entwicklung für die Open Source Community von Capacitor verfügbar machen. Wir nutzen die Arbeit dieser Community in vieler unserer Projekte und geben so etwas von unserer eigenen Entwicklung an diese zurück. So hat jeder, der diesen Artikel liest, auch tatsächlich die Möglichkeit meine Arbeit daran nachzuvollziehen und das Plugin selbst auszuprobieren und nicht nur eine Info darüber, welche Herausforderungen ich hatte. Ich weiß, dass ich nicht der Erste bin, der genau eine solche Lösung für Braintree entwickelt hat, jedoch ist unsere Version derzeit die aktuellste und ich bin stolz darauf, dass wir sie mit der Community teilen.
Das Plugin ist unter MIT-Lizenz auf Github zu finden: PROJEKTIONISTEN

Wie lautet dein Fazit? Würdest du im Nachhinein alles genauso angehen?

Kurz gesagt: Ja. Es ist sinnvoller ein abstrakteres Plugin zu bauen als ein projektspezifisches. Wir sind somit bereits jetzt darauf vorbereitet, dieses Plugin mit wenig Aufwand zu erweitern. Außerdem könnte Apple Pay und Google Pay sogar ohne Aufwand direkt produktiv genutzt werden. Es fehlt lediglich die Freigabe im Braintree Gateway, welche in unserem Falle über einen Drittdienstleister erfolgen würde. Dieser geringe Aufwand ist aber natürlich nur möglich, sofern unsere Kunden bereits auf Capacitor umgestiegen sind.