PaymentRequest: paymentmethodchange-Ereignis

Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.

Das paymentmethodchange-Ereignis wird über die Payment Request API an ein PaymentRequest-Objekt geliefert, wenn der Benutzer die Zahlungsmethode innerhalb eines bestimmten Zahlungsabwicklers ändert.

Zum Beispiel, wenn der Benutzer von einer Kreditkarte zu einer anderen in seinem Apple Pay Konto wechselt, wird ein paymentmethodchange-Ereignis ausgelöst, um Sie über die Änderung zu informieren.

Dieses Ereignis kann nicht abgebrochen werden und wird nicht weitergegeben.

Syntax

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder legen Sie eine Event-Handler-Eigenschaft fest.

addEventListener("paymentmethodchange", (event) => {});

onpaymentmethodchange = (event) => {};

Ereignistyp

Ein PaymentMethodChangeEvent. Erbt von Event.

Ereigniseigenschaften

Neben den unten stehenden Eigenschaften enthält diese Schnittstelle Eigenschaften, die von PaymentRequestUpdateEvent geerbt wurden.

methodDetails Nur lesbar: Ein Objekt, das zahlungsmethodenspezifische Daten enthält, die nützlich sind, wenn eine Zahlungsmethode geändert wird. Wenn keine solche Information verfügbar ist, ist dieser Wert null.
methodName Nur lesbar: Ein String, der den Bezeichner der Zahlungsmethode enthält, ein String, der eine bestimmte Zahlungsmethode eindeutig identifiziert. Dieser Bezeichner ist üblicherweise eine URL, die während des Zahlungsprozesses verwendet wird, kann aber auch eine standardisierte nicht-URL-Zeichenkette sein, wie basic-card. Der Standardwert ist der leere String, "".

Beispiele

Schauen wir uns ein Beispiel an. Dieser Code erstellt ein neues PaymentRequest, fügt einen Handler für das paymentmethodchange-Ereignis hinzu, indem er die addEventListener()-Methode des Requests aufruft, und ruft dann show() auf, um dem Benutzer die Zahlungsschnittstelle zu präsentieren.

Der Code setzt die Existenz einer Methode detailsForTransaction() voraus, die ein Objekt zurückgibt, das als details-Argument an den PaymentRequest-Konstruktor übergeben werden kann.

const paymentRequest = new PaymentRequest(
  paymentMethods,
  detailsForTransaction(),
);

paymentRequest.addEventListener(
  "paymentmethodchange",
  handlePaymentChange,
  false,
);

paymentRequest
  .show()
  .then((response) => response.complete("success"))
  .catch((err) => console.error(`Error handling payment request: ${err}`));

Die Ereignis-Handler-Funktion selbst, handlePaymentChange(), sieht folgendermaßen aus:

handlePaymentChange = (event) => {
  const detailsUpdate = {};

  if (event.methodName === "https://apple.com/apple-pay") {
    const serviceFeeInfo = calculateServiceFee(event.methodDetails);
    Object.assign(detailsUpdate, serviceFeeInfo);
  }

  event.updateWith(detailsUpdate);
};

Diese beginnt mit dem Blick auf die methodName-Eigenschaft des Ereignisses; wenn diese darauf hinweist, dass der Benutzer versucht, Apple Pay zu verwenden, übergeben wir die methodDetails an eine Funktion namens calculateServiceFee(), die wir erstellen könnten, um die Informationen über die Transaktion zu nutzen, wie z.B. die zugrunde liegende Kreditkarte, die für die Abwicklung der Apple Pay-Anfrage verwendet wird, um ein Objekt zu berechnen und zurückzugeben, das Änderungen spezifiziert, die am PaymentRequest vorgenommen werden müssen, um eventuell erforderliche Servicegebühren der Zahlungsmethode hinzuzufügen.

Bevor der Ereignis-Handler zurückkehrt, ruft er die updateWith()-Methode des Ereignisses auf, um die Änderungen in die Anfrage zu integrieren.

Spezifikationen

Specification
Payment Request API # dfn-paymentmethodchange
Payment Request API # onpaymentmethodchange-attribute

Browser-Kompatibilität

BCD tables only load in the browser