Zahlungen mit Firebase verarbeiten

Wenn Sie verschiedene Firebase-Funktionen und Stripe verwenden, können Sie Zahlungen in ohne eine eigene Serverinfrastruktur erstellen zu müssen. Dieser Leitfaden führt Sie durch die die Anpassung und Bereitstellung Ihrer eigenen Version der Open-Source- Beispiel-App cloud-functions-stripe-sample.web.app

Bevor Sie beginnen, erstellen Sie ein Projekt in der Firebase Console und richten Sie ein Stripe-Konto ein.

Implementierungsübersicht

  1. Richten Sie ein Stripe-Konto ein.
  2. Erstellen Sie ein Projekt in der Firebase Console.
  3. Abrechnung für Ihr Projekt aktivieren und die Firebase-Befehlszeile konfigurieren um Ihr Projekt mit firebase use --add zu verwenden.
  4. Quellcode abrufen für die Firestripe-Beispielanwendung. Konfigurieren Sie es mit der richtigen Informationen zu Ihrem Projekt und passen Sie den Code an Ihre App an.
  5. Nachdem Sie Ihre Anwendung bereitgestellt haben, suchen Sie in mit der Firebase Console.

Beispiel-App einrichten und bereitstellen

  1. Holen Sie sich Quellcode.
  2. Google- und Melden Sie sich per E-Mail in den Einstellungen des Authentifizierungsanbieters an.
  3. Aktivieren Sie Cloud Firestore.
  4. Installieren Sie die Firebase-Befehlszeile. falls noch nicht geschehen, und melde dich mit firebase login an.
  5. Konfigurieren Sie dieses Beispiel so, dass Ihr Projekt mit firebase use --add verwendet wird.
  6. Abhängigkeiten lokal durch Ausführen von cd functions; npm install; cd - installieren

  7. Fügen Sie Ihren geheimen Schlüssel für die Stripe API hinzu. zu Ihrer Cloud Functions-Umgebungskonfiguration hinzu:

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

  8. Legen Sie Ihren Stripe-Veröffentlichungsschlüssel fest. in /public/javascript/app.js:

    const STRIPE_PUBLISHABLE_KEY=<YOUR STRIPE PUBLISHABLE KEY>;

  9. Stellen Sie Ihr Projekt mit firebase deploy bereit. Dieser Befehl:

    1. Sendet alle Dateien im Verzeichnis public an Hosting, damit Ihre Website verfügbar ist.
    2. Der Code im Verzeichnis functions wird an Cloud Functions for Firebase gesendet.
    3. Legt Sicherheitsregeln für Ihre Cloud Firestore-Datenbank gemäß der Konfiguration in firestore.rules. Die angegebenen Regeln erlauben einem Nutzer nur, ihre eigenen Zahlungen und Zahlungsmethoden erstellen.

Beispiel-App testen

Rufe die URL deiner Zahlungs-App unter your-firebase-project-id.web.app und überprüfe, ob die folgenden Funktionen funktionieren:

  • Sie können sich über Google oder per E-Mail anmelden.
  • Sie können eine neue Stripe-Testkarte hinzufügen und im Kartenauswahlelement ansehen.
  • Sie können eine Ihrer Karten auswählen und sie aufladen.
  • Sie können sich abmelden.

Zum Vergleich: cloud-functions-stripe-sample.web.app.

Um die Nutzung für Ihre Nutzer zu optimieren, können Sie Darstellung Ihrer Zahlungsseite aussehen oder sie in Ihre bestehende App einbinden.

Verarbeitete Zahlungen ansehen

Sobald Sie Ihre Zahlungsseite eingerichtet und bereitgestellt haben, Console, um eine Liste der Nutzer mit ihren Zahlungsmethoden und Zahlungen aufzurufen.

  1. Rufen Sie Cloud Firestore auf.
  2. Rufen Sie eine Liste Ihrer Nutzer auf und sehen Sie sich unter jedem Nutzer an, ob er Kreditkarten hinzugefügt oder Transaktionen durchgeführt hat.

Live-Zahlungen akzeptieren

Sobald Sie bereit sind, müssen Sie Ihre Testschlüssel gegen Ihr Live-Schlüssel. Weitere Informationen finden Sie in der Stripe-Dokumentation zu diesen Schlüsseln.

  1. Aktualisieren Sie die Konfiguration Ihres Stripe-Secrets:

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

  2. Legen Sie Ihren Live-Publishable-Schlüssel fest in /public/javascript/app.js

  3. Stellen Sie Cloud Functions und Hosting noch einmal bereit, damit die Änderungen wirksam werden: firebase deploy