Elaborazione dei pagamenti con Firebase

Utilizzando alcune funzionalità di Firebase e Stripe, puoi elaborare i pagamenti nella tua app web senza creare la tua infrastruttura di server. Questa guida ti illustra la procedura per personalizzare e implementare la tua versione dell'app di esempio open source cloud-functions-stripe-sample.web.app.

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

Panoramica dell'implementazione

1. Configura un account Stripe.
2. Crea un progetto nella Console Firebase.
3. Esegui l'upgrade del progetto al piano tariffario Blaze con pagamento a consumo.
4. Configura l'interfaccia a riga di comando Firebase in modo da utilizzare il tuo progetto con firebase use --add.
5. Recupera il codice sorgente per l'app Firestripe di esempio. Configuralo con le informazioni corrette per il tuo progetto e personalizza il codice in base alle tue esigenze.
6. Una volta dispiegato l'app, cerca un elenco di utenti e transazioni nella Console Firebase.

Configura ed esegui il deployment dell'app di esempio

1. Recupera il codice sorgente.
2. Attiva l'accesso con Google e l'accesso con email nelle impostazioni del provider di autenticazione.
3. Attiva Cloud Firestore.
4. Se non l'hai ancora fatto, installa l'interfaccia a riga di comando Firebase e accedi con firebase login.
5. Configura questo esempio per utilizzare il tuo progetto con firebase use --add.
6. Installa le dipendenze localmente eseguendo cd functions; npm install; cd -

7. Aggiungi la chiave segreta dell'API Stripe alla configurazione dell'ambiente Cloud Functions:

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

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

   const STRIPE_PUBLISHABLE_KEY=<YOUR STRIPE PUBLISHABLE KEY>;

9. Esegui il deployment del progetto utilizzando 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 nel database Cloud Firestore come configurato in firestore.rules. Le regole fornite consentono a un utente di leggere e scrivere solo i propri pagamenti e metodi di pagamento.

Testa l'app di esempio

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

• Puoi accedere tramite Google o email.
• Puoi aggiungere una nuova carta di test Stripe e visualizzarla nell'elemento di selezione della carta.
• Puoi selezionare una delle tue carte e addebitare l'importo.
• Puoi uscire.

Per il confronto, consulta cloud-functions-stripe-sample.web.app.

Per offrire un'esperienza semplificata agli utenti, puoi personalizzare ulteriormente l'aspetto della pagina di pagamento o collegarla all'app esistente.

Visualizzare i pagamenti elaborati

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

1. Vai a Cloud Firestore.
2. Controlla se è presente un elenco dei tuoi utenti e, se hanno aggiunto carte di credito o effettuato transazioni, un elenco di queste per ciascun utente.

Accettare pagamenti in tempo reale

Quando è tutto pronto per la pubblicazione, dovrai sostituire le chiavi di test con quelle di produzione. Per saperne di più su queste chiavi, consulta la documentazione di Stripe.

1. Aggiorna la configurazione del secret Stripe:

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

2. Imposta la chiave pubblicabile dal vivo in /public/javascript/app.js.

3. Esegui nuovamente il deployment di Cloud Functions e Hosting per applicare le modifiche: firebase deploy.