Apple Pay für JavaScript Library

Was ist Apple Pay?

Apple Pay ist ein Wallet-basierter mobiler Zahlungsdienst von Apple Inc., mit dem Benutzer Zahlungen über iPhone, iPad oder Mac abwickeln können. Kunden profitieren von einem vertrauten und optimierten Kassiervorgang, bei dem ihre Rechnungsdaten bereits ausgefüllt werden können, um den Kauf abzuschließen. Die Kunden werden schnell authentifiziert, indem sie ihren Finger auf das integrierte Lesegerät legen oder ihr Gesicht erkennen. Apple Pay verwendet Token, um sicherzustellen, dass keine sensiblen Zahlungsinformationen bei Apple, auf dem Gerät des Kunden oder auf Ihren eigenen Servern gespeichert werden.

In diesem Artikel wird erklärt, wie Sie Apple Pay mit Hilfe unseres JavaScript Library in Ihre Zahlungslösung integrieren können.

Nur zugelassene Kunden können Transaktionen über Apple Pay abwickeln. So müssen die Kunden beispielsweise ein unterstütztes Apple-Gerät verwenden und sich in einem Land befinden, in dem Apple Pay tätig ist. Eine vollständige Liste der Anforderungen finden Sie in der Apple-Dokumentation (Link zu externer Seite).

Im Mai 2024 vereinfachten wir den Prozess der Integration mit Apple Pay

Wenn Sie Apple Pay mit Trust Payments vor dieser Änderung integriert haben:

Unsere ältere Dokumentation finden Sie, wenn Sie hier klicken.
Wir empfehlen Ihnen jedoch, bei der nächsten Erneuerung Ihrer Zertifikate den nachstehenden Ablauf zu beachten.

Voraussetzungen

Stellen Sie sicher, dass Sie die folgenden Anforderungen erfüllen, bevor Sie Apple Pay in Ihre Kassenlösung integrieren:

Ihre Acquiring-Bank muss
Apple Pay mit Trust Payments unterstützen.

Wenden Sie sich im Zweifelsfall an das Support-Team

Ihr Server muss die folgenden Anforderungen erfüllen:

Muss das Protokoll Transport Layer Security (TLS) 1.2 oder höher unterstützen.
Muss einen der in der Apple-Dokumentation (Link zu externer Seite) aufgeführten Cipher Suites unterstützen.
Muss hohe Sicherheitsstandards erfüllen (z. B. bei Verwendung von SSL Labs (Link zu externer Website) zur Überprüfung des Zertifikats wäre eine Note A erforderlich).

Um Ihre Lösung zu testen, müssen Sie Zugang zu einem Gerät haben, das die Sandbox-Tests von Apple für Apple Pay unterstützt.

Unterstützte Geräte

Sie benötigen ein Sandbox-Tester-Konto, um Testkarten zu Ihrer Brieftasche hinzuzufügen, damit Sie Apple Pay Testtransaktionen durchführen können.

Erfahren Sie mehr über Sandkästen

Einrichten und Überprüfen Ihrer Domains

Laden Sie zunächst die unten stehende Datei zur Domain-Verifizierung herunter und platzieren Sie sie auf Ihren Domains, auf denen Apple Pay angezeigt werden soll:

Klicken Sie hier zum Herunterladen

Sie müssen jede Domäne vorbereiten, indem Sie die erhaltene Domänenüberprüfungsdatei an diesem Ort speichern, da diese öffentlich abgefragt wird, um den Domänenregistrierungsprozess abzuschließen:
```
https://[DOMAIN_NAME]/.well-known/apple-developer-merchantid-domain-association
```
Ensure the file and the hidden .well-known directory are given read and execute permissions. (For Unix, this is typically done by using the command chmod 755 <filename or folder>).

Als Teil des Apple Pay Validierungsprozesses verlangt Apple, dass die Validierungsdatei eine HTTP 200 OK Antwort zurückgibt. Jeder andere HTTP-Antwortcode, wie z. B. 301 Moved Permanently, wird als Fehler behandelt. Um sicherzustellen, dass Apple Pay ordnungsgemäß funktioniert, muss die Validierungsdatei so konfiguriert werden, dass sie immer eine HTTP 200 OK-Antwort zurückgibt.
Bitten Sie Ihren autorisierten Ansprechpartner, sich an unser Support-Team zu wenden und die Aktivierung von Apple Pay für Ihre Website-Referenz zu beantragen. In Ihrer E-Mail müssen Sie eine CSV-Datei anhängen, die eine Liste aller Website-Referenzen enthält, die Sie zu registrieren beabsichtigen, sowie die zugehörige(n) Domain(s).

Das Format der CSV-Datei muss wie folgt sein:
```
Site reference, Domain name
```
Zum Beispiel:
```
site10001, example.com
site10002, trustpayments.com
test_site10003, trustpayments.com
```
Bitte fügen Sie alle relevanten Test- und Live-Domains Website-Referenzen in die Datei ein.

