Przetwarzanie płatności w Firebase

Korzystając z kilku różnych funkcji Firebase i Stripe, możesz przetwarzać płatności w aplikacji internetowej bez tworzenia własnej infrastruktury serwerowej. Ten przewodnik przeprowadzi Cię przez proces dostosowywania i wdrażania własnej wersji przykładowej aplikacji open source cloud-functions-stripe-sample.web.app.

Zanim zaczniesz, utwórz projekt w konsoli Firebase i skonfiguruj konto Stripe.

Omówienie wdrożenia

  1. Skonfiguruj konto Stripe.
  2. Utwórz projekt w konsoli Firebase.
  3. Przenieś projekt na abonament Blaze z płatnością według wykorzystania.
  4. Skonfiguruj Firebase CLI do korzystania z Twojego projektu za pomocą firebase use --add.
  5. Pobierz kod źródłowy przykładowej aplikacji Firestripe. Skonfiguruj go, podając odpowiednie informacje o projekcie, i dostosuj kod do swojej aplikacji.
  6. Po wdrożeniu aplikacji w konsoli Firebase znajdziesz listę użytkowników i transakcji.

Konfigurowanie i wdrażanie przykładowej aplikacji

  1. Pobierz kod źródłowy.
  2. Włącz logowanie przez Google i e-mail w ustawieniach dostawcy uwierzytelniania.
  3. Włącz Cloud Firestore.
  4. Zainstaluj wiersz poleceń Firebase, jeśli jeszcze tego nie zrobiono, i zaloguj się za pomocą firebase login.
  5. Skonfiguruj ten przykład, aby używać projektu z firebase use --add.
  6. Zainstaluj zależności lokalnie, uruchamiając cd functions; npm install; cd -

  7. Dodaj tajny klucz interfejsu Stripe API do konfiguracji środowiska Cloud Functions:

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

  8. Ustaw klucz publiczny Stripe w /public/javascript/app.js:

    const STRIPE_PUBLISHABLE_KEY=<YOUR STRIPE PUBLISHABLE KEY>;

  9. Wdróż projekt za pomocą firebase deploy. To polecenie:

    1. Wysyła wszystkie pliki z katalogu public do Hosting, aby Twoja witryna była dostępna.
    2. Wysyła kod z katalogu functions na adres Cloud Functions for Firebase.
    3. Ustawia reguły zabezpieczeń w bazie danych Cloud Firestore zgodnie z konfiguracją w firestore.rules. Podane reguły umożliwiają użytkownikowi tylko odczytywanie i zapisywanie własnych płatności i form płatności.

Testowanie przykładowej aplikacji

Otwórz adres URL aplikacji do płatności your-firebase-project-id.web.app i sprawdź, czy działają te funkcje:

  • Możesz zalogować się przez Google lub e-mail.
  • Możesz dodać nową kartę testową Stripe i wyświetlić ją w elemencie wyboru karty.
  • Możesz wybrać jedną z kart i ją obciążyć.
  • Możesz się wylogować.

Porównaj z cloud-functions-stripe-sample.web.app.

Aby zapewnić użytkownikom wygodę, możesz dodatkowo dostosować wygląd strony płatności lub zintegrować ją z dotychczasową aplikacją.

Wyświetlanie przetworzonych płatności

Po skonfigurowaniu i wdrożeniu strony płatności możesz otworzyć konsolę Firebase i zobaczyć listę użytkowników wraz z ich formami płatności i płatnościami.

  1. Otwórz stronę Cloud Firestore.
  2. Sprawdź listę użytkowników, a jeśli dodali oni karty kredytowe lub dokonali transakcji, zobacz listę tych elementów pod każdym użytkownikiem.

Akceptowanie płatności na żywo

Gdy wszystko będzie gotowe do rozpoczęcia transmisji na żywo, musisz wymienić klucze testowe na klucze produkcyjne. Więcej informacji o tych kluczach znajdziesz w dokumentacji Stripe.

  1. Zaktualizuj konfigurację klucza tajnego Stripe:

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

  2. Ustaw klucz publiczny w wersji produkcyjnej w /public/javascript/app.js.

  3. Aby zmiany zostały wprowadzone, ponownie wdróż zarówno Cloud Functions, jak i Hosting:firebase deploy