PaymentRequest: событие paymentmethodchange

Событие paymentmethodchange доставляется API запроса на оплату Payment Request API объекту PaymentRequest при изменении пользователем способа оплаты в рамках обработчика оплаты.

Например, если пользователь переключается с одной кредитной карты на другую в своем аккаунте Apple Pay, то срабатывает событие paymentmethodchange для уведомления о произошедшем изменении.

Это событие не может быть отменено и не распространяется.

Используйте имя события в методах, таких как addEventListener(), или задайте свойство обработчика события.

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

onpaymentmethodchange = (event) => {};

Объект PaymentMethodChangeEvent. Наследуется от Event.

В дополнение к свойствам ниже, этот интерфейс включает свойства, унаследованные от PaymentRequestUpdateEvent.

methodDetails Только для чтения

Объект, содержащий данные, специфичные для способа оплаты, полезные при обработке изменения способа оплаты. Если такая информация недоступна, это значение null.

methodName Только для чтения

Строка, содержащая идентификатор способа оплаты, уникальная строка, идентифицирующая конкретный способ оплаты. Этот идентификатор обычно представляет собой URL, используемый в процессе оплаты, но также может быть стандартизированной строкой без URL, такой как basic-card. Значение по умолчанию — пустая строка, "".

Давайте рассмотрим пример. Этот код создает новый PaymentRequest, добавляет обработчик события paymentmethodchange, вызывая addEventListener() запроса, затем вызывает show() для отображения интерфейса оплаты пользователю.

Код предполагает наличие метода detailsForTransaction(), который вернет объект, который можно передать как аргумент details конструктору PaymentRequest.

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}`));

Функция обработчика события handlePaymentChange() выглядит следующим образом:

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

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

  event.updateWith(detailsUpdate);
};

Сначала проверяется свойство methodName события; если оно указывает, что пользователь пытается использовать Apple Pay, мы передаем methodDetails в функцию calculateServiceFee(), которую мы можем создать для получения информации о транзакции, например, о кредитной карте, используемой для обработки запроса Apple Pay, и вычисления и возврата объекта, указывающего изменения, которые необходимо применить к PaymentRequest для добавления любых комиссий за обслуживание, которые могут потребоваться для способа оплаты.

Перед возвратом обработчик события вызывает метод updateWith() события для интеграции изменений в запрос.

• Payment Request API
• Использование API запроса на оплату
• merchantvalidation событие
• shippingaddresschange событие
• shippingoptionchange событие