Formatieren Sie Domains wie diese: example.com
Schicken Sie uns das nicht! www.example.com

Sie können bis zu 99 Domains pro Website-Referenz registrieren.
Unser Support-Team wird Sie auf dem Laufenden halten, sobald der Registrierungsprozess für die angegebenen Domains abgeschlossen ist und Sie mit der Bearbeitung der Apple Pay Transaktionen beginnen können.

Wenn Sie zuvor Apple Pay unter Verwendung unserer JavaScript Library integriert haben, aber inzwischen den oben beschriebenen neuen Registrierungsprozess anwenden, müssen Sie sicherstellen, dass die Eigenschaft merchantId in der Konfiguration, die an die st.js ApplePay Methode übergebene Eigenschaft merchantId aktualisiert wurde, um Ihre Website-Referenz anstelle der Apple Pay Merchant Id anzugeben. Der Grund dafür ist, dass die Domains jetzt mit Ihrer Website-Referenz und nicht mehr mit Ihrer Apple Pay Merchant Id verknüpft sind.

Konfigurieren Sie die Lösung Apple Pay

Sobald Sie Ihre Domains für Apple Pay eingerichtet und verifiziert haben, müssen Sie die Integration mit einem der folgenden Abläufe vornehmen:

Ablauf 1 - JavaScript bestimmt, wann die AUTH übermittelt wird

Wenn der Kunde auf die Schaltfläche Apple Pay drückt, wird ihm das Zahlungsformular Apple Pay angezeigt.
Der Kunde genehmigt die Zahlung mit Touch ID, Face ID oder seinem Passcode.
Wenn der Kunde der Zahlung zustimmt, wird eine AUTH Anfrage an Trust Payments gesendet.
Trust Payments kontaktiert die akquirierende Bank, um Autorisierung für die Transaktion anzufordern.

Anweisungen für Flow 1

Konfigurieren Sie Ihr JWT

JSON Web Tokens (JWT) sind eine offene, dem Industriestandard RFC 7519 entsprechende Methode zur sicheren Übertragung von Daten zwischen zwei Parteien. Es schützt vor der Änderung kritischer Transaktionsdaten (z. B. des abzubuchenden Betrags) durch Unbefugte während der Zahlungssitzung.

Aus diesem Grund ist dieses Feld erforderlich, um Zahlungen mit Trust Payments abzuwickeln.

Klicken Sie hier, um zu erfahren, wie Sie das JWT generieren können

Je nach Ihrer bevorzugten Konfiguration müssen Sie möglicherweise ein zusätzliches Feld in die payload aufnehmen, wenn Sie das JWT für Ihr Kassenformular generieren.

Um dem Kunden die Möglichkeit zu geben, eine in seinem Apple-Konto gespeicherte Rechnungs- oder Lieferadresse aus dem Zahlungsformular auszuwählen (anstelle einer an der Kasse eingegebenen Adresse), müssen Sie die optionalen Felder billingcontactdetailsoverride bzw. customercontactdetailsoverride mit dem Wert "1" einfügen.

Andernfalls muss der JWT nicht geändert werden, um Apple Pay Transaktionen zu verarbeiten.

Apple Pay Bibliothek

Damit unser ST.js library die Schaltfläche Apple Pay auf der Seite einbetten kann, die anschließend das Wallet Sheet aufruft, müssen Sie einen entsprechenden Content Wrapper zuweisen und die entsprechenden ST.js library -Aufrufe tätigen.

Erstellen Sie zunächst einen Container, in den die Schaltfläche Apple Pay eingefügt werden soll, und geben Sie ihm eine entsprechende ID:

<div id="st-apple-pay"></div>

Einmal konfiguriert, erscheint Ihre Apple Pay Schaltfläche als untergeordnetes Element dieses div-Elements. Als Nächstes aktivieren Sie die Funktion Apple Pay im JS library.

Betrachten wir ein Szenario, in dem Sie das Wallet-Sheet von Apple Payverwenden möchten, um Ihrem Kunden $10 über eine verknüpfte Kredit- oder Debitkarte zu berechnen. Das könnten Sie mit folgendem Code erreichen, wobei sich st auf Ihre Instanz von SecureTrading:

st.ApplePay({
  buttonStyle: 'white-outline',
  buttonText: 'plain',
  merchantId: 'test_site12345',
  paymentRequest: {
    countryCode: 'US',
    currencyCode: 'USD',
    merchantCapabilities: ['supports3DS', 'supportsCredit', 'supportsDebit'],
    supportedNetworks: ["visa","masterCard","amex"],
    requiredBillingContactFields: ["postalAddress"],
    requiredShippingContactFields: ["postalAddress","name", "phone", "email"],
    total: {
      label: 'Trust Payments Merchant',
      amount: '10.00'
    }
  },
  buttonPlacement: 'st-apple-pay'
});

