Conversion

Eingebetteter Krypto-Checkout vs. Weiterleitung: Umwandlung und Kompromisse

Eingebetteter Krypto-Checkout vs. Weiterleitung: Wie jedes Modell Umwandlung, Kontrolle und Aufwand beeinflusst. Qvard-Widget ist jetzt live. Vergleichen und wählen.

Ein eingebetteter Krypto-Checkout hält die Zahlung auf Ihrer Seite, während eine Weiterleitung den Kunden auf eine gehostete Seite schickt. Jedes Modell hat Kompromisse bei Umwandlung, Kontrolle und Aufwand. Das eingebettete Qvard-Widget ist jetzt live, daher vergleicht dieser Leitfaden beide Modelle und zeigt, wie man wählt.

Was bedeutet ein eingebetteter Checkout

Ein eingebetteter Checkout ist ein Zahlungsfenster, das sich direkt auf Ihrer Seite über ein JavaScript-Widget öffnet. Es kann ein modales Fenster oder ein eingebettetes Formular sein. Der Kunde bleibt im Kontext Ihrer Website und zahlt, ohne sie zu verlassen. Die Zahlungslogik ist dieselbe wie auf einer gehosteten Seite; nur die Darstellung unterscheidet sich.

Wie es bei Qvard funktioniert

Das Widget wird von https://qvard.com/checkout.js geladen und öffnet ein Zahlungsfenster als Modal oder eingebettet. Das Fenster ist dieselbe Qvard-Zahlungsseite: der Kunde wählt den Vermögenswert und das Netzwerk, der Betrag wird durch Ihre Bestellung festgelegt. Eine Widget-Instanz erhält Ihren öffentlichen Schlüssel (qvard_pk_...) zum Erstellen der Zahlung im Browser oder die Zahlungs-ID zum Erstellen auf dem Server. Probieren Sie es auf dem Playground unter https://qvard.com/en/embedded-checkout/playground/ aus.

Zwei Möglichkeiten, die Zahlung zu erstellen

Im Browser: Übergeben Sie den öffentlichen Schlüssel (qvard_pk_...) und den Betrag an das Widget; es erstellt die Zahlung und öffnet das Fenster. Auf dem Server: Ihr Backend erstellt die Zahlung über POST /api/v1/payment und übergibt die Zahlungs-ID an das Widget. Verwenden Sie für Bestellungen mit festem Preis oder Bestandslimits die Server-Erstellung, damit der Preis im Browser nicht geändert werden kann. Oder überspringen Sie das Widget und leiten Sie Kunden zur gehosteten Zahlungsseite weiter.

JScheckout.js
<script src="https://qvard.com/checkout.js"></script>

new QvardCheckout({
  mode: 'modal',
  publishableKey: 'qvard_pk_…',
  price: 10,
  onSuccess: function (e) {
    console.log('paid', e.paymentId);
  }
}).open();

Auf dem Server: Erstellen Sie zuerst die Zahlung

Ihr Server sendet die Bestellungs-ID und den Preis in USD mit dem Header x-api-key. Die Antwort gibt die Zahlungs-ID und redirectUrl zurück. Übergeben Sie die ID an das Widget im Browser, oder verwenden Sie redirectUrl für eine gehostete Weiterleitung. Bewahren Sie den Schlüssel auf dem Server auf, da die Anfrage nicht vom Browser aus gestellt werden darf.

POST/api/v1/payment
x-api-key: qvard_sk_…

{
  "id": "order_1024",
  "price": 149.99,
  "paymentSystemId": 12
}

// 201 Created
{
  "data": {
    "id": "8f3k2a1c",
    "redirectUrl": "https://my.qvard.com/pay/8f3k2a1c"
  },
  "code": 201,
  "message": "success",
  "status": true
}

Überprüfen Sie die Zahlung vom Webhook

Wenn der Status paid ist, erhält Ihr Webhook-Endpunkt die ID und den Status, signiert mit dem Header X-Qvard-Signature (HMAC-SHA256). Überprüfen Sie die Signatur mit Ihrem geheimen Schlüssel (qvard_sk_...) und stellen Sie sicher, dass der Betrag Ihrer Bestellung entspricht. Markieren Sie die Bestellung als bezahlt erst nach Signaturverifizierung.

Wann sollte ich das eingebettete Fenster wählen

Verwenden Sie das modale oder eingebettete Widget, um Kunden auf Ihrer Seite zu behalten. Die gehostete Seite mit Weiterleitung funktioniert genauso gut und ist eine Option, wenn Sie es vorziehen, das Zahlungsfenster nicht einzubetten. Beide Ansätze verwenden denselben Zahlungserstellungs- und Webhook-Flow.

FAQ

Ist der eingebettete Krypto-Checkout heute bei Qvard verfügbar?

Ja. Laden Sie das Widget von https://qvard.com/checkout.js und übergeben Sie Ihren öffentlichen Schlüssel (qvard_pk_...) zur Erstellung im Browser, oder erstellen Sie die Zahlung auf dem Server und übergeben Sie die ID.

Wie füge ich das Widget meiner Website hinzu?

Fügen Sie das Tag <script src="https://qvard.com/checkout.js"></script> ein und instanziieren Sie QvardCheckout mit Ihrem Schlüssel, Betrag und Modus (modal oder inline). Siehe Code-Beispiele in diesem Artikel und die Demo.

Ist die Zahlungssignatur wichtig?

Ja. Überprüfen Sie immer den Header X-Qvard-Signature in Ihrem Webhook mit Ihrem geheimen Schlüssel, und stellen Sie sicher, dass der Betrag im Webhook Ihrer Bestellung entspricht.

Kann ich die Weiterleitung statt des eingebetteten Fensters verwenden?

Ja. Die gehostete Zahlungsseite beim redirectUrl funktioniert genauso gut und erfordert kein Widget. Beide Ansätze verwenden dieselbe API und Webhook.

Ähnliche Artikel

Ähnliche Artikel