Questa pagina è stata tradotta dall'API Cloud Translation.
Switch to English

Elabora pagamenti con Firebase

Utilizzando alcune diverse funzionalità di Firebase e Stripe, puoi elaborare i pagamenti nella tua app web senza creare la tua infrastruttura server. Questa guida ti guida attraverso la personalizzazione e la distribuzione della tua versione dell'app di esempio cloud-functions-stripe-sample.web.app open source.

Prima di iniziare, crea un progetto nella console Firebase e configura un account Stripe .

Panoramica dell'implementazione

  1. Crea un account Stripe .
  2. Crea un progetto nella console Firebase .
  3. Abilita la fatturazione per il tuo progetto e configura la CLI di Firebase per utilizzare il tuo progetto con firebase use --add .
  4. Ottieni il codice sorgente per l'app Firestripe di esempio. Configuralo con le informazioni giuste per il tuo progetto e personalizza il codice per adattarlo alla tua app.
  5. Dopo aver distribuito la tua app, cerca un elenco di utenti e transazioni nella console Firebase.

Configura e distribuisci l'app di esempio

  1. Ottieni il codice sorgente .
  2. Abilita l'accesso a Google e all'email nelle impostazioni del provider di autenticazione .
  3. Abilita Cloud Firestore .
  4. Installa la Firebase CLI se non l'hai già fatto e accedi con il firebase login .
  5. Configura questo esempio per usare il tuo progetto con firebase use --add .
  6. Installa le dipendenze localmente eseguendo le cd functions; npm install; cd -
  7. Aggiungi la tua chiave segreta dell'API Stripe alla configurazione del tuo ambiente Cloud Functions:

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

  8. Imposta la tua chiave pubblicabile Stripe in /public/javascript/app.js :

    const STRIPE_PUBLISHABLE_KEY=<YOUR STRIPE PUBLISHABLE KEY>;

  9. Distribuisci il tuo progetto utilizzando la firebase deploy . Questo comando:

    1. Invia tutti i file nella directory public a Hosting in modo che il tuo sito web sia disponibile.
    2. Invia il codice nella directory functions a Cloud Functions for Firebase.
    3. Imposta le regole di sicurezza sul tuo database Cloud Firestore come configurato in firestore.rules . Le regole fornite consentono solo a un utente di leggere e scrivere i propri pagamenti e metodi di pagamento.

Testare l'app di esempio

Visita l'URL della tua app per i pagamenti su your-firebase-project-id.web.app e verifica che le seguenti funzionalità funzionino:

  • Puoi accedere tramite Google o e-mail.
  • È possibile aggiungere una nuova scheda di prova Stripe e visualizzarla nell'elemento di selezione della scheda.
  • Puoi selezionare una delle tue carte e caricarla.
  • Puoi disconnetterti.

Per un confronto, vedi cloud-functions-stripe-sample.web.app .

Per fornire un'esperienza semplificata ai tuoi utenti, puoi personalizzare ulteriormente l'aspetto della tua pagina di pagamento o collegarla alla tua app esistente.

Visualizza i pagamenti elaborati

Dopo aver configurato e distribuito la pagina dei pagamenti, puoi controllare la console Firebase e visualizzare un elenco di utenti insieme ai loro metodi di pagamento e pagamenti.

  1. Vai a Cloud Firestore .
  2. Cerca un elenco dei tuoi utenti e, se hanno aggiunto carte di credito o effettuato transazioni, un elenco di quelli sotto ogni utente.

Accetta pagamenti in tempo reale

Una volta che sei pronto per andare in diretta, dovrai scambiare le tue chiavi di prova con le tue chiavi live. Consulta la documentazione di Stripe per saperne di più su queste chiavi.

  1. Aggiorna la tua configurazione del segreto di Stripe:

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

  2. Imposta la tua chiave pubblica in tempo reale in /public/javascript/app.js .

  3. Ridistribuisci sia Cloud Functions che Hosting affinché le modifiche firebase deploy effetto: firebase deploy .