Das Endergebnis wird eine HTML-Seite sein, die dem folgenden Beispiel ähnelt:

<html>
  <head>
  </head>
  <body>
    <div id="st-notification-frame"></div>
    <form id="st-form" action="https://www.example.com"/>
    <div id="st-apple-pay"></div>
    <script src="<CDN_DOMAIN>"></script>
    <script> 
      (function() {
        var st = SecureTrading({ 
          jwt: 'INSERT YOUR JWT HERE', 
        }); 
        st.ApplePay({
          buttonStyle: 'white-outline',
          buttonText: 'plain',
          merchantId: 'test_site12345',
          paymentRequest: {
            countryCode: 'US',
            currencyCode: 'USD',
            merchantCapabilities: ['supports3DS', 'supportsCredit', 'supportsDebit'],
            supportedNetworks: ["visa","masterCard","amex"],
            requiredBillingContactFields: ["postalAddress"],
            requiredShippingContactFields: ["postalAddress","name", "phone", "email"],
            total: {
              label: 'Trust Payments Merchant',
              amount: '10.00'
            }
          },
          buttonPlacement: 'st-apple-pay'
        });
      })(); 
    </script>
  </body>
</html>

Im weiteren Verlauf dieses Dokuments können Sie die möglichen Werte für jedes der oben aufgeführten Felder sowie weitere optionale Felder, die oben nicht aufgeführt sind, kennenlernen.

Ersetzen Sie <CDN_DOMAIN> mit einer unterstützten Domäne. Klicken Sie hier für eine vollständige Liste.

Feldspezifikation

Tastenfelder

Feld	Format	Beschreibung
buttonStyle	Alphanumerisch	Wird verwendet, um das Aussehen der Schaltfläche Apple Pay zu ändern. Klicken Sie hier für weitere Informationen (Link zu externer Seite).
buttonText	Alphanumerisch	Wird verwendet, um den Text zu ändern, der auf der Schaltfläche Apple Pay erscheint. Klicken Sie hier für weitere Informationen (Link zu externer Seite).
buttonPlacement	Alphanumerisch	Standardmäßig sucht die Bibliothek nach einem div id genannt. "st-apple-pay" um zu bestimmen, wo die Schaltfläche Apple Pay auf dem Formular platziert werden soll. Wenn Sie nicht die Standardeinstellungen verwenden div id, müssen Sie Ihre benutzerdefinierte Kennung als Wert für das Feld buttonPlacement Eigenschaft. z.B. `buttonPlacement: 'apple-button'`

Apple hat Richtlinien veröffentlicht, wie Sie die Schaltfläche Apple Pay auf Ihrer Kasse am besten positionieren.
Klicken Sie hier, um mehr zu erfahren (Link zu externer Seite).

Felder des Händlers

Feld		Format	Beschreibung
merchantId		Alphanumerisch & Unterstrich (50)	Der Wert, der merchantId zugewiesen wird, muss die Website-Referenz sein, die mit der Domäne verbunden ist, die die ApplePay Methodezugeordnet ist, wie in der CSV-Datei angegeben, die während der Überprüfung der Domäne an das Support-Team gesendet wurde. Die hier angegebene merchantId muss mit der sitereference die im JWT übermittelt wurde.
paymentRequest		Objekt	Dieses Objekt enthält Informationen über den Zahlungsantrag. Die Spezifikationen spiegeln die der offiziellen Apple Pay Entwickler Dokumentation wider.
	countryCode	Alpha (2)	Der Ländercode des Händlers im ISO2a-Format.
	merchantCapabilities	Liste	Die vom Händler unterstützten Zahlungsmöglichkeiten. Das Feld muss enthalten “supports3DS” (um die Überprüfung von Touch ID / Face ID zu ermöglichen), und mindestens einen der folgenden zusätzlichen Werte: “supportsCredit” - Um Kreditkartenzahlungen zu ermöglichen. “supportsDebit” - Um Debitkartenzahlungen zu ermöglichen. Eine vollständige Spezifikation finden Sie unter Apples eigene Dokumentation (Link zu externer Seite).
	supportedNetworks	Liste	Die vom Händler unterstützten Zahlungsnetze. Sie müssen diese Eigenschaft auf einen oder mehrere der Werte des Zahlungsnetzwerks setzen, die in der offiziellen Apple Pay API-Spezifikation angegeben sind. Wir unterstützen alle Zahlungsnetzwerke bis zur Version v14 von Apple Pay und lassen alle nicht unterstützten Netzwerke automatisch aus. Wenn der Browser/das Gerät eines Kunden v14 unterstützt und eine vollständige Liste der Zahlungsnetzwerke bereitgestellt wird, wird die vollständige Liste an Apple weitergeleitet. Wenn der Kunde nur einen v6-kompatiblen Browser bzw. ein v6-kompatibles Gerät hat, wird die vollständige Liste auf das reduziert, was bis v6 unterstützt wurde. Bitte beachten Sie: Sie müssen sicherstellen, dass jedes unterstützte Zahlungsnetzwerk, das in der Liste aufgeführt ist, auch als unterstütztes Netzwerk auf Ihrem Website-Referenz konfiguriert ist. Kontaktieren Sie unser Support-Team für weitere Informationen.
	supportedCountries	Array von Zeichenketten	Eine Liste von zweistelligen Ländercodes, die Sie angeben (im ISO2a-Format). Apple Pay Transaktionen sind auf Karten beschränkt, die in den in dieser Eigenschaft aufgeführten Ländern ausgestellt wurden. Die supportedCountries Liste hat keinen Einfluss auf die für die Transaktion verwendete Währung und gilt für alle Zahlungskarten in der Brieftasche.

