Подключение Stripe

Настройка единовременного платежа (one time payment) через страницу оплаты Stripe.

Основа шагов совершения платежа

Шаги для успешного оборота оплаты через Stripe можно описать следующим образом:

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

Сценарий новой сессии оплаты отправляет данные для оплаты в Stripe и создает сессию платежа.

Stripe генерирует и возвращает ссылку для оплаты.

Пользователь перенаправляется по ссылке и оплачивает товар на стороне Stripe.

После успешной оплаты, Stripe отправляет вебхук в наш сценарий успешного платежа.

Сценарий успешного платежа проводит верификацию полученных данных Stripe и в случае успешной верификации отмечает сессию платежа как успешную.

Настройка Stripe

Регистрация личного кабинета Stripe: https://dashboard.stripe.com/register

Включите Test mode, для тестового режима и создайте тестовый API ключ Secret Key: https://dashboard.stripe.com/test/apikeys

Скриншот

Настроить доступные способы оплаты можно здесь (опционально): https://dashboard.stripe.com/settings/payment_methods

Создайте Webhook для отслеживания статуса платежа. Убедитесь, что вебхук - тестового режима: https://dashboard.stripe.com/test/workbench/webhooks

Скриншот

Добавьте ключевое событие для отслеживания успешного платежа - checkout.session.completed

Скриншот

💡

В Stripe доступно множество других событий для запуска вебхука, для которых тоже можно настроить специфический сценарий действий. Пример: событие checkout.session.expired которое отправляет вебхук когда время сессии платежа было исчерпано.

Создайте на стороне Creatium Max сценарий для обработки успешной оплаты. Укажите адрес сценария в конфигурацию вебхука Endpoint URL.

Скриншот

Обратите внимание на значение Signing secret - оно понадобится позже, для валидации запросов от Stripe.

Скриншот

Полезные ссылки

https://dashboard.stripe.com/ - Панель управления Stripe.

https://docs.stripe.com/checkout/quickstart?lang=node - Общая документация интеграции платежной системы.

https://docs.stripe.com/api - Документация API.

https://docs.stripe.com/testing#cards - Банковские карты для тестовых платежей.

https://docs.stripe.com/webhooks?verify=verify-manually - Документация ручной валидации вебхука.

Настройка на Creatium Max

База данных сессий платежей

Для учета сессий платежей необходима таблица со следующими колонками:

Идентификатор (id) - генерируется автоматически Creatium Max.

Идентификатор сессии в Stripe (stripe_session_id) - уникальная строка, которая назначается сессиям на стороне Stripe.

Номер транзакции (transaction_number) - уникальный номер числового формата, который может предоставляться пользователю совершившему оплату.

Статус оплаты (payment_status) - строка, для отслеживания статуса сессии платежа.

Необязательные, но полезные колонки:

Почта покупателя (buyer_email) - контактные данные пользователя, которые он оставил при совершении покупки. Для работоспособности интеграции Stripe эта колонка не важна - здесь могут храниться любые данные пользователя.

Товары (items) - необязательный массив или объект, куда будут записаны купленные товары.

Ссылка на оплату (invoice_link) - строка, содержащая в себе URL сформированный для оплаты на стороне Stripe.

Скриншот готовой таблицы

Создание страниц оплаты и отмены

Необходимы следующие страницы:

Страница оформления покупки или страница товара с формой, откуда пользователь будет перенаправлен на оплату Stripe. Сценарий создания сессии оплаты будет возвращать ссылку для оплаты и чтобы перенаправлять пользователя после генерации ссылки укажите адрес для перенаправления - <%= response %>.

Скриншот настройки формы оформления покупки

Страница успешного платежа /success - куда пользователи будут направлены после успешной оплаты. Эта страница может быть общая или шаблонная. В случае шаблонной, при каждой новом успешном платеже, пользователь будет перенаправлен на свою уникальную страницу. Шаблоны сценариев ниже созданы учитывая структуру с шаблонной страницей /transaction_page, которая подключена к базе данных сессий платежей и является дочерней страницей папки /success.

Скриншот структуры папки /success

Скриншот настройки шаблонной страницы

Страница отмены платежа /cancel - общая страница, куда пользователи будут направлены в случае отмены оплаты.

Сценарии создания сессии и успешной оплаты

Необходимы два сценария:

Сценарий создания платежной сессии - будет запущен при отправке формы со страницы покупки. Настраивается под проект. Использует API ключ Secret Key для HTTP запроса в Stripe. Шаблон сценария

💡

В шаблоне приведен пример оплаты одного товара, но формат массива items позволяет добавить множество товаров через запятую.

Пример нескольких товаров

javascript
[
  {
    "price_data": {
      "currency": "usd",
      "product_data": {
        "name": "Домашнее растение"
      },
      "unit_amount": 2000
    },
    "quantity": 1
   },
   {
    "price_data": {
      "currency": "usd",
      "product_data": {
        "name": "Удобрение"
      },
      "unit_amount": 500
    },
    "quantity": 1
   }
]

Подробнее этот объект описан в документации API Stripe здесь: https://docs.stripe.com/api/checkout/sessions/object

Сценарий успешной оплаты - будет запущен при совершении оплаты, когда Stripe отправит вебхук по событию checkout.session.completed. Содержит ручную верификацию вебхука Stripe на основе ранее созданного Signing secret вебхука и хеширования HMAC. Метод ручной верификации шифрованием описан более подробно в документации Stripe: https://docs.stripe.com/webhooks?verify=verify-manually Шаблон сценария

Тестирование и перевод ключей на live платежи

На любом из этапов подключения Stripe в тестовом режиме, оплату можно протестировать используя тестовые реквизиты банковской карты: https://docs.stripe.com/testing#cards

Панель управления вебхуками позволяет вручную отправлять любые события для тестирования сценария: https://dashboard.stripe.com/test/workbench/webhooks

После успешного тестирования, для перевода интеграции на настоящие платежи необходимо отключить в Stripe тестовый режим и пересоздать вебхук с live API ключом. “Боевой” API ключ Secret Key имеет формат sk_live_51QBX3qH.......Pg0DcH5X