Настройка способа оплаты

Платежная транзакция с использованием веб-платежей начинается с обнаружения вашего платежного приложения. Узнайте, как настроить способ оплаты и подготовить платежное приложение к возможности совершения платежей продавцами и покупателями.

Eiji Kitamura

Чтобы использовать API запроса платежа, платежное приложение должно быть связано с идентификатором способа оплаты. Продавцы, которые хотят интегрироваться с платежным приложением, будут использовать идентификатор метода оплаты, чтобы указать его браузеру. В этой статье обсуждается, как работает обнаружение платежных приложений и как настроить ваше платежное приложение для правильного обнаружения и вызова браузером.

Если вы новичок в концепции веб-платежей или в том, как осуществляются платежные транзакции через платежные приложения, сначала прочитайте следующие статьи:

• Расширение возможностей платежных приложений с помощью веб-платежей
• Срок действия платежной транзакции

Поддержка браузера

Веб-платежи состоят из нескольких различных технологий, и статус поддержки зависит от браузера.

Как браузер обнаруживает платежное приложение

Каждое платежное приложение должно обеспечивать следующее:

• Идентификатор способа оплаты на основе URL-адреса
• Манифест метода оплаты (кроме случаев, когда идентификатор метода оплаты предоставлен третьей стороной)
• Манифест веб-приложения

Процесс обнаружения начинается, когда продавец инициирует транзакцию:

1. Браузер отправляет запрос на URL-адрес идентификатора метода оплаты и получает манифест метода оплаты .
2. Браузер определяет URL-адрес манифеста веб-приложения из манифеста способа оплаты и получает манифест веб-приложения.
3. Браузер определяет, запускать ли платежное приложение ОС или веб-платежное приложение из манифеста веб-приложения.

В следующих разделах подробно объясняется, как настроить собственный способ оплаты, чтобы браузеры могли его обнаружить.

Шаг 1. Укажите идентификатор способа оплаты.

Идентификатор способа оплаты — это строка на основе URL-адреса. Например, идентификатор Google Pay — https://google.com/pay . Разработчики платежных приложений могут выбрать любой URL-адрес в качестве идентификатора способа оплаты, если они контролируют его и могут предоставлять произвольный контент. В этой статье мы будем использовать https://bobbucks.dev/pay в качестве идентификатора способа оплаты.

Как продавцы используют идентификатор способа оплаты

Объект PaymentRequest состоит из списка идентификаторов способов оплаты , которые идентифицируют платежные приложения, которые продавец решает принять. Идентификаторы способов оплаты задаются как значение свойства supportedMethods . Например:

[продавец] запрашивает оплату:

const request = new PaymentRequest([{
  supportedMethods: 'https://bobbucks.dev/pay'
}], {
  total: {
    label: 'total',
    amount: { value: '10', currency: 'USD' }
  }
});

Шаг 2. Отправьте манифест способа оплаты

Манифест метода оплаты — это файл JSON, который определяет, какое платежное приложение может использовать этот метод оплаты.

Предоставьте манифест способа оплаты

Когда продавец инициирует платежную транзакцию, браузер отправляет HTTP-запрос GET на URL-адрес идентификатора способа оплаты . Сервер отвечает телом манифеста метода оплаты.

Манифест метода оплаты имеет два поля: default_applications и supported_origins .

Файл манифеста способа оплаты должен выглядеть следующим образом:

[обработчик платежей] /pay-manifest.json:

{
  "default_applications": ["https://bobbucks.dev/manifest.json"],
  "supported_origins": [
    "https://alicepay.friendsofalice.example"
  ]
}

Когда браузер считывает поле default_applications , он находит список ссылок на манифесты веб-приложений поддерживаемых платежных приложений.

При необходимости направьте браузер на поиск манифеста способа оплаты в другом месте.

URL-адрес идентификатора способа оплаты может дополнительно отвечать заголовком Link , указывающим на другой URL-адрес, по которому браузер может получить манифест метода оплаты. Это полезно, когда манифест метода оплаты размещен на другом сервере или когда платежное приложение обслуживается третьей стороной.

Настройте сервер способа оплаты так, чтобы он отвечал заголовком HTTP Link с атрибутом rel="payment-method-manifest" и URL-адресом манифеста метода оплаты .

Например, если манифест находится по адресу https://bobbucks.dev/payment-manifest.json , заголовок ответа будет включать:

Link: <https://bobbucks.dev/payment-manifest.json>; rel="payment-method-manifest"

URL-адрес может быть полным доменным именем или относительным путем. Проверьте https://bobbucks.dev/pay/ на наличие сетевого трафика, чтобы увидеть пример. Вы также можете использовать команду curl :

curl --include https://bobbucks.dev/pay

Шаг 3. Отправьте манифест веб-приложения

Манифест веб-приложения используется для определения веб-приложения, как следует из названия. Это широко используемый файл манифеста для определения прогрессивного веб-приложения (PWA) .

Типичный манифест веб-приложения будет выглядеть так:

[обработчик платежей] /manifest.json:

