Accettare un pagamento Afterpay o Clearpay
Scopri come accettare Afterpay (nota anche come Clearpay nel Regno Unito), una modalità di pagamento utilizzata in Stati Uniti, Canada, Regno Unito, Australia e Nuova Zelanda.
Attenzione
Il contenuto di questa sezione fa riferimento a un prodotto precedente. Per conoscere il percorso di integrazione più recente, consulta la guida Accettare un pagamento. Sebbene Stripe supporti ancora questo prodotto, qualora il prodotto dovesse diventare obsoleto questo tipo di assistenza potrebbe terminare.
Gli utenti Stripe possono usare l’API Payment Intents con un percorso di integrazione unico per creare pagamenti utilizzando qualsiasi modalità supportata per accettare pagamenti Afterpay da clienti nei seguenti Paesi:
- Australia
- Canada
- Nuova Zelanda
- Regno Unito
- Stati Uniti
Afterpay è un metodo di pagamento monouso con notifica immediata che richiede ai clienti di autenticare il pagamento. I clienti vengono reindirizzati al sito Afterpay dove possono accettare i termini di un piano di rateizzazione. Quando il cliente accetta i termini, i fondi vengono garantiti e trasferiti sul tuo account Stripe. Il cliente ripaga direttamente Afterpay nel tempo.
Nota
Prima di avviare l’integrazione, assicurati che il tuo account sia idoneo per Afterpay accedendo alle impostazioni dei metodi di pagamento.
Configurare StripeLato serverLato client
Lato server
Per questa integrazione sono necessari endpoint sul server che parlano con l’API Stripe. Utilizza le nostre librerie ufficiali per accedere all’API Stripe dal tuo server:
Lato client
L’SDK React Native è open source e completamente documentato. Internamente, utilizza SDK iOS nativi e Android. Per installare l’SDK React Native di Stripe, esegui uno dei seguenti comandi nella directory del progetto (a seconda del gestore di pacchetti utilizzato):
Poi, installa alcune altre dipendenze necessarie:
- Per iOS, vai alla directory ios ed esegui pod installper garantire di installare anche le dipendenze native richieste.
- Per Android, non ci sono più dipendenze da installare.
Nota
Per aggiungere l’assistenza di TypeScript, ti consigliamo di consultare e seguire le indicazioni incluse nella guida ufficiale di TypeScript.
Inizializzazione di Stripe
Per inizializzare Stripe nell’app React Native, esegui il wrapping della schermata di pagamento con il componente StripeProvider oppure utilizza il metodo di inizializzazione initStripe. È richiesta solo la chiave pubblicabile dell’API in publishableKey. L’esempio seguente spiega come inizializzare Stripe utilizzando il componente StripeProvider.
import { useState, useEffect } from 'react'; import { StripeProvider } from '@stripe/stripe-react-native'; function App() { const [publishableKey, setPublishableKey] = useState(''); const fetchPublishableKey = async () => { const key = await fetchKey(); // fetch key from your server here setPublishableKey(key); }; useEffect(() => { fetchPublishableKey(); }, []); return ( <StripeProvider publishableKey={publishableKey} merchantIdentifier="merchant.identifier" // required for Apple Pay urlScheme="your-url-scheme" // required for 3D Secure and bank redirects > {/* Your app code here */} </StripeProvider> ); }
Nota
Usa le chiavi di test dell’API durante i test e le attività di sviluppo e le chiavi della modalità live quando pubblichi l’app.
Creare un PaymentIntentLato serverLato client
Un PaymentIntent è un oggetto che rappresenta la tua intenzione di riscuotere un pagamento da un cliente e traccia il ciclo di vita del processo di pagamento in ogni sua fase.
Lato server
Innanzitutto crea un PaymentIntent sul tuo server e specifica l’importo da riscuotere e la valuta. Se hai già un’integrazione che utilizza l’API Payment Intents, aggiungi afterpay_ all’elenco dei tipi di metodi di pagamento per il tuo PaymentIntent.
Lato client
Nel PaymentIntent restituito è presente una chiave privata client, che il client può utilizzare per completare la procedura di pagamento in modo sicuro anziché specificare tutto l’oggetto PaymentIntent. Sul lato client, richiedi un PaymentIntent dal tuo server e memorizza la chiave privata client.
const fetchPaymentIntentClientSecret = async () => { const response = await fetch(`${API_URL}/create-payment-intent`, { method: 'POST', headers: { 'Content-Type': 'application/json', }, body: JSON.stringify({ currency: 'usd', payment_method_types: ['afterpay_clearpay'], }), }); const {clientSecret, error} = await response.json(); return {clientSecret, error}; };
Raccogliere i dati relativi alla modalità di pagamentoLato client
Perché il pagamento vada a buon fine, Afterpay ha bisogno che siano presenti i dati di fatturazione. Nella tua app, acquisisci dal cliente i dati di fatturazione necessari:
- Nome e cognome
- Indirizzo email
- Indirizzo di fatturazione completo
Inoltre, anche se i dettagli di spedizione non sono obbligatori, possono aiutare a migliorare i tassi di autenticazione. Per raccogliere i dettagli di spedizione, acquisisci dal cliente quanto segue:
- Nome completo
- Indirizzo di spedizione completo
export default function AfterpayClearpayPaymentScreen() { const [email, setEmail] = useState(''); const handlePayPress = async () => { const billingDetails: PaymentMethodCreateParams.BillingDetails = { email, phone: '+48888000888', addressCity: 'Houston', addressCountry: 'US', addressLine1: '1459 Circle Drive', addressLine2: 'Texas', addressPostalCode: '77063', name: 'Jenny Rosen', }; // Shipping details are optional but recommended to pass in. const shippingDetails: PaymentMethodCreateParams.ShippingDetails = { addressLine1: '1459 Circle Drive', addressCountry: 'US', addressPostalCode: '77063', name: 'Jenny Rosen', }; // ... }; return ( <Screen> <TextInput placeholder="E-mail" onChange={(value) => setEmail(value.nativeEvent.text)} /> </Screen> ); }
Inviare il pagamento a StripeLato client
Recupera la chiave privata client dal PaymentIntent che hai creato e chiama confirmPayment. La chiave privata client deve essere gestita con cura in quanto può effettuare l’addebito. Non registrarla, non inserirla negli URL e mostrala solo al cliente.
export default function AfterpayClearpayPaymentScreen() { const [email, setEmail] = useState(''); const handlePayPress = async () => { // ... const {error, paymentIntent} = await confirmPayment(clientSecret, { paymentMethodType: 'AfterpayClearpay', paymentMethodData: { billingDetails, // Shipping details are optional but recommended to pass in. shippingDetails, }, }); if (error) { Alert.alert(`Error code: ${error.code}`, error.message); } else if (paymentIntent) { Alert.alert( 'Success', `The payment was confirmed successfully! currency: ${paymentIntent.currency}`, ); } }; return <Screen>{/* ... */}</Screen>; }
FacoltativoGestire il deep linking
Quando un cliente esce dalla tua app (ad esempio, per autenticarsi in Safari o nell’app della sua banca), offri un modo per tornare automaticamente alla tua app. Molti metodi di pagamento require un URL di reindirizzamento. Se non ne fornisci uno, non possiamo mostrare agli utenti i metodi di pagamento che richiedono un URL di reindirizzamento, anche se li hai abilitati.
Per fornire un URL di ritorno:
- Registra un URL personalizzato. I link universali non sono supportati.
- Configura il tuo URL personalizzato.
- Configura il tuo componente principale per inoltrare l’URL all’SDK di Stripe come mostrato di seguito.
Nota
Se utilizzi Expo, imposta il tuo schema nel file app..
import { useEffect, useCallback } from 'react'; import { Linking } from 'react-native'; import { useStripe } from '@stripe/stripe-react-native'; export default function MyApp() { const { handleURLCallback } = useStripe(); const handleDeepLink = useCallback( async (url: string | null) => { if (url) { const stripeHandled = await handleURLCallback(url); if (stripeHandled) { // This was a Stripe URL - you can return or add extra handling here as you see fit } else { // This was NOT a Stripe URL – handle as you normally would } } }, [handleURLCallback] ); useEffect(() => { const getUrlAsync = async () => { const initialUrl = await Linking.getInitialURL(); handleDeepLink(initialUrl); }; getUrlAsync(); const deepLinkListener = Linking.addEventListener( 'url', (event: { url: string }) => { handleDeepLink(event.url); } ); return () => deepLinkListener.remove(); }, [handleDeepLink]); return ( <View> <AwesomeAppComponent /> </View> ); }
Per ulteriori informazioni sugli schemi di URL nativi, consulta la documentazione relativa ad Android e a iOS.
FacoltativoAggiungere voci riga al PaymentIntent
Puoi accettare i dati delle voci riga per fornire più segnali di rischio ad Afterpay. Questa funzionalità è attualmente in versione beta privata. Per richiedere l’accesso, contattaci.
FacoltativoSeparare l'autorizzazione dall'acquisizione
Anziché separare l’autorizzazione dall’acquisizione per i pagamenti con carta, Afterpay addebita al cliente la prima rata del pagamento al momento dell’autorizzazione. Poi hai fino a 13 giorni dopo l’autorizzazione per acquisire il resto del pagamento. Se non acquisisci il pagamento in questo intervallo di tempo, il cliente riceve un rimborso della prima rata e non gli vengono addebitate altre rate. In questi casi, Stripe annulla anche il PaymentIntent e invia un evento payment_intent.canceled.
Se sai di non poter acquisire il pagamento, ti consigliamo di annullare il PaymentIntent anziché attendere che trascorrano i 13 giorni. Se annulli in modo proattivo il PaymentIntent, il cliente riceve immediatamente il rimborso della prima rata, evitando confusioni sugli addebiti sul suo estratto conto.
Indicare a Stripe di eseguire solo l’autorizzazione 
Per indicare che vuoi separare l’autorizzazione dall’acquisizione, imposta capture_method su manual quando crei il PaymentIntent. Il parametro indica a Stripe di limitarsi ad autorizzare l’importo sul conto Afterpay del cliente.
In seguito alla concessione dell’autorizzazione, Stripe invia un evento payment_intent.amount_capturable_updated. Consulta la nostra Guida agli eventi per saperne di più.
Acquisire i fondi 
Dopo l’avvenuta autorizzazione, lo stato PaymentIntent diventa requires_. Per acquisire i fondi autorizzati, effettua una richiesta di acquisizione del PaymentIntent. L’importo totale autorizzato viene acquisito per impostazione predefinita. Non puoi acquisire un importo superiore, ma puoi acquisire un importo inferiore.
Facoltativo Annullare l’autorizzazione
Per annullare un’autorizzazione, puoi annullare il PaymentIntent.
FacoltativoGestire gli eventi successivi al pagamento
Stripe invia un evento payment_intent.succeeded quando il pagamento viene completato. Utilizza la Dashboard, un webhook personalizzato o una soluzione partner per ricevere questi eventi ed eseguire azioni come l’invio della conferma di un ordine al cliente, la registrazione della vendita in un database o l’avvio del flusso di lavoro per una spedizione.
Ascolta questi eventi invece di attendere un callback dal client. Sul client, il cliente potrebbe chiudere la finestra del browser o uscire dall’app prima dell’esecuzione del callback e i client malintenzionati potrebbero manipolare la risposta. La configurazione dell’integrazione per l’ascolto di eventi asincroni ti consente anche di accettare metodi di pagamento diversi in futuro. Ulteriori informazioni sulle differenze tra tutti i metodi di pagamento supportati.
- Gestisci gli eventi manualmente nella dashboard - Utilizza la dashboard per visualizzare i pagamenti di test nella dashboard, inviare le ricevute tramite email, gestire i bonifici o ritentare i pagamenti non riusciti. 
- Crea un webhook personalizzato - Crea un gestore webhook personalizzato per rilevare gli eventi e creare flussi di pagamento asincroni personalizzati. Esegui il test e il debug in locale dell’integrazione webhook con la CLI di Stripe. 
- Integra un’app preimpostata - Gestisci eventi comuni dell’attività, come l’automazione, il marketing e i saldi, integrando una richiesta di registrazione del partner. 
FacoltativoTestare l'integrazione Afterpay
Testa la tua integrazione Afterpay con le tue chiavi API di test visualizzando la pagina di reindirizzamento. Puoi testare il caso di pagamento riuscito autenticando il pagamento sulla pagina di reindirizzamento. Il PaymentIntent passerà da requires_ a succeeded.
Per testare il caso in cui l’utente non riesce a effettuare l’autenticazione, usa le tue chiavi API di test e visualizza la pagina di reindirizzamento. In questa pagina, fai clic su Interrompi pagamento di test. Il PaymentIntent passerà da requires_ a requires_.
Per i PaymentIntent con acquisizione manuale in modalità di test, il PaymentIntent non acquisito scade automaticamente 10 minuti dopo che viene concessa l’autorizzazione.
Pagamenti non riusciti
Afterpay decide se accettare o rifiutare una transazione in base a diversi fattori, ad esempio da quanto tempo l’acquirente utilizza Afterpay, l’importo in sospeso che il cliente deve rimborsare o il valore dell’ordine corrente.
Dato che i pagamenti Afterpay hanno un tasso di rifiuto più elevato rispetto a molti metodi di pagamento, dovresti sempre includere opzioni di pagamento aggiuntive nel tuo flusso di pagamento, come ad esempio card. In questi casi, il PaymentMethod viene scollegato e lo stato dell’oggetto PaymentIntent diventa automaticamente a requires_.
Per un PaymentIntent Afterpay con stato requires_, i clienti devono completare il pagamento entro tre ore dal reindirizzamento al sito Afterpay (ciò non riguarda i pagamenti rifiutati). In caso contrario, l’oggetto PaymentMethod verrà scollegato e lo stato dell’oggetto PaymentIntent passerà automaticamente a requires_
In questi casi, invita il cliente a riprovare con una diversa opzione di pagamento presente nel tuo flusso di completamento della transazione.
Codici di errore
Questi sono i codici di errore più diffusi e le corrispondenti azioni consigliate:
| Codice di errore | Azione consigliata | 
|---|---|
| payment_ | Errore generico che indica che il pagamento Afterpay non è riuscito. Può trattarsi anche di un rifiuto che non appare come un codice di errore di rifiuto. | 
| payment_ | Afterpay ha rifiutato il pagamento del cliente. Successivamente, il cliente dovrà contattare Afterpay per richiedere ulteriori informazioni. | 
| payment_ | Il cliente non ha mai completato il pagamento sulla pagina di completamento della transazione di Afterpay e la sessione di pagamento è scaduta. Tre ore dopo la creazione iniziale del completamento della transazione, Stripe fa scadere automaticamente i PaymentIntents che non vengono autorizzati con successo. | 
| payment_ | Afterpay ha riscontrato un errore relativo al servizio e non è in grado di completare la richiesta. Riprova più tardi. | 
| amount_ | Inserisci un importo compreso nei limiti di transazione predefiniti di Afterpay per il Paese. | 
| amount_ | Inserisci un importo compreso nei limiti di transazione predefiniti di Afterpay per il Paese. |