Accetta pagamenti tramite checkout web

Panoramica#

L'integrazione ha quattro parti. Il server possiede l'ordine e la chiave privata; il browser riceve solo un token di ordine e la chiave pubblica.

Prima di iniziare#

• Sandbox chiavi private e pubbliche — vedi chiavi API.
• Il SDK Web caricato dal CDN DEUNA.
• Un endpoint backend che crea un PAYMENT-LINK ordine e restituisce il suo ordine token.
• Un punto finale HTTPS pubblico per i webhooks DEUNA.

1. Creare e gettare l'ordine#

Crea l'ordine sul tuo backend con la chiave API privata. Ritorna solo il suo token al browser.

app.post('/api/deuna/checkout-session', async (request, response) => {
  const cart = await carts.get(request.session.cartId);
  const order = await createDeunaOrder({
    orderType: 'PAYMENT-LINK',
    currency: cart.currency,
    items: cart.items,
    totalAmount: cart.totalAmount,
  });

  response.json({orderToken: order.token});
});

2. Caricare e inizializzare il Web SDK#

<script crossorigin src="https://cdn.deuna.io/web-sdk/v1.7/index.js"></script>
<script type="module">
  await DeunaSDK.initialize({
    publicApiKey: 'YOUR_PUBLIC_API_KEY',
    env: 'sandbox',
  });
</script>

3. Apri il Widget di Pagamento#

const {orderToken} = await fetch('/api/deuna/checkout-session', {
  method: 'POST',
}).then((response) => response.json());

await DeunaSDK.initPaymentWidget({
  orderToken,
  callbacks: {
    onSuccess: async (order) => {
      await DeunaSDK.close();
      showConfirmation(order);
    },
    onError: (error) => showRetry(error),
    onClosed: () => showCart(),
  },
});

La versione attuale del Web SDK non espone initCheckoutIl widget di pagamento è il flusso SDK supportato per accettare pagamenti all'interno di un checkout web esistente.

4. Confermare con webhooks#

Utilizzare i callback del browser per aggiornare l'interfaccia, ma soddisfare l'ordine solo dopo che il backend riceve e verifica il webhook corrispondente. Vedi Verificare le firme webhook.

Elenco di controllo Go-live#

Guide correlate#