# Salvare una carta senza autenticazione dell'istituto bancario

Raccogli i dati della carta e addebita il pagamento al cliente in un secondo momento.

Stripe ti consente di acquisire i dati della carta ed effettuare gli addebiti al cliente in un secondo momento. In alcuni paesi le banche richiedono una seconda forma di autenticazione, come l’inserimento di un codice inviato a un telefono. Questo passaggio supplementare riduce la conversione. Infatti, se un cliente non usa attivamente il tuo sito web o la tua applicazione, non è disponibile ad autenticare l’acquisto.

​​Se svolgi la tua attività principalmente negli Stati Uniti e in Canada, le banche non richiedono l’autenticazione, quindi puoi adottare questa integrazione più semplice. Questa integrazione non sarà conforme nei Paesi che richiedono l’autenticazione per il salvataggio delle carte (ad esempio l’India), quindi dovrai apportare modifiche importanti se deciderai di espanderti in altri Paesi o aggiungere altri metodi di pagamento Scopri come [salvare le carte che richiedono l’autenticazione](https://docs.stripe.com/payments/save-and-reuse.md).

> #### Conformità
> 
> Quando salvi i dati di pagamento di un cliente, sei responsabili della conformità a tutte le leggi, i regolamenti e le regole del circuito applicabili, ad esempio nei casi in cui vuoi salvare la modalità di pagamento del cliente per uso futuro per effettuare addebiti quando il cliente non utilizza attivamente il tuo sito web o la tua app. Aggiungi al tuo sito web o alla tua app delle condizioni che indichino come intendi salvare i dettagli della modalità di pagamento e permetti ai clienti di accettare o meno queste condizioni. Se vuoi addebitare l’importo quando i clienti sono offline, accertati che i termini includano quanto segue:
> 
> - Il consenso del cliente a disporre un pagamento o una serie di pagamenti per suo conto per determinate transazioni.
- La tempistica e la frequenza dei pagamenti previste (ad esempio, se gli addebiti sono per rate programmate, pagamenti di abbonamenti o ricariche non programmate).
- Il modo in cui determini l’importo del pagamento.
- I tuoi termini di cancellazione, se la modalità di pagamento è per un servizio in abbonamento.
> 
> Assicurati di conservare una copia scritta del consenso fornito dal cliente relativamente a questi termini.

## Acquisisci i dati della carta [Lato client]

Prima di iniziare questa guida, devi creare un account Stripe. [Registrati ora](https://dashboard.stripe.com/register).

Crea una pagina di pagamento per acquisire i dati della carta del cliente. Usa [Stripe Elements](https://docs.stripe.com/payments/elements.md), una libreria di interfaccia utente che ti consente di creare moduli di pagamento personalizzati. Per iniziare a utilizzare Elements, includi la libreria Stripe.js con il seguente script sulla pagina di pagamento.

```html
<script src="https://js.stripe.com/dahlia/stripe.js"></script>
```

Carica sempre Stripe.js direttamente da js.stripe.com per garantire la conformità alle norme PCI. Non includere lo script in un pacchetto e non utilizzarne una copia in self-hosting.

Per sfruttare al massimo la [funzionalità Avanzata contro le frodi](https://docs.stripe.com/radar.md) di Stripe, includi questo script in ogni pagina del sito, non solo in quella di Checkout. Se includi lo script in ogni pagina, [Stripe può rilevare comportamenti sospetti](https://docs.stripe.com/disputes/prevention/advanced-fraud-detection.md) che potrebbero essere indicativi di frodi mentre gli utenti navigano sul tuo sito web.

### Aggiungere Elements alla pagina

Per acquisire in modo sicuro i dati delle carte dai tuoi clienti, Elements crea per te dei componenti di interfaccia utente ospitati da Stripe, che vengono quindi inseriti nel tuo modulo di pagamento, anziché essere creati direttamente da te. Per definire il punto di inserimento di questi componenti, crea elementi DOM (contenitori) vuoti con ID univoci nel tuo modulo di pagamento.

```html
<input id="cardholder-name" type="text">
<!-- placeholder for Elements -->
<div id="card-element"></div>
<div id="card-result"></div>
<button id="card-button">Save Card</button>
```

Poi, per creare un’istanza dell’[oggetto Stripe](https://docs.stripe.com/js.md#stripe-function), specifica come primo parametro la tua [chiave API](https://docs.stripe.com/keys.md) pubblicabile. Quindi, crea un’istanza dell’[oggetto Elements](https://docs.stripe.com/js.md#stripe-elements) e usala per montare un elemento `card` nel DOM.

`card` Element semplifica il modulo di pagamento e riduce al minimo il numero di campi obbligatori inserendo un unico campo di immissione flessibile che acquisisce in modo sicuro tutti i dati relativi alla carta.

In alternativa, combina `cardNumber` Element, `cardExpiry` Element e `cardCvc` Element per creare un modulo flessibile con più campi di immissione per la carta.

> Acquisisci sempre il codice postale per aumentare i tassi di accettazione delle carte e ridurre le frodi.
> 
> [Card Element a inserimento unico](https://docs.stripe.com/js/element/other_element?type=card) acquisisce automaticamente il codice postale del cliente e lo invia a Stripe. Se crei un modulo di pagamento con il ([numero di carta](https://docs.stripe.com/js/element/other_element?type=cardNumber), la [scadenza](https://docs.stripe.com/js/element/other_element?type=cardExpiry) e il [CVC](https://docs.stripe.com/js/element/other_element?type=cardCvc)) di Elements, aggiungi un campo di inserimento distinto per il codice postale del cliente.

```javascript
const stripe = Stripe('<<YOUR_PUBLISHABLE_KEY>>');

const elements = stripe.elements();
const cardElement = elements.create('card');
cardElement.mount('#card-element');
```

Un componente di Stripe Elements contiene un iframe che invia in modo sicuro a Stripe le informazioni sul pagamento tramite una connessione HTTPS. Affinché l’integrazione funzioni, anche l’indirizzo della pagina di completamento del pagamento deve iniziare con `https://` anziché `http://`.

Puoi eseguire il test dell’integrazione senza utilizzare HTTPS. [Abilitalo](https://docs.stripe.com/security/guide.md#tls) quando è tutto pronto per accettare i pagamenti in modalità live.

```javascript
const cardholderName = document.getElementById('cardholder-name');
const cardButton = document.getElementById('card-button');
const resultContainer = document.getElementById('card-result');

cardButton.addEventListener('click', async (ev) => {
  const {paymentMethod, error} = await stripe.createPaymentMethod({
      type: 'card',
      card: cardElement,
      billing_details: {
        name: cardholderName.value,
      },
    }
  );

  if (error) {
    // Display error.message in your UI.
    resultContainer.textContent = error.message;
  } else {
    // You have successfully created a new PaymentMethod
    resultContainer.textContent = "Created payment method: " + paymentMethod.id;
  }
});
```

Invia l’ID del *PaymentMethod* (PaymentMethods represent your customer's payment instruments, used with the Payment Intents or Setup Intents APIs) risultante al tuo server.

## Configurare Stripe [Lato server]

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

#### Ruby

```bash
# Available as a gem
sudo gem install stripe
```

```ruby
# If you use bundler, you can add this line to your Gemfile
gem 'stripe'
```

## Salva la carta [Lato server]

Salva la carta associando il PaymentMethod a un *Cliente* (Customer objects represent customers of your business. They let you reuse payment methods and give you the ability to track multiple payments). Puoi utilizzare l’oggetto `Customer` per memorizzare altre informazioni sul cliente, ad esempio i dati di spedizione e l’indirizzo email.

```curl
curl https://api.stripe.com/v1/customers \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d payment_method={{PAYMENT_METHOD_ID}}
```

Se hai un oggetto Customer esistente, puoi associarvi il PaymentMethod.

```curl
curl https://api.stripe.com/v1/payment_methods/{{PAYMENT_METHOD_ID}}/attach \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d "customer={{CUSTOMER_ID}}"
```

A questo punto, associa l’ID del cliente e l’ID del PaymentMethod alla tua rappresentazione interna di un cliente, se ne hai una.

## Addebita un importo sulla carta salvata [Lato server]

Quando è tutto pronto, recupera gli ID del PaymentMethod e del cliente a cui addebitare il pagamento. Puoi farlo salvando gli ID di entrambi nel database o utilizzando l’ID del cliente per cercare tutti i PaymentMethods disponibili del cliente.

#### Account v2

```curl
curl -G https://api.stripe.com/v1/payment_methods \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d "customer_account={{CUSTOMERACCOUNT_ID}}" \
  -d type=card
```

#### Clienti v1

```curl
curl -G https://api.stripe.com/v1/payment_methods \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d "customer={{CUSTOMER_ID}}" \
  -d type=card
```

Usa l’ID del PaymentMethod e l’ID del cliente per creare un nuovo PaymentIntent. Imposta [error_on_requires_action](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-error_on_requires_action) su `true` per i pagamenti rifiutati che richiedono azioni da parte del cliente, come l’autenticazione a due fattori.

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1099 \
  -d currency=usd \
  -d "payment_method_types[]=card" \
  -d "customer={{CUSTOMER_ID}}" \
  -d payment_method={{PAYMENT_METHOD_ID}} \
  -d error_on_requires_action=true \
  -d confirm=true
```

Quando un tentativo di pagamento non va a buon fine, anche la richiesta non riesce. Viene visualizzato un codice di stato HTTP 402 e Stripe restituisce un errore. Devi chiedere al cliente di tornare all’applicazione (ad esempio inviando un’email) per completare il pagamento. Per determinare il motivo del rifiuto del pagamento da parte della società emittente della carta, verifica il codice di [errore](https://docs.stripe.com/api/errors/handling.md) generato dalla libreria dell’API Stripe o il codice [last_payment_error.decline_code](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-last_payment_error-decline_code) del PaymentIntent.

## Gestisci eventuali errori delle carte

Informa il cliente che il pagamento non è riuscito e indirizzalo al modulo di pagamento creato al passaggio 1, dove potrà inserire i dati di una nuova carta. Invia questo nuovo ID PaymentMethod al server da [associare](https://docs.stripe.com/api/payment_methods/attach.md) all’oggetto Customer ed esegui nuovamente il pagamento.

In alternativa, puoi creare un PaymentIntent e salvare una carta in un’unica chiamata API se hai già creato un oggetto Customer.

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1099 \
  -d currency=usd \
  -d "payment_method_types[]=card" \
  -d "customer={{CUSTOMER_ID}}" \
  -d payment_method={{PAYMENT_METHOD_ID}} \
  -d error_on_requires_action=true \
  -d confirm=true \
  -d setup_future_usage=on_session
```

L’impostazione di [setup_future_usage](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-setup_future_usage) su `on_session` indica a Stripe che vuoi salvare la carta per utilizzarla in seguito, senza attivare autenticazioni inutili.

## Testare l'integrazione

Stripe fornisce [carte di test](https://docs.stripe.com/testing.md) che puoi utilizzare in una sandbox per simulare il comportamento di carte diverse. Utilizza queste carte con un CVC, un codice postale e una data di scadenza futura qualsiasi.

| Numero           | Descrizione                                                                                                       |
| ---------------- | ----------------------------------------------------------------------------------------------------------------- |
| 4242424242424242 | La transazione ha esito positivo e il pagamento viene elaborato immediatamente.                                   |
| 4000000000009995 | La transazione ha sempre esito negativo con un codice di rifiuto `insufficient_funds`.                            |
| 4000002500003155 | Richiede l’autenticazione, che in questa integrazione viene rifiutata con un codice di `authentication_required`. |

## Optional: Ottenere di nuovo un CVC

Durante la creazione di pagamenti successivi con una carta salvata, potresti voler acquisire di nuovo il CVC della carta come ulteriore misura antifrode per verificare l’utente.

Inizia creando un PaymentIntent dal tuo server con l’importo e la valuta del pagamento e imposta il campo [Cliente](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-customer) sull’ID dell’oggetto Customer. Poi [elenca](https://docs.stripe.com/api/payment_methods/list.md) gli oggetti PaymentMethod associati a cliente per determinare quali di essi mostrare all’utente per richiedere nuovamente il CVC.

Dopo aver trasmesso la chiave privata client del PaymentIntent al browser, puoi acquisire nuovamente le informazioni CVC sul client con Stripe Elements. Utilizza l’elemento `cardCvc` per ricevere nuovamente un valore CVC dall’utente, quindi conferma il pagamento dal client utilizzando [stripe.confirmCardPayment](https://docs.stripe.com/js.md#stripe-confirm-card-payment). Imposta `payment_method` sul tuo ID PaymentMethod e `payment_method_options[card][cvc]` sul tuo elemento `cardCvc`.

```javascript
const result = await stripe.confirmCardPayment(clientSecret, {
  payment_method: '{{PAYMENT_METHOD_ID}}',
  payment_method_options: {
    card: {
      cvc: cardCvcElement
    }
  },
});

if (result.error) {
  // Show error to your customer
  console.log(result.error.message);
} else {
  if (result.paymentIntent.status === 'succeeded') {
    // Show a success message to your customer
    // There's a risk of the customer closing the window before callback
    // execution. Set up a webhook or plugin to listen for the
    // payment_intent.succeeded event that handles any business critical
    // post-payment actions.
  }
}
```

Un pagamento potrebbe riuscire anche nel caso in cui il controllo CVC non vada a buon fine. Per evitare questa situazione, configura le [regole Radar](https://docs.stripe.com/radar/rules.md#traditional-bank-checks) in modo da bloccare i pagamenti in caso di errore durante la verifica CVC.

## Aggiornare l’integrazione per gestire l’autenticazione delle carte

Questa integrazione *rifiuta le carte che richiedono l’autenticazione durante il pagamento*. Se inizi a vedere molti pagamenti nella Dashboard contrassegnati come `Failed`, è il momento di [aggiornare la tua integrazione](https://docs.stripe.com/payments/payment-intents/upgrade-to-handle-actions.md). L’integrazione globale di Stripe gestisce questi pagamenti invece di rifiutarli automaticamente.