Salvare i dati di pagamento durante il pagamento

Come accettare un pagamento e salvare i dati di pagamento del cliente per acquisti futuri

Utilizza Stripe Checkout per incorporare un modulo di pagamento predefinito sul tuo sito web che consente ai clienti di salvare i dati di pagamento per acquisti futuri.

Configurare Stripe
Lato server

Innanzitutto registrati per creare un account Stripe.

Utilizza le nostre librerie ufficiali per accedere all’API Stripe dalla tua applicazione:

Creare un cliente
Lato server

Per configurare una carta per pagamenti futuri, devi associarla a un Customer. Crea un oggetto Customer quando il cliente crea un account con la tua azienda. Un oggetto Customer ti permette di riutilizzare modalità di pagamento e monitorare più pagamenti.

Una creazione riuscita restituisce l’oggetto Customer. Puoi controllare l’oggetto per trovare l’id del cliente e memorizzare il valore nel database per poterlo recuperare successivamente.

Puoi trovare questi clienti nella pagina Clienti della Dashboard.

Creare una sessione di Checkout
Lato server

Dal tuo server, crea una sessione di Checkout e imposta la ui_mode su embedded. Puoi configurare la sessione di Checkout con voci riga per includere opzioni come valuta.

Puoi anche creare una sessione di Checkout per un cliente esistente, che ti consente di precompilare i campi di Checkout con le informazioni di contatto note e di unificare la cronologia degli acquisti per quel cliente.

Per riportare i clienti a una pagina personalizzata che ospiti sul tuo sito, specifica l’URL della pagina nel parametro return_url. Includi la variabile del modello {CHECKOUT_SESSION_ID} nell’URL per recuperare lo stato della sessione nella pagina di ritorno. Checkout sostituisce automaticamente la variabile con l’ID della sessione di Checkout prima del reindirizzamento.

Scopri di più sulla configurazione della pagina di ritorno e su altre opzioni per personalizzare il comportamento di reindirizzamento.

Dopo aver creato la sessione di Checkout, utilizza il parametro client_secret restituito nella risposta a mount Checkout.

Montare Checkout
Lato client
Lato server

Checkout è disponibile come parte di Stripe.js. Includi lo script Stripe.js nella tua pagina aggiungendolo all’inizio del file HTML. Poi crea un nodo DOM vuoto (contenitore) da utilizzare per il montaggio.

index.html
<head>
  <script src="https://js.stripe.com/v3/"></script>
</head>
<body>
  <div id="checkout">
    <!-- Checkout will insert the payment form here -->
  </div>
</body>

Inizializza Stripe.js con la tua chiave API pubblicabile.

Crea una funzione asincrona fetchClientSecret che invia una richiesta al server per creare la sessione di Checkout e recuperare la chiave privata client. Specifica questa funzione in options quando crei l’istanza di Checkout.

index.js
// Initialize Stripe.js
const stripe = Stripe('pk_test_TYooMQauvdEDq54NiTphI7jx'
);

initialize();

// Fetch Checkout Session and retrieve the client secret
async function initialize() {
  const fetchClientSecret = async () => {
    const response = await fetch("/create-checkout-session", {
      method: "POST",
    });
    const { clientSecret } = await response.json();
    return clientSecret;
  };

  // Initialize Checkout
  const checkout = await stripe.initEmbeddedCheckout({
    fetchClientSecret,
  });

  // Mount Checkout
  checkout.mount('#checkout');
}

Checkout viene visualizzato in un iframe che invia a Stripe le informazioni sul pagamento in modo sicuro tramite una connessione HTTPS.

Errore comune

Evita di inserire Checkout all’interno di un altro iframe, perché alcuni metodi di pagamento richiedono il reindirizzamento a un’altra pagina per la conferma del pagamento.

Salvare il metodo di pagamento
Lato server

Dopo aver configurato l’integrazione di Checkout incorporato, scegli una configurazione per la tua integrazione in modo da salvare i metodi di pagamento utilizzati dai clienti.

Per impostazione predefinita, i metodi di pagamento utilizzati per effettuare un pagamento una tantum con Checkout non sono disponibili per usi futuri.

Salvare i metodi di pagamento per effettuare gli addebiti all’esterno della sessione

Puoi impostare Checkout in modo tale che salvi i metodi di pagamento utilizzati per un pagamento una tantum specificando l’argomento payment_intent_data.setup_future_usage. Questa opzione è utile se devi acquisire un metodo di pagamento registrato per utilizzarlo per commissioni future, ad esempio in caso di annullamento o no-show.

Se utilizzi Checkout in modalità subscription, Stripe salva automaticamente i metodi di pagamento per effettuare gli addebiti dei pagamenti successivi. I metodi di pagamento con carta salvati utilizzando la modalità setup_future_usage o subscription non vengono visualizzati per gli acquisti successivi al primo in Checkout (ulteriori informazioni di seguito). Ti suggeriamo di utilizzare un testo personalizzato che includa link a tutte le condizioni relative all’utilizzo dei dati di pagamento salvati.

Attenzione

Le leggi sulla privacy globali sono complicate e dettagliate. Ti consigliamo di contattare il tuo team legale e di privacy prima di implementare setup_future_usage perché potrebbe avere effetti sul tuo attuale quadro normativo sulla privacy. Per ulteriori informazioni sul salvataggio dei dati di pagamento, consulta le linee guida emesse dal Comitato europeo per la protezione dei dati.

Salva i metodi di pagamento per precompilarle in Checkout

Per impostazione predefinita, Checkout utilizza Link per offrire ai clienti la possibilità di salvare e riutilizzare in modo sicuro i dati di pagamento. Se preferisci gestire in maniera autonoma i metodi di pagamento, utilizza saved_payment_method_options.payment_method_save quando crei una sessione di Checkout per consentire ai clienti di salvare i metodi di pagamento per gli acquisti futuri in Checkout.

Se specifichi questo parametro in modalità payment o subscription, viene visualizzata una casella di controllo facoltativa che consente ai clienti di salvare esplicitamente il metodo di pagamento per acquisti futuri. Quando i clienti selezionano questa casella di controllo, Checkout salva il metodo di pagamento con allow_redisplay: always. Checkout utilizza questo parametro per stabilire se un metodo di pagamento può essere precompilato per gli acquisti futuri. Quando utilizzi saved_payment_method_options.payment_method_save, non devi specificare setup_future_usage per salvare il metodo di pagamento.

Devi specificare un oggetto Customer se utilizzi saved_payment_method_options.payment_method_save. Per salvare un nuovo cliente, imposta la customer_creation della sessione di Checkout su always, altrimenti la sessione non salva il cliente o il metodo di pagamento.

Se payment_method_save non viene specificato o se il cliente non accetta di salvare il metodo di pagamento, Checkout salva comunque i metodi di pagamento creati in modalità subscription o utilizzando setup_future_usage. Questi metodi di pagamento hanno un valore allow_redisplay impostato su limited, che impedisce che vengano precompilati per gli acquisti successivi al primo e consentono di rispettare le regole del circuito della carta e le normative sulla protezione dei dati. Scopri come modificare il comportamento predefinito abilitato da questi metodi e come modificare o ignorare il comportamento allow_redisplay.

Nota

Puoi utilizzare Checkout per salvare le carte e altri metodi di pagamento per effettuare addebiti all’esterno della sessione, ma Checkout precompila solo le carte salvate. Scopri come precompilare le carte salvate. Per salvare un metodo di pagamento senza un pagamento iniziale, utilizza Checkout in modalità configurazione.