{
  "name": "Pay with Bobpay",
  "short_name": "Bobpay",
  "description": "This is an example of the Payment Handler API.",
  "icons": [
    {
      "src": "images/manifest/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "images/manifest/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "serviceworker": {
    "src": "service-worker.js",
    "scope": "/",
    "use_cache": false
  },
  "start_url": "/",
  "display": "standalone",
  "theme_color": "#3f51b5",
  "background_color": "#3f51b5",
  "related_applications": [
    {
      "platform": "play",
      "id": "com.example.android.samplepay",
      "min_version": "1",
      "fingerprints": [
        {
          "type": "sha256_cert",
          "value": "4C:FC:14:C6:97:DE:66:4E:66:97:50:C0:24:CE:5F:27:00:92:EE:F3:7F:18:B3:DA:77:66:84:CD:9D:E9:D2:CB"
        }
      ]
    }
  ]
}

Информация, описанная в манифесте веб-приложения, также используется для определения того, как платежное приложение отображается в пользовательском интерфейсе запроса платежа.

Свойство name манифеста веб-приложения используется в качестве имени платежного приложения, свойство icons используется в качестве значка платежного приложения.

Как Chrome определяет, какое платежное приложение запустить

Запуск платежного приложения для конкретной платформы

Для запуска платежного приложения для конкретной платформы должны быть выполнены следующие условия:

• Поле related_applications указывается в манифесте веб-приложения и:
  • Идентификатор пакета и подпись установленного приложения совпадают, а минимальная версия ( min_version ) в манифесте веб-приложения меньше или равна версии установленного приложения.
• Поле prefer_related_applications имеет значение true .
• Установлено платежное приложение для конкретной платформы, которое имеет:
  • Фильтр намерений org.chromium.action.PAY .
  • Идентификатор способа оплаты, указанный в качестве значения свойства org.chromium.default_payment_method_name .

Дополнительную информацию о том, как их настроить, можно найти в разделе «Платежные приложения для Android: руководство разработчика» .

[обработчик платежей] /manifest.json

"prefer_related_applications": true,
"related_applications": [{
  "platform": "play",
  "id": "xyz.bobpay.app",
  "min_version": "1",
  "fingerprints": [{
    "type": "sha256_cert",
    "value": "92:5A:39:05:C5:B9:EA:BC:71:48:5F:F2:05:0A:1E:57:5F:23:40:E9:E3:87:14:EC:6D:A2:04:21:E0:FD:3B:D1"
  }]
}]

Если браузер определил, что платежное приложение для конкретной платформы доступно, поток обнаружения на этом завершается. В противном случае он переходит к следующему шагу — запуску приложения для онлайн-платежей.

Запуск приложения для онлайн-платежей

Приложение для веб-платежей должно быть указано в поле serviceworker манифеста веб-приложения.

[обработчик платежей] /manifest.json:

"serviceworker": {
  "src": "payment-handler.js"
}

Браузер запускает веб-платежное приложение, отправляя событие paymentrequest работнику службы. Сервисному работнику не обязательно регистрироваться заранее. Его можно зарегистрировать вовремя .

Понимание специальных оптимизаций

Как браузеры могут пропустить пользовательский интерфейс запроса платежа и запустить платежное приложение напрямую

В Chrome при вызове метода show() объекта PaymentRequest API запроса платежа отображает предоставляемый браузером пользовательский интерфейс, называемый «UI запроса платежа». Этот пользовательский интерфейс позволяет пользователям выбирать платежное приложение. После нажатия кнопки «Продолжить» в пользовательском интерфейсе запроса платежа запускается выбранное платежное приложение.

Отображение пользовательского интерфейса запроса платежа перед запуском платежного приложения увеличивает количество шагов, необходимых пользователю для выполнения платежа. Чтобы оптимизировать процесс, браузер может делегировать выполнение этой информации платежным приложениям и запускать платежное приложение напрямую, не показывая пользовательский интерфейс запроса платежа при вызове show() .

Чтобы запустить платежное приложение напрямую, должны быть выполнены следующие условия:

• show() запускается жестом пользователя (например, щелчком мыши).
• Существует только одно платежное приложение, которое:
  • Поддерживает запрошенный идентификатор способа оплаты.

Когда приложение для онлайн-платежей регистрируется по принципу «точно в срок» (JIT)?

Платежные веб-приложения могут быть запущены без явного предварительного посещения пользователем веб-сайта платежного приложения и регистрации сервисного работника. Работник службы может быть зарегистрирован сразу же, когда пользователь решит оплатить с помощью веб-приложения для оплаты. Существует два варианта времени регистрации:

• Если пользователю отображается пользовательский интерфейс запроса платежа, приложение регистрируется своевременно и запускается, когда пользователь нажимает кнопку Продолжить .
• Если пользовательский интерфейс запроса платежа пропущен, платежное приложение регистрируется своевременно и запускается напрямую. Для пропуска пользовательского интерфейса запроса платежа для запуска своевременно зарегистрированного приложения требуется жест пользователя, который предотвращает неожиданную регистрацию сервисных работников из разных источников.

Следующие шаги

Теперь, когда ваше платежное приложение доступно для обнаружения, узнайте, как разработать платежное приложение для конкретной платформы и веб-платежное приложение.

• Платежные приложения для Android: руководство для разработчиков
• Руководство для разработчиков платежных веб-приложений