Обработка платежей с помощью Firebase

Используя несколько различных функций Firebase и Stripe, вы можете обрабатывать платежи в своем веб-приложении, не создавая собственную серверную инфраструктуру. Это руководство поможет вам настроить и развернуть собственную версию примера приложения cloud-functions-stripe-sample.web.app с открытым исходным кодом.

Прежде чем начать, создайте проект в консоли Firebase и настройте учетную запись Stripe .

Обзор реализации

  1. Настройте учетную запись Stripe .
  2. Создайте проект в консоли Firebase .
  3. Включите выставление счетов для вашего проекта и настройте интерфейс командной строки Firebase для использования вашего проекта с firebase use --add .
  4. Получите исходный код примера приложения Firestripe. Настройте его с правильной информацией для вашего проекта и настройте код в соответствии с вашим приложением.
  5. После развертывания приложения найдите список пользователей и транзакций в консоли Firebase.

Настройка и развертывание примера приложения

  1. Получите исходный код .
  2. Включите вход через Google и электронную почту в настройках вашего поставщика аутентификации .
  3. Включить облачный магазин FireStore .
  4. Установите интерфейс командной строки Firebase , если вы еще этого не сделали, и войдите в систему с помощью firebase login .
  5. Настройте этот образец для использования вашего проекта с firebase use --add .
  6. Установите зависимости локально, запустив cd functions; npm install; cd -
  7. Добавьте секретный ключ Stripe API в конфигурацию среды Cloud Functions:

    firebase functions:config:set stripe.secret=<YOUR STRIPE SECRET KEY>

  8. Установите свой публикуемый ключ Stripe в /public/javascript/app.js :

    const STRIPE_PUBLISHABLE_KEY=<YOUR STRIPE PUBLISHABLE KEY>;

  9. Разверните свой проект с помощью firebase deploy . Эта команда:

    1. Отправляет все файлы в public каталоге на хостинг, чтобы ваш сайт был доступен.
    2. Отправляет код из каталога functions в Cloud Functions для Firebase.
    3. Устанавливает правила безопасности в вашей базе данных Cloud Firestore в соответствии с настройками в firestore.rules . Предоставленные правила позволяют пользователю только читать и записывать свои платежи и способы оплаты.

Протестируйте пример приложения

Посетите URL своего платежного приложения по адресу your-firebase-project-id.web.app и убедитесь, что следующие функции работают:

  • Вы можете войти через Google или электронную почту.
  • Вы можете добавить новую тестовую карту Stripe и просмотреть ее в элементе выбора карты.
  • Вы можете выбрать одну из своих карт и пополнить ее.
  • Вы можете выйти.

Для сравнения см. cloud-functions-stripe-sample.web.app .

Чтобы упростить работу пользователей, вы можете дополнительно настроить внешний вид платежной страницы или подключить ее к существующему приложению.

Просмотр обработанных платежей

После того, как вы настроили и развернули свою страницу платежей, вы можете проверить консоль Firebase и увидеть список пользователей, а также их способы оплаты и платежи.

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

Принимайте живые платежи

Когда вы будете готовы к запуску, вам нужно будет обменять свои тестовые ключи на живые. См. документы Stripe , чтобы узнать больше об этих ключах.

  1. Обновите секретную конфигурацию Stripe:

    firebase functions:config:set stripe.secret=<YOUR STRIPE LIVE SECRET KEY>

  2. Установите активный публикуемый ключ в /public/javascript/app.js .

  3. Повторно разверните облачные функции и хостинг, чтобы изменения вступили в силу: firebase deploy .