Przetwarzanie płatności w Firebase

Korzystając z kilku różnych funkcji Firebase i Stripe, możesz przetwarzać płatności do tworzenia aplikacji internetowych bez konieczności tworzenia własnej infrastruktury serwerowej. Spacer z przewodnikiem przez dostosowanie i wdrożenie własnej wersji open source cloud-functions-stripe-sample.web.app.

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

Omówienie implementacji

  1. Skonfiguruj konto Stripe.
  2. Utwórz projekt w konsoli Firebase.
  3. Włącz płatności w projekcie i skonfiguruj interfejs wiersza poleceń Firebase aby używać swojego projektu w usłudze firebase use --add.
  4. Pobierz kod źródłowy dla przykładowej aplikacji Firestripe. Skonfiguruj odpowiednio dla swojego projektu i dostosuj kod do swojej aplikacji.
  5. Po wdrożeniu aplikacji poszukaj listy użytkowników i transakcji w w konsoli Firebase.

Konfigurowanie i wdrażanie przykładowej aplikacji

  1. Pobierz kod źródłowy.
  2. Włącz usługi Google & Logowanie e-mailem 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 usługą 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 publikowania w usłudze Stripe w sekcji /public/javascript/app.js:

    const STRIPE_PUBLISHABLE_KEY=<YOUR STRIPE PUBLISHABLE KEY>;

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

    1. Wysyła wszystkie pliki z katalogu public do katalogu Hosting, dzięki czemu Twoja witryna jest dostępna.
    2. Wysyła kod znajdujący się w katalogu functions do usługi Cloud Functions for Firebase.
    3. Ustawia reguły zabezpieczeń w bazie danych Cloud Firestore zgodnie z konfiguracją w firestore.rules. Podane reguły pozwalają użytkownikowi tylko tworzyć własne formy płatności i formy 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 te funkcje działają:

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

Porównanie: cloud-functions-stripe-sample.web.app

Aby zwiększyć wygodę użytkowników, możesz dodatkowo dostosować wygląd strony płatności lub podłącz ją do istniejącej aplikacji.

Wyświetl przetworzone płatności

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

  1. Wejdź na stronę Cloud Firestore.
  2. Sprawdź listę użytkowników. Sprawdź, czy dodali karty kredytowe lub dokonali wszystkich transakcji, czyli listę transakcji każdego użytkownika.

Akceptuj płatności na żywo

Gdy wszystko będzie gotowe do publikacji, będzie trzeba wymienić klucze testowe na aktywne klawisze. Więcej informacji znajdziesz w dokumentacji Stripe. o tych kluczach.

  1. Zaktualizuj konfigurację obiektu tajnego Stripe:

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

  2. W sekcji /public/javascript/app.js ustaw klucz umożliwiający publikację na żywo.

  3. Aby zmiany zaczęły obowiązywać, ponownie wdrożyć zarówno Cloud Functions, jak i Hosting: firebase deploy.