Zahlungen im Versandhandel/Telefonauftrag (MOTO)
JS library unterstützt auch Mail Order & Telephone Order (MOTO). MOTO ermöglicht unseren Händlern die Annahme und Verwaltung von Zahlungskartendaten per Telefon oder Mail, wenn die Karte des Kunden nicht physisch anwesend ist.
Bevor Sie mit MOTO beginnen, vergewissern Sie sich bitte, dass Sie eine Acquiring-Händler-ID haben, die MOTO unterstützt, und dass Ihr sitereference mit einem MOTO Konto konfiguriert wurde. Wenn Sie unsicher sind, wenden Sie sich bitte an unser Support-Team, um weitere Informationen zu erhalten.
Annahme von Zahlungen MOTO
Um MOTO Zahlungen akzeptieren zu können, müssen Sie die Kartenkomponenten von JS library integrieren. Bitte beachten Sie: Dies sind dieselben Kartenkomponenten, die von Händlern verwendet werden, die Zahlungen im elektronischen Handel (ECOM) akzeptieren.
Hinzufügen von JS-Kartenkomponenten zu Ihrer Zahlungsseite
Um Ihrer Zahlungsseite Kartenkomponenten hinzuzufügen, gehen Sie wie folgt vor:
Zahlungsformular hinzufügen
Beginnen Sie damit, unser Zahlungsformular in Ihr HTML einzufügen. Zum Beispiel:
<html>
<head>
</head>
<body>
<form id="st-form" action="https://www.example.com" method="POST">
<div id="st-card-number"></div>
<div id="st-expiration-date"></div>
<div id="st-security-code"></div>
<button type="submit">Pay securely</button>
</form>
</body>
</html>
Wenn Sie die ID des Formulars ändern müssen, damit sie nicht "st-form" lautet, können Sie in unserem Konfigurationshandbuch nach formId suchen. Die Container-IDs der Kartenkomponenten, z. B. st-card-number müssen jedoch dieselben sein wie im obigen Beispiel.
Initialisieren Sie JS und rufen Sie die Methode Components auf
Um die Kartenkomponenten zu rendern, müssen Sie unsere Bibliothek von Trust Payments CDN abrufen und innerhalb einer anonymen Funktion eine Instanz von SecureTrading erstellen . Der SecureTrading Konstruktor akzeptiert ein Konfigurationsobjekt, das einen jwt-Schlüssel mit einem signierten JSON Web Token (JWT)-Wert enthalten muss, der auf Ihrem Händlerserver erstellt wurde. Das jwt payload enthält alle Informationen über die Zahlungstransaktion, z. B. Betrag, Rechnungsstellung, Lieferung und Kontotyp, d. h. MOTO, usw.
Durch den Aufruf von st.Componentsaufruft, wobei st auf Ihre Instanz von SecureTrading verweist, bettet die Bibliothek jede Kartenkomponente (pan, Ablaufdatum, cvv) in das Zahlungsformular innerhalb des Wurzelcontainers ein, z.B. st-card-number wird die pan Eingabekomponente enthalten.
Zum Beispiel:
<html>
<head>
</head>
<body>
<div id="st-notification-frame"></div>
<form id="st-form" action="https://www.example.com" method="POST">
<div id="st-card-number"></div>
<div id="st-expiration-date"></div>
<div id="st-security-code" data-st-input-optional="true"></div>
<button type="submit">Pay securely</button>
</form>
<script src="https://cdn.eu.trustpayments.com/js/latest/st.js"></script>
<script>
(function() {
var st = SecureTrading({
jwt : 'A signed JWT created on the merchant server'
});
st.Components();
})();
</script>
</body>
</html>Wenn Sie Content Delivery Network (CDN) verwenden, um aufjs library zu verweisen, beachten Sie, dass CDN Anfragen von Ihrer localhost/127.0.0.1-Umgebung blockieren wird. Um Ihre Anwendung lokal mit CDN zu testen, müssen Sie Ihre Testanwendung mit Ihrer IPv4-Adresse und nicht mit localhost ausführen. Nachdem Sie Ihre IPv4-Adresse nachgeschlagen haben, müssen Sie localhost in Ihrem Browser durch die ermittelte IP-Adresse ersetzen.
Annahme von MOTO Zahlungen ohne CVV
Für Zahlungen im Rahmen von Mail Order/Telephone Order (MOTO) benötigen Sie möglicherweise nicht immer den Kartenprüfwert (CVV) oder haben ihn nicht zur Verfügung. Aus diesem Grund können Sie auf JS library das CVV-Feld in unserem Zahlungsformular als optional konfigurieren. Um die CVV als optional zu konfigurieren, befolgen Sie die unten beschriebenen Schritte:
Datenattribut zum CVV-Root-Container hinzufügen
Durch das Setzen des Datenattributs data-st-input-optional="true" im CVV-Root-Container, d.h. st-security-code wird sichergestellt, dass das Zahlungsformular abgeschickt werden kann, ohne dass zuvor ein Wert in die CVV-Eingabe eingegeben wurde.
Bitte beachten Sie: Auch nach der Einstellung des Datenattributs wird die Standard-CVV-Feldüberprüfung durchgeführt, wenn eine unvollständige oder ungültige CVV eingegeben wird.
<html>
<head>
</head>
<body>
<div id="st-notification-frame"></div>
<form id="st-form" action="https://www.example.com" method="POST">
<div id="st-card-number"></div>
<div id="st-expiration-date"></div>
<div id="st-security-code" data-st-input-optional="true"></div>
<button type="submit">Pay securely</button>
</form>
<script src="https://cdn.eu.trustpayments.com/js/latest/st.js"></script>
<script>
(function() {
var st = SecureTrading({
jwt : 'A signed JWT created on the merchant server'
});
st.Components();
})();
</script>
</body>
</html>
Sternchen aus CVV-Etikett ausblenden (optional)
Optional können Sie das Sternchen neben dem CVV-Eingabefeld entfernen, um anzuzeigen, dass die CVV nicht erforderlich ist. Um zu verhindern, dass ein Sternchen angezeigt wird, befolgen Sie bitte die unten beschriebenen Schritte:
Aktualisieren Sie Ihre Styles-Konfiguration:
Mit den in unserem JS verfügbaren Stiloptionen können Sie "display-asterisk" explizit auf false setzen securityCode Dadurch wird das Sternchen nur neben der Bezeichnung des CVV-Feldes entfernt und die anderen Bezeichnungen der Karteneingabe bleiben unverändert.
<html>
<head>
</head>
<body>
<div id="st-notification-frame"></div>
<form id="st-form" action="https://www.example.com" method="POST">
<div id="st-card-number"></div>
<div id="st-expiration-date"></div>
<div id="st-security-code" data-st-input-optional="true"></div>
<button type="submit">Pay securely</button>
</form>
<script src="https://cdn.eu.trustpayments.com/js/latest/st.js"></script>
<script>
(function() {
var st = SecureTrading({
jwt : 'A signed JWT created on the merchant server',
"styles": {
"defaultStyles": {
},
"cardNumber": {
},
"expirationDate": {
},
"securityCode": {
"display-asterisk": false,
},
});
st.Components();
})();
</script>
</body>
</html>
Vor der Live-Schaltung
- Wie bei der Verarbeitung von Kartenzahlungen im E-Commerce empfehlen wir Ihnen, Webhooks zu konfigurieren, um Ihr System über jede neue Transaktion zu informieren.
- Wenn Ihre Zahlungsseite eine Content Security Policy verwendet, überprüfen Sie bitte unsere CSP und aktualisieren Sie sie entsprechend.
- Bevor Sie Ihre Lösung für die Produktion freigeben, überprüfen Sie bitte unsere Go-Live-Checks.
