Integration einrichten
Notiz
Für intelligente Lesegeräte wie das BBPOS WisePOS E oder der Stripe Reader S700 empfehlen wir die servergestützte Integration anstelle eines JavaScript SDK. Bei der servergestützten Integration werden Zahlungen mit der Stripe API erfasst, anstatt auf die LAN-Verbindung zu vertrauen. Das JavaScript SDK und JavaScript SDI können nicht offline betrieben werden. Sehen Sie sich unseren Plattformvergleich an und finden heraus, welche Plattform am besten zu Ihrem Unternehmen passt.
Anforderungen an das Terminal JavaScript SDK
Wenn Sie intelligente Lesegeräte mit dem JavaScript SDK integrieren, stellen Sie sicher, dass Ihr Netzwerk-Setup die folgenden Anforderungen erfüllt. Andernfalls funktioniert Ihre Terminal-Integration möglicherweise nicht wie erwartet.
- Das intelligente Lesegerät und die Anwendung, die das Terminal JavaScript SDK ausführt, sind mit dem gleichen lokalen Netzwerk verbunden.
- Ihr Netzwerk ermöglicht die DNS-Auflösung lokaler IP-Adressen. Aktualisieren Sie die DNS-Einstellungen bei Bedarf.
- Ihr WLAN-Netzwerk ist passwortgeschützt und nutzt entweder WPA-Personal oder WPA2-Personal-Verschlüsselung.
Für den Einstieg in das JavaScript SDK sind drei Schritte erforderlich:
- Installieren Sie das SDK und die Client-Bibliothek auf Ihrer Zahlungsseite
- Richten Sie den ConnectionToken-Endpoint für Ihr Backend und Ihre Webanwendung ein.
- Initialisieren Sie das SDK in Ihrer Webanwendung.
Notiz
Wenn Sie Ihre Webanwendung mit dem JavaScript SDK vernetzen, lässt diese sich in einem mobilen Browser ausführen, sofern das mobile Gerät mit dem gleichen lokalen Netzwerk verbunden ist, da das Lesegerät und die Geräte in diesem Netzwerk direkt miteinander kommunizieren können.
Installieren Sie das SDK und die Client-BibliothekClientseitigServerseitig
Clientseitig
Fügen Sie das folgende Skript auf Ihrer Bezahlseite hinzu, um zu beginnen. Das Skript muss aus Gründen der Kompatibilität mit der neuesten Software des Lesegeräts immer direkt von https://js.stripe.com geladen werden. Fügen Sie das Skript nicht in ein Bundle ein und hosten Sie selbst keine Kopie davon, da dies Ihre Integration ohne jegliche Vorwarnung unterbrechen könnte.
<script src="https://js.stripe.com/terminal/v1/"></script>
Terminal JS SDK als Modul verwenden
Wir stellen außerdem ein npm-Paket bereit, damit Sie das Terminal JS SDK als Modul laden und verwenden können. Weitere Informationen finden Sie im Projekt auf GitHub.
Notiz
Informationen zur Migration von Beta-Versionen des JavaScript SDK finden Sie im Migrationsleitfaden für Stripe Terminal Beta.
Serverseitig
Nutzen Sie unsere offiziellen Bibliotheken für den Zugriff auf die Stripe API über Ihre Anwendung:
ConnectionToken-Endpoint einrichtenServerseitigClientseitig
Serverseitig
Um sich mit einem Lesegerät verbinden zu können, muss das Backend dem SDK erlauben, das Lesegerät in Ihrem Stripe-Konto zu nutzen. Dazu stellt es dem SDK das Geheimnis aus einem ConnectionToken zur Verfügung. Das Backend muss nur Verbindungstoken für vertrauenswürdige Clients erstellen.
Beziehen Sie das Geheimnis aus dem ConnectionToken auf Ihrem Server und übergeben Sie es an den Client.
Vorsicht
Mit dem Geheimnis aus dem ConnectionToken auf Ihrem Server können Sie sich mit einem Stripe Terminal-Lesegerät verbinden und Zahlungen mit Ihrem Stripe-Konto annehmen. Stellen Sie sicher, dass Sie den Endpoint zum Erstellen von Verbindungstoken authentifizieren und diesen vor Cross Site Request Forgery (CSRF) schützen.
Clientseitig
Um dem SDK Zugriff auf diesen Endpoint zu ermöglichen, erstellen Sie eine Funktion in Ihrer Webanwendung, die einen ConnectionToken aus Ihrem Backend anfordert und das secret
aus dem ConnectionToken-Objekt zurückgibt.
async function fetchConnectionToken() { // Your backend should call /v1/terminal/connection_tokens and return the JSON response from Stripe const response = await fetch('https://{{YOUR_BACKEND_URL}}/connection_token', { method: "POST" }); const data = await response.json(); return data.secret; }
Diese Funktion wird aufgerufen, wenn das SDK sich bei Stripe oder dem Lesegerät authentifizieren muss. Sie wird auch aufgerufen, wenn ein neues Verbindungstoken benötigt wird, um sich mit einem Lesegerät zu verbinden (z. B. wenn Ihre App sich von einem Lesegerät getrennt hat). Wenn das SDK kein neues Verbindungstoken von Ihrem Backend abrufen kann, schlägt die Verbindung zu einem Lesegerät mit einem Fehler von Ihrem Server fehl.
Vorsicht
Speichern Sie das Verbindungstoken nicht im Cache und codieren Sie es nicht fest. Der Lebenszyklus des Verbindungstokens wird vom SDK verwaltet.
SDK initialisierenClientseitig
Das vom SDK bereitgestellte StripeTerminal
-Objekt verfügt über eine allgemeine Nutzeroberfläche für die Suche nach Lesegeräten, die Verbindung mit einem Lesegerät und die Erstellung von Zahlungen. Um eine StripeTerminal
-Instanz in Ihrer JavaScript-Anwendung zu initialisieren, geben Sie die in Schritt 2 implementierte ConnectionToken-Funktion an.
Sie müssen auch eine Funktion bereitstellen, die eine unerwartete Trennung vom Lesegerät handhabt, onUnexpectedReaderDisconnect
. Mit dieser Funktion muss Ihre Anwendung die Nutzer/innen darüber informieren, dass die Verbindung zum Lesegerät getrennt wurde. Zusätzlich können Sie auch eine Funktion einfügen, mit der die Verbindungswiederherstellung zu einem Lesegerät versucht wird. Mehr Informationen finden Sie unter Verbindungstrennung handhaben.
const terminal = StripeTerminal.create({ onFetchConnectionToken: fetchConnectionToken, onUnexpectedReaderDisconnect: unexpectedDisconnect, }); function unexpectedDisconnect() { // You might want to display UI to notify the user and start re-discovering readers }
SDK-Aktualisierungen
Stripe veröffentlicht regelmäßig Updates, die neue Funktionen, Fehlerkorrekturen und Sicherheitsupdates enthalten können. Aktualisieren Sie Ihr SDK, sobald eine neue Version verfügbar ist. Die derzeit verfügbaren SDKs sind:
- Stripe Terminal Android SDK
- Stripe Terminal iOS SDK
- Stripe Terminal JavaScript SDK
- Stripe Terminal React Native SDK
Nächste Schritte
Unterstützte Browser
Das Stripe Terminal JavaScript SDK unterstützt nach Möglichkeit alle neuesten Versionen der gängigen Browser. Wir unterstützen:
- Edge unter Windows
- Firefox auf Desktop-Plattformen
- Chrome und Safari auf allen Plattformen
- Android-Browser auf Android 4.4 und neuer
Wenn Sie Probleme mit dem Stripe Terminal JavaScript SDK in Verbindung mit einem bestimmten Browser haben, kontaktieren Sie uns bitte per E-Mail unter support-terminal@stripe.com.
Vorsicht
Hinweis: Die Verwendung des Stripe Terminal JavaScript SDK mit React Native wird nicht unterstützt. Um Stripe Terminal mit React Native in Ihre mobile App zu integrieren, verwenden Sie das Stripe Terminal React Native SDK.