Przetwarzaj płatności za pomocą Firebase

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

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 za projekt i skonfiguruj interfejs wiersza polecenia Firebase, aby używać projektu z firebase use --add .
4. Pobierz kod źródłowy przykładowej aplikacji Firestripe. Skonfiguruj go za pomocą odpowiednich informacji dla swojego projektu i dostosuj kod, aby pasował do Twojej aplikacji.
5. Po wdrożeniu aplikacji poszukaj listy użytkowników i transakcji w konsoli Firebase.

Skonfiguruj i wdróż przykładową aplikację

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

7. Dodaj swój tajny klucz Stripe API do konfiguracji środowiska Cloud Functions:

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

8. Ustaw swój publikowalny klucz Stripe w /public/javascript/app.js :

   const STRIPE_PUBLISHABLE_KEY=<YOUR STRIPE PUBLISHABLE KEY>;

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

   1. Wysyła wszystkie pliki z katalogu public do usługi Hosting, aby Twoja witryna była dostępna.
   2. Wysyła kod z katalogu functions do Cloud Functions for Firebase.
   3. Ustawia reguły bezpieczeństwa w bazie danych Cloud Firestore zgodnie z konfiguracją w firestore.rules . Podane zasady pozwalają użytkownikowi tylko odczytywać i zapisywać własne płatności i metody płatności.

Przetestuj przykładową aplikację

Odwiedź adres URL aplikacji do płatności pod adresem your-firebase-project-id.web.app i sprawdź, czy działają następujące 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ą ze swoich kart i ją naładować.
• Możesz się wylogować.

Dla porównania zobacz cloud-functions-stripe-sample.web.app .

Aby zapewnić użytkownikom lepsze wrażenia, możesz dodatkowo dostosować wygląd strony płatności lub podłączyć ją do istniejącej aplikacji.

Wyświetl przetworzone płatności

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

1. Przejdź do Cloud Firestore .
2. Sprawdź listę swoich użytkowników i, jeśli dodali jakieś karty kredytowe lub dokonali jakichkolwiek transakcji, listę tych pod każdym użytkownikiem.

Akceptuj płatności na żywo

Gdy będziesz gotowy do transmisji na żywo, musisz wymienić klucze testowe na klucze aktywne. Zobacz dokumentację Stripe, aby dowiedzieć się więcej o tych klawiszach.

1. Zaktualizuj swoją tajną konfigurację Stripe:

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

2. Ustaw swój klucz do publikacji na żywo w /public/javascript/app.js .

3. Ponownie wdróż funkcje Cloud Functions i Hosting, aby zmiany zaczęły obowiązywać: firebase deploy .