Felder der Transaktion

Feld			Format	Beschreibung
Rückrufe			Objekt, das alle Callback-Definitionen enthält	Unterstützt werden unter anderem folgende Rückrufe: onShippingMethodSelected onShippingContactSelected
		onShippingMethodSelected	Funktion	Die Rückruffunktion onShippingMethodSelected wird immer dann ausgelöst, wenn ein Kunde auf dem Zahlungsformular eine andere Versandart auswählt. Mit dieser Funktion können Sie die dem Kunden angezeigten Transaktionsdetails aktualisieren. Unterschrift: `function (data, actions) { console.log(data.shippingOption) actions.resolve({ newTotal: { ... } }); }` Daten: Enthält Informationen über die gewählte Versandart. Aktionen: Enthält die Funktion "Auflösen", mit der Sie das Zahlungsformular mit den neuen Transaktionsdetails aktualisieren können. Eine vollständige Aufschlüsselung des Datenobjekts und der Struktur für die aktualisierten Transaktionsdetails finden Sie in der Dokumentation unterApple Pay Entwickler . Bei der Auflösung des Rückrufs können Sie optional eine JSON Web Token (JWT) angeben, die die ursprüngliche, bei der Initialisierung verwendete JWT überschreibt. Auf diese Weise wird sichergestellt, dass der genehmigte Endbetrag mit der auf dem Zahlungsformular angegebenen Summe übereinstimmt.
		onShippingContactSelected	Funktion	Die Rückruf-Funktion onShippingContactSelected wird immer dann aufgerufen, wenn ein Kunde eine andere Versandadresse auswählt. Dadurch können Sie sowohl die verfügbaren Versandmethoden als auch die auf dem Zahlungsformular angezeigten Transaktionsdetails aktualisieren. Unterschrift: `function (data, actions) { console.log(data.shippingContact) actions.resolve({ newTotal: { ... } }); }` Daten: Enthält die Kontaktinformationen für den Versand, die von Apple Pay zum Schutz der Privatsphäre unkenntlich gemacht werden. Diese Daten sind für die Berechnung von Steuern oder Versandkosten ausreichend. actions: Enthält die Auflösungsfunktion zur Aktualisierung des Zahlungsformulars mit neuen Transaktionsdetails und Versandmethoden. Ausführliche Informationen über das Datenobjekt und die Strukturierung der aktualisierten Angaben finden Sie in der DokumentationApple Pay Entwickler . Ähnlich wie bei onShippingMethodSelected können Sie eine JWT bereitstellen, um die ursprüngliche zu überschreiben und sicherzustellen, dass der Gesamtbetrag mit dem auf dem Zahlungsformular angezeigten Betrag übereinstimmt.
paymentRequest			Objekt	Dieses Objekt enthält Informationen über die Zahlung, die in der ersten Anfrage an Apple gesendet werden (unser Javascript sendet dies).
	requiredBillingContactFields		Liste	Auf dem Zahlungsformular wird dieses Feld verwendet, um den Kunden aufzufordern, seine bevorzugten Rechnungsadressdaten aus seinem Apple Pay Konto vor dem Kauf auszuwählen. Auf dem Zahlungsformular werden KEINE Rechnungsadressdaten angezeigt, die von Ihrer Kasse aus gebucht wurden. Sie können die folgenden Feldwerte eingeben: “postalAddress” Dies ist erforderlich, wenn der Kunde den Kauf unter Verwendung der in seinem Apple Pay Konto gespeicherten Rechnungsadressfelder abschließen soll.
	requiredShippingContactFields		Liste	Auf dem Zahlungsformular wird dieses Feld verwendet, um den Kunden aufzufordern, seine bevorzugten Lieferadressdaten aus seinem Apple Pay Konto vor dem Kauf auszuwählen. Auf dem Bezahlungsformular werden KEINE Details zur Lieferadresse angezeigt, die an der Kasse eingegeben wurden. Sie können die folgenden Feldwerte eingeben: “postalAddress” “name” “phone” “email” Dies ist erforderlich, wenn der Kunde den Kauf unter Verwendung der in seinem Apple Pay -Konto gespeicherten Lieferadressfelder abschließen soll.
	shippingMethods		Liste von Wörterbüchern	Mit der Eigenschaft shippingMethods können Sie eine Liste von Versandoptionen definieren, aus der Ihre Kunden innerhalb des Zahlungsformulars auswählen können. Sie können eine unbegrenzte Anzahl von Versandmethoden anbieten. Eine ausführliche Anleitung zur Strukturierung Ihrer shippingMethods finden Sie in der Apple Pay Entwickler Dokumentation
	shippingType		Alpha	Die Versandart ist eine optionale Eigenschaft, die angibt, wie die Bestellung des Kunden erfüllt wird, z. B. ob sie im Geschäft abgeholt oder an eine bestimmte Adresse geliefert wird. Um alle möglichen Werte für diese Eigenschaft zu erkunden, besuchen Sie die Apple Pay Entwickler Dokumentation zu shippingType.
	currencyCode		Alpha (3)	Der Code der Transaktion Währung im ISO3a-Format.
	total		K.A.	Ein Einzelposten, der den Gesamtbetrag der Zahlung darstellt.
		amount	Numerisch mit Nachkommastelle (14)	Der Betrag der Transaktion in Haupteinheiten, wobei ein Dezimalpunkt zur Kennzeichnung von Dezimalwerten verwendet wird, so dass €10 als 10.00 zurückgegeben wird. Dies muss derselbe Betrag sein, der im Rahmen der payload des JWT. Es ist von entscheidender Bedeutung, dass der im JWT angegebene Betrag korrekt ist, da dies der Wert ist, der den Betrag bestimmt, mit dem der Kunde belastet wird.
		label	Alphanumerisch einschließlich Symbole	Dies ist ein Kommentar, der auf dem Zahlungsformular Apple Pay neben dem Gesamtbetrag angezeigt wird, bevor der Kunde der Zahlung zustimmt.

Verstärkung Ihrer Integration

Im folgenden Abschnitt werden zusätzliche Funktionen der Bibliothek vorgestellt, die über einen grundlegenden Zahlungsfluss hinausgehen und ein Verständnis des Callbacks-Objekts erfordern, das in der ApplePay Konfiguration.

Rückrufe

Falls erforderlich, akzeptiert die ApplePay Konfiguration ein Callbacks-Objekt , das die Möglichkeit bietet, jede unserer verfügbaren Callback-Optionen zu konfigurieren:

onShippingMethodSelected
onShippingContactSelected

Beide Callback-Funktionen haben die gleiche Signatur:

function (data, actions) {
  // Your implementation here
}

Daten

Die in jedem Datenobjekt zurückgegebenen Werte entsprechen der Apple Pay JS API für die jeweiligen Rückrufe, d.h. shippingMethod und shippingContact.

Einen umfassenden Überblick über die Daten, die sowohl für onShippingMethodSelected als auch für onShippingContactSelected zurückgegeben werden , finden Sie in der offiziellen Apple Pay Entwicklerdokumentation:

onShippingMethodSelected

onShippingContactSelected

Aktionen

Das Argument actions ist ein Objekt, das den Zugriff auf eine einzelne Funktion namens resolve ermöglicht. Es akzeptiert ein einzelnes Objektargument, dessen erwartete Werte mit den Apple Pay JS API-Verträgen übereinstimmen, die von

completeShippingContactSelection und completeShippingMethodSelection.

Die einzige Abweichung von dieser Spezifikation besteht darin, dass wir Ihnen die Möglichkeit geben, einen zusätzlichen, aber optionalen Schlüssel namens jwt bereitzustellen, der dafür sorgt, dass Ihr JWT payload mit den auf dem Wallet-Sheet angegebenen Preisen und Adressen übereinstimmt.

Bieten Sie Ihren Kunden mehrere Versandoptionen an

Wenn Sie Apple Pay verwenden, können Sie Ihren Kunden innerhalb des Zahlungsformulars mehrere Versandoptionen anbieten. So können Sie z. B. Standard- und Expressversand anbieten und das Kundenerlebnis durch Flexibilität und Transparenz bei den Versandkosten und Lieferzeiten verbessern.

Sie können mehrere Versandmethoden implementieren, indem Sie diese Schritte befolgen:

Definieren Sie Ihre Versandmethoden:

Geben Sie zunächst die verfügbaren Versandmethoden in der Eigenschaft shippingMethods der paymentRequest an. Jede Versandmethode sollte eine Bezeichnung, eine Beschreibung, die Kosten und einen eindeutigen Bezeichner enthalten.

st.ApplePay({
  paymentRequest: {
    shippingMethods: [
      {
        "label": "Free Shipping",
        "detail": "Arrives in 5 to 7 days",
        "amount": "0.00",
        "identifier": "FreeShip"
      },
      {
        "label": "Express Shipping",
        "detail": "Arrives in 1 to 2 days",
        "amount": "10.00",
        "identifier": "ExpressShip"
      }
    ],
    ...
  }
});

Das obige Beispiel zeigt, wie Sie zwei Versandoptionen konfigurieren können: Kostenloser Versand und Expressversand. Es ist möglich, so viele Versandmethoden wie nötig hinzuzufügen.

Bitte beachten Sie: Die Reihenfolge der auf dem Wallet-Sheet angezeigten Versandmethoden wird anhand des ersten Objekts im Array bestimmt, es sei denn, ein anderes Objekt im Array ist explizit mit dem Attribut selected: true gekennzeichnet.

Handhabung Auswahl der Versandart:

Verwenden Sie den onShippingMethodChanged-Callback, um zu reagieren, wenn ein Kunde die Versandmethode aus den verfügbaren Optionen ändert. Mit diesem Callback können Sie die Transaktionsdetails, wie z. B. die Gesamtkosten, auf der Grundlage der gewählten Versandmethode anpassen.

"callbacks": {
    "onShippingMethodSelected": (data, actions) = {
      const payloadJwt = loadYourPayload();

      actions.resolve({
        newTotal: {
          label: "Your Merchant Name",
          amount: calculateTotal(...), // Adjust the total amount
        },
        newLineItems: [
          { label: "Subtotal", amount: ... },
          { label: data.label, amount: ... } // Include selected shipping method
        ],
        jwt: payloadJwt,
      });
    },
  };
}

In diesem Beispiel wird der Gesamtbetrag der Transaktion neu berechnet, wenn der Kunde die Versandart ändert, und das Zahlungsformular wird mit den neuen Angaben aktualisiert.

Versandart anpassen (optional):

Geben Sie optional die Eigenschaft shippingType an, um festzulegen, wie die Bestellung erfüllt werden soll, z. B. Lieferung an die Adresse des Kunden oder Abholung im Geschäft. Dies schafft zusätzliche Klarheit für den Kunden.

st.ApplePay({
  paymentRequest: {
    shippingType: "shipping", // Options include 'shipping', 'delivery', 'storePickUp', etc.
    ...
  }
});

Verwenden Sie diese Option, um das Zahlungsformular mit dem Erfüllungsprozess des Händlers abzustimmen.

Verwalten einer Änderung des Versandkontakts

Apple Pay ermöglicht Ihnen auch die Verwaltung von Szenarien, in denen ein Kunde seine Versandkontaktinformationen aktualisiert, z. B. durch Änderung seiner Lieferadresse. Dank dieser Flexibilität können Sie die verfügbaren Versandmethoden anpassen und die Kosten auf der Grundlage des neuen Versandkontakts neu berechnen.

Sie können eine Änderung der Kontaktdaten für den Versand verwalten, indem Sie die folgenden Schritte ausführen:

Reagieren auf Änderungen bei den Versandkontakten:

Der onShippingContactSelected-Callback wird ausgelöst, wenn die Brieftasche geöffnet wird und wenn ein Kunde die Versandkontaktinformationen ändert. Dies ist besonders nützlich für die Neuberechnung von Versandkosten, Steuern oder sogar die Änderung verfügbarer Versandmethoden auf der Grundlage der neuen Adresse.


"callbacks": {
    "onShippingContactSelected": (data, actions) = {
      const payloadJwt = loadYourPayload();

      actions.resolve({
        newTotal: {
          label: "Your Merchant Name",
          amount: calculateTotal(...), // Adjust the total amount
        },
        newLineItems: [
          { label: "Subtotal", amount: payload.baseamount },
          { label: "Shipping", amount: calculateShipping(data) } // Recalculate shipping costs
        ],
        newShippingMethods: determineAvailableMethods(data), // Optionally, adjust available shipping methods
        jwt: payloadJwt,
      });
    },
  };
}

In diesem Beispiel behandelt das SDK die Änderung des Versandkontakts, indem es die relevanten Kosten neu berechnet und das Zahlungsformular entsprechend aktualisiert.

Verfügbare Versandmethoden aktualisieren:

Passen Sie ggf. die verfügbaren Versandmethoden auf der Grundlage des neuen Versandkontakts an. Bestimmte Versandoptionen können beispielsweise für internationale Adressen oder bestimmte Regionen nicht verfügbar sein.

function determineAvailableMethods(data) {
  if (data.countryCode === "US") {
    return [
      {
        "label": "Standard Shipping",
        "detail": "Arrives in 5 to 7 days",
        "amount": "5.00",
        "identifier": "StandardShip"
      },
      {
        "label": "Overnight Shipping",
        "detail": "Arrives next day",
        "amount": "25.00",
        "identifier": "OvernightShip"
      }
    ];
  } else {
    return [
      {
        "label": "International Shipping",
        "detail": "Arrives in 10 to 15 days",
        "amount": "20.00",
        "identifier": "IntlShip"
      }
    ];
  }
}

In diesem Pseudocode werden die verfügbaren Versandmethoden auf der Grundlage des Landes des Kunden angepasst und die entsprechenden Optionen angeboten.

Ablauf 2 - Der Händler bestimmt, wann die AUTH eingereicht wird

Für Händler, die lieber die Apple wallettoken Daten und senden eine API-Anfrage, um die AUTH selbst zu verarbeiten, die Eigenschaft merchantUrl sollte in der Datei st.js st.ApplePay Methode config.

Wenn der Kunde auf die Schaltfläche Apple Pay drückt, wird ihm das Zahlungsformular Apple Pay angezeigt.
Der Kunde genehmigt die Zahlung mit Touch ID, Face ID oder seinem Passcode.
merchantUrl erhält eine Anfrage von JavaScript mit den Details der Brieftasche.
Eine AUTH Anfrage wird von der merchantUrl auf Trust Payments unter Verwendung unserer Webservices API.
Sobald das Zahlungsergebnis von Trust Payments an die merchantUrl, sollte eine JWT-Antwort an die Websitejs library zurückgeschickt werden, um das Apple Payment Sheet zu aktualisieren.

Anweisungen für Flow 2

Zunächst fügen wir die merchantUrl Eigenschaft zum ApplePay Methode config:

st.ApplePay({
  buttonStyle: 'white-outline',
  buttonText: 'plain',
  merchantId: 'test_site12345',
  paymentRequest: {
    countryCode: 'US',
    currencyCode: 'USD',
    merchantCapabilities: ['supports3DS', 'supportsCredit', 'supportsDebit'],
    supportedNetworks: ["visa","masterCard"],
    requiredBillingContactFields: ["postalAddress"],
    requiredShippingContactFields: ["postalAddress","name", "phone", "email"],
    total: {
      label: 'Trust Payments Merchant',
      amount: '10.00'
    }
  },
  buttonPlacement: 'st-apple-pay'
  merchantUrl:'<payment URL endpoint>'
});

Nachfolgend ein Beispiel für eine Anfrage, die von JavaScript an merchantUrl sobald der Kunde die Transaktion mit Touch ID, Face ID oder einem Passcode authentifiziert hat:

{
  "request": [
    {
      "walletsource": "APPLEPAY",
      "wallettoken": "<json encoded string>",
    }
  ],
  "jwt": "<jwt token>",
  "acceptcustomeroutput": "2.00",
  "version": "1.00",
  "versioninfo": "STJS::N/A::3.2.0::N/A"
}

An dieser Stelle wird davon ausgegangen, dass die merchantUrl wird eine API-Anfrage an Trust Payments stellen, um die Autorisierung zu verarbeiten.

Ein Beispiel für das Senden von AUTH mit unserer webservices API finden Sie im Abschnitt "AUTH request" in diesem Artikel.

Die merchantUrl response to the st.js should be a JWT response. You will need to parse the AUTH response and include the returned fields in the payload of the response <JWT Token>, as shown below.

{
  jwt:<JWT Token>
}

Die payload der JWT token sollte mit dem folgenden Objekt verschlüsselt werden:

{'version': '1.00',
  'response': [{
    'walletsource': 'APPLEPAY',
    'errormessage': 'Ok',
    'sitereference': '<test or live sitereference>',
    'errorcode': '0',
    'requesttypedescription': 'AUTH'
  }]
}

Verständnis des Zahlungsformulars

Vor dem Abschluss des Kaufs wird dem Kunden das Zahlungsformular angezeigt. Hier werden dem Kunden die zuvor auf seinem Konto gespeicherten Karten, die Lieferoptionen, die Kontaktinformationen und der gesamte Kaufbetrag (einschließlich Steuern und Gebühren) angezeigt. Der Kunde kann die Bestellung überprüfen und optional Anpassungen vornehmen, bevor er fortfährt.

Karte

Der Kunde kann aus den Karten auswählen, die in seinem Apple Wallet (Link zu externer Seite).
Die für die Zahlung unterstützten Karten sind abhängig von der merchantCapabilities Feld auf der Kasse gebucht.
z.B. Wenn “supportsDebit” nicht in das Feld eingetragen ist, kann der Kunde seine Zahlung nicht mit einer Debitkarte abschließen.

Adresse

Die Rechnungs- und Lieferadresse wird auf dem Zahlungsformular nur angezeigt, wenn die Felder requiredBillingContactFields und requiredShippingContactFields mit gültigen Werten übermittelt worden sind. So kann der Kunde aus den in seinem Apple-Konto gespeicherten Rechnungs- und/oder Lieferadressen auswählen.

Die auf dem Zahlungsformular ausgewählte Adresse wird nur dann in die Anfrage AUTH aufgenommen, wenn die Felder billingcontactdetailsoverride und customercontactdetailsoverride eingereicht wurden, mit dem Wert "1".

Etikett und Menge

Die mainamount Wert wird auf dem Zahlungsverkehrsblatt angezeigt, neben dem label, an der Kasse gebucht. In dem Beispiel hier, die label wurde mit dem Wert “Outstanding balance”.

Authentifizierung

Die Authentifizierungsmethode unterscheidet sich je nach dem Gerät, das zum Abschluss der Zahlung verwendet wird. Der Kunde kann aufgefordert werden, seinen Finger auf den Touch ID-Sensor zu legen oder auf den Face ID-Sensor zu schauen.
Klicken Sie hier für weitere Informationen zur Apple Pay-Authentifizierung (Link zu externer Seite).

Abschluss der Zahlung

Sobald der Kunde erfolgreich auf dem Zahlungsformular authentifiziert wurde, wird die Transaktion im nächsten Schritt verarbeitet:

Wenn Sie Flow 1 verwenden, wird die Autorisierung automatisch von st.js ausgeführt.
Wenn Sie Flow 2 verwenden, muss Ihre Konfiguration die Anfrage AUTH manuell über die API Webservices verarbeiten und das Zahlungsformular mit dem Ergebnis aktualisieren.

Das Zahlungsformular Apple Pay wird aktualisiert und zeigt je nach Ergebnis der Zahlung entweder eine Erfolgs- oder eine Fehlermeldung an. Im Erfolgsfall wird das Zahlungsformular geschlossen, um anzuzeigen, dass die Zahlung abgeschlossen ist.

MyST

Wie bei regulären Kartenzahlungen können die Aufzeichnungen aller AUTH Transaktionen, die über Apple Pay abgewickelt wurden, in MyST eingesehen werden. Bei der Anzeige von Apple Pay Transaktionen in MyST wird die "Quelle der Brieftasche" wie folgt angezeigt “APPLEPAY”. Klicken Sie hier, um unsere MyST-Dokumentation anzusehen.

Prüfung

Ihr Test Website-Referenz wird mit der Apple Pay Test-Sandbox verbunden. Um Zahlungen über Ihren Test Website-Referenz zu verarbeiten, müssen Sie daher die Details der Testkarte zur Apple Wallet auf Ihren unterstützten Geräten hinzufügen.

Sie müssen die von Apple bereitgestellten Testkartendaten verwenden. Bitte besuchen Sie die folgende URL:
https://developer.apple.com/support/apple-pay-sandbox/ (Link zu externer Seite)

Die obigen Angaben setzen voraus, dass Sie auf Ihrem Gerät mit einem Apple-Sandbox-Konto angemeldet sind.

Bitte beachten Sie, dass die Testkartendaten, die wir in unserer Testdokumentation angeben, nicht für die Abwicklung von Apple Pay Testtransaktionen verwendet werden können.

Wenn Sie benutzerdefinierte Regeln (UDR) auf Website-Referenz aktiviert haben, müssen Sie sicherstellen, dass Sie verstehen, wie sich diese auf Ihre Apple Pay-Transaktionen auswirken können.
Wenn Sie Hilfe benötigen, wenden Sie sich bitte an unser Support-Team.

Ausführen zusätzlicher Anfragen

Bei der Verarbeitung von E-Commerce-Zahlungen mit Apple Pay können Sie Ihre Lösung so konfigurieren, dass sie zusätzliche Anfragen zur Durchführung zusätzlicher Aufgaben enthält. Diese sind wie folgt:

Sie müssen die JWT payload um die Liste aufzunehmen requesttypedescriptions mit den folgenden unterstützten Anfragekombinationen:

Wenn Ihre App neben Apple Pay auch andere Kartenzahlungsmethoden anbietet, müssen Sie unbedingt "THREEDQUERY" in die Liste requesttypedescriptions aufnehmen, da sonst die Authentifizierung 3-D Secure für die oben genannten Kartenzahlungsmethoden nicht durchgeführt wird. Wenn der Kunde die Zahlung über Apple Pay abwickelt, lässt das Gateway das THREEDQUERY automatisch weg, da es in diesem Fall nicht benötigt wird.

[“ACCOUNTCHECK”, “THREEDQUERY”, “AUTH”]
[“RISKDEC”, “ACCOUNTCHECK”, “THREEDQUERY”, “AUTH”]
[“RISKDEC”, “ACCOUNTCHECK”, “THREEDQUERY”, “AUTH”, “SUBSCRIPTION”]
[“RISKDEC”, “THREEDQUERY”, “AUTH”]
[“RISKDEC”, “THREEDQUERY”, “AUTH”, “SUBSCRIPTION”]
[“THREEDQUERY”, “ACCOUNTCHECK”, “SUBSCRIPTION”]
[“THREEDQUERY”, “AUTH”]
[“THREEDQUERY”, “AUTH”, “RISKDEC”]
[“THREEDQUERY”, “AUTH”, “SUBSCRIPTION”]

Weitere Lektüre zu diesem Thema