Vai al contenuto principale

Documentation Index

Fetch the complete documentation index at: https://lovable.generaltranslation.app/llms.txt

Use this file to discover all available pages before exploring further.

Integra Stripe in Lovable Lovable ora ti permette di configurare Stripe interamente tramite chat. Configurazione automatica guidata dalla chat (consigliata)
Dopo aver collegato Supabase e salvato la tua Stripe Secret Key tramite Add API Key, ti basta descrivere quello che ti serve:
  • “Aggiungi tre piani di abbonamento…”
  • “Crea un checkout una tantum per il mio e‑book a $29”
    Lovable genera le Edge Functions per checkout/portale, le tabelle di database con RLS e i pulsanti dell’interfaccia utente—senza bisogno di scrivere codice o configurare webhook manualmente, a meno che tu non lo richieda.
  • Per le vendite una tantum, assicurati che il tuo carrello o la pagina prodotto funzionino già.
  • Per gli abbonamenti, verifica che Supabase Auth sia già configurato, così Lovable può collegare i clienti Stripe all’id di ogni utente

​
Punti chiave

  • Usa il flusso guidato dalla chat sia per gli abbonamenti sia per i pagamenti una tantum.
  • Non incollare mai la tua Stripe Secret Key in chat. Configurala tramite il modulo Add API Key direttamente in chat.
  • I webhook sono facoltativi. Lovable si basa sul polling tramite Edge Functions, a meno che tu non richieda i webhook.
  • Esegui il debug in Console del browser → Network/Errors, Supabase → Edge Functions → Registri e Stripe Dashboard → Registri.
  • Testa sempre in Stripe Test Mode, poi distribuisci.

​
Requisiti

Prima di integrare Stripe, assicurati di soddisfare i seguenti prerequisiti:
  • Il progetto deve essere connesso a Supabase. Scopri di più su Supabase
  • Un account Stripe con prodotti configurati correttamente.
  • Un frontend e backend funzionanti:
    • Per la vendita di singoli prodotti, assicurati che il carrello e la pagina di checkout siano funzionanti.
    • Per gli abbonamenti, configura le funzionalità di login e i diversi piani tariffari.
Nota bene L’integrazione con Stripe non funziona in anteprima. Per testare l’integrazione, assicurati di distribuire. Assicurati anche di essere in modalità test in Stripe quando provi la funzionalità. Durante il test del pagamento, il numero di carta 4242 4242 4242 4242, qualsiasi combinazione di 3 cifre come CVC e qualsiasi data futura verranno accettati come carta valida.

​
Configurazione dei pagamenti Stripe (flusso di chat no‑code)

Lovable ora genera tutta la logica Stripe per te. Una volta che la tua Stripe Secret Key è configurata tramite il modulo in chat Add API Key e il tuo progetto è connesso a Supabase, ti basta dire in chat a Lovable di cosa hai bisogno—nessun Payment Link manuale necessario.
1

Passaggio 1

Prepara il tuo progetto
  • Supabase collegato
  • Stripe Secret Key aggiunta tramite il modulo in chat Add API Key
  • (Opzionale) Prezzi o ID prodotto a portata di mano
2

Passaggio 2

Esempi:
  • Crea un checkout una tantum per il mio “Digital Course” a $29
  • Configura un piano Premium annuale a $99, collegato all’id di ogni utente
3

Passaggio 3

Rivedi e applica Lovable genera automaticamente le Edge Functions, le tabelle del database e i componenti UI (tutti collegati all’id dell’utente in Supabase). Controlla l’anteprima, quindi fai clic su Apply per distribuire.
  • Gli abbonamenti dovrebbero sempre essere collegati all’id dell’utente autenticato in Supabase per garantire un accesso sicuro basato sui ruoli.

​
Integrazione avanzata: Webhooks e Supabase

Per strutture di pagamento complesse come abbonamenti e accesso basato sui ruoli, Lovable consiglia di usare Supabase per gestire in modo sicuro l’integrazione con Stripe. Questo permette una corretta gestione dei webhook, la gestione degli abbonamenti e il controllo degli accessi basato sui ruoli in base ai piani di pagamento.
La funzione edge che gestisce le modifiche necessarie all’account utente dovrebbe essere configurata automaticamente dall’AI.
1

Collega Supabase al tuo Progetto

Iniziare è semplice. Lovable rende la connessione a Supabase immediata con un’integrazione nativa già inclusa:
  1. Fai clic sul pulsante Supabase nell’angolo in alto a destra di Lovable.
  2. Segui le istruzioni per collegare il tuo progetto.
  3. Una volta collegato, Supabase abilita l’elaborazione sicura dei pagamenti, la gestione degli abbonamenti, la gestione dei webhook, l’archiviazione dei dati dei clienti e la gestione degli errori.
2

Elaborazione sicura dei pagamenti

Avvia il processo dando un’istruzione a Lovable:
Colleghiamo Stripe al mio progetto. Inizieremo con l’elaborazione sicura dei pagamenti.
Lovable genererà lo schema SQL necessario per gestire i pagamenti. Questo include tabelle del database per utenti, abbonamenti e pagamenti. Puoi esaminare e personalizzare queste tabelle in base alle esigenze specifiche del tuo prodotto prima di applicare le modifiche.
3

Implementare Edge Functions per i webhook

Le Edge Functions in Supabase agiscono come piccole funzioni serverless ad alte prestazioni che vengono eseguite vicino all’utente, garantendo risposte rapide. Aiutano a elaborare gli eventi dei webhook, come le conferme di pagamento, prima di aggiornare il database.
1

Step 1

Recupera l’URL dell’endpoint dalla funzione edge in Supabase.
2

Step 2

Vai alla dashboard di Stripe > Developers > Webhooks > Create an Event Destination.Stripe API Key
3

Step 3

Seleziona gli eventi webhook che corrispondono alle esigenze del tuo progetto:
  • payment_intent.succeeded
  • payment_intent.payment_failed
  • customer.subscription.created
  • customer.subscription.updated
  • customer.subscription.deleted
4

Step 4

Inserisci l’URL dell’endpoint da Supabase.
5

Step 5

Copia il Webhook Secret e conservalo in modo sicuro in Supabase → Edge Functions → Manage Secrets → Add New Secret.
Se non sei sicuro di come chiamare il segreto, chiedi indicazioni a Lovable in chat mode.
4

Aggiungere le chiavi API in modo sicuro

Per integrare Stripe in modo sicuro, evita di condividere direttamente la tua chiave API in chat. Invece:
1

Step 1

Vai alla dashboard di Stripe > Developers > API Keys.
2

Step 2

Copia la Secret Key (NON incollarla direttamente nella chat di Lovable).
3

Step 3

Usa la funzionalità Lovable “Add API Key” per archiviarla in modo sicuro.
Importante avviso di sicurezzaNon incollare mai la tua Secret Key direttamente nella chat di Lovable. Trattala come le chiavi di casa tua: esporla potrebbe consentire accessi non autorizzati al tuo account Stripe. Invece, conservala in modo sicuro usando la funzionalità delle chiavi API di Lovable.
5

Testare la tua integrazione

  • Usa la modalità di test di Stripe per testare i pagamenti in sicurezza.
  • Dati della carta di test:
    • Numero della carta: 4242 4242 4242 4242
    • Qualsiasi data di scadenza futura
    • Qualsiasi CVC a 3 cifre
  • Distribuisci la tua app—l’integrazione con Stripe non funziona in modalità Anteprima.

​
Debug e risoluzione dei problemi

1

Step 1

Apri Developer Tools (clic destro > Ispeziona > Console in Chrome).
2

Step 2

Cerca errori ed esamina i registri degli eventi webhook.
3

Step 3

Copia i messaggi di errore e chiedi a Lovable assistenza per il debug.
1

Step 1

Vai alla Supabase Dashboard
2

Step 2

Vai su Edge Functions
3

Step 3

Apri i registri per verificare eventuali errori dei webhook.
1

Step 1

Vai alla Stripe Dashboard
2

Step 2

Apri i registri dei webhook
3

Step 3

Verifica che Stripe stia inviando i dati correttamente.
1

Step 1

Passa a Chat mode e fai a Lovable domande di approfondimento.
2

Step 2

Fai a Lovable domande di approfondimento.
3

Step 3

Usa il Metodo Rubber Duck e spiega il tuo problema passo dopo passo per chiarire la situazione.