Bouton de paiement crypto : comment l’ajouter à votre site
Bouton de paiement crypto : comment ajouter un bouton payer en crypto à votre site, ce qu’est le bouton SDK prévu et ce qui marche aujourd’hui. Avec code.
Un bouton de paiement crypto est un bouton unique sur votre site qui lance un paiement en cryptomonnaie. Le SDK Qvard prévu afficherait ce bouton avec quelques lignes de code, mais il n’est pas encore publié. Ce guide montre comment construire dès aujourd’hui un bouton fonctionnel avec l’API.
Ce que fait un bouton de paiement crypto
Un bouton de paiement lance un paiement lorsque le client clique. Sur un site crypto, le clic mène à une page de paiement où le client choisit l’actif et le réseau. Le bouton lui-même ne détient ni fonds ni clés.
Statut : le bouton SDK est sur la feuille de route
Le bouton du SDK Qvard n’est pas encore publié. Cet article ne le présente pas comme un composant fini, et le code d’aperçu dans les médias est étiqueté roadmap.
x-api-key: sk_live_…
{
"id": "order_1024",
"price": 149.99,
"paymentSystemId": 12
}
// 201 Created
{
"data": {
"id": "8f3k2a1c",
"redirectUrl": "https://my.qvard.com/pay/8f3k2a1c"
},
"code": 201,
"message": "success",
"status": true
}Un bouton qui fonctionne aujourd’hui
Le bouton envoie une requête à votre backend. Le backend crée le paiement avec POST /api/v1/payment et l’en-tête x-api-key, puis renvoie le redirectUrl. Le bouton y envoie le client, et le webhook confirme le paiement.
Placer le bouton dans le checkout
Placez le bouton en fin de panier, à côté du total. Affichez le montant en USD avant le clic pour que le client sache ce qui l’attend sur la page hébergée.
Rendre le bouton sûr
Ne mettez pas la clé d’API dans le code du bouton. Créez le paiement seulement au clic du client, et vérifiez le total de la commande côté serveur, pas dans le navigateur.
// ROADMAP preview: the SDK is not released yet.
QvardCheckout.open({ amount: 149.99, currency: "USD", orderId: "order_1024" });Confirmer par webhook
Lorsque le webhook transmet l’id et le statut paid, marquez la commande comme payée. Un clic sur le bouton ne signifie pas que les fonds sont arrivés.
FAQ
Existe-t-il aujourd’hui un composant bouton de paiement Qvard ?
Pas sous forme de composant SDK, qui est sur la feuille de route. Aujourd’hui, un bouton classique qui appelle votre backend fait le même travail.
Le bouton peut-il afficher le montant dans une autre devise ?
Le prix de la requête API est en USD. La page hébergée affiche le montant exact dans l’actif choisi, à taux fixe.
Le bouton suffit-il sans webhook ?
Non. Le bouton ne fait que lancer le paiement. Ne marquez la commande comme payée que via le webhook.
Comment tester le bouton ?
Utilisez un parcours avec facture de démo et vérifiez que le webhook marque la commande après le paiement.
