Exemple de paiement crypto en JavaScript : un parcours qui marche aujourd’hui
Exemple de paiement crypto en JavaScript : un parcours fonctionnel avec l’API v1, un appel serveur et un webhook, et l’appel du SDK marqué roadmap.
Cet exemple de paiement crypto en JavaScript montre un parcours qui fonctionne aujourd’hui : le serveur crée le paiement avec l’API v1 en production, le navigateur est redirigé vers la page hébergée et le webhook confirme la commande. L’appel du Low-Code SDK en fin d’article n’est qu’un aperçu de la feuille de route.
Le parcours en quatre étapes
Le client clique sur payer, votre serveur crée le paiement, le navigateur va vers le redirectUrl et le webhook confirme le statut final. Chaque étape est un appel HTTP classique ou une redirection, l’exemple n’a donc pas besoin de bibliothèque particulière.
L’appel serveur en JavaScript
Un gestionnaire Node.js envoie POST /api/v1/payment avec l’en-tête x-api-key, l’identifiant de commande et le prix en USD, puis renvoie le redirectUrl au navigateur. La clé ne quitte jamais le serveur.
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
}Côté navigateur
La page n’a besoin que d’un bouton qui appelle votre gestionnaire, puis suit le redirectUrl renvoyé. Il n’y a dans le navigateur ni clé ni logique de montant.
Le gestionnaire de webhook
L’endpoint webhook lit id et status, vérifie l’en-tête x-api-key et marque la commande comme payée lorsque le statut est paid. Rendez le gestionnaire sûr en cas de répétition, car le même message peut arriver deux fois.
x-api-key: sk_live_…
{ "id": "order_1024", "status": "paid" }L’appel SDK prévu
Le Low-Code SDK de la feuille de route devrait ouvrir le même parcours depuis la page en un seul appel. Il s’agit d’un aperçu d’une API non publiée, montré à titre indicatif, à ne pas utiliser en production.
Tester avant la mise en production
Créez une facture de démo, payez-la sur la page hébergée et vérifiez que votre webhook reçoit le statut final et marque la commande.
// ROADMAP preview: the SDK is not released yet.
QvardCheckout.open({ amount: 149.99, currency: "USD", orderId: "order_1024" });FAQ
Cet exemple utilise-t-il un SDK ?
Non. Le parcours qui fonctionne utilise des appels HTTP classiques et une redirection. L’appel du SDK n’est qu’un aperçu de la feuille de route.
Puis-je utiliser l’appel QvardCheckout.open() en production ?
Non. Le SDK n’est pas encore publié. Utilisez l’API, le redirectUrl et le webhook.
Où doit se trouver la clé d’API ?
Uniquement sur le serveur. Le navigateur ne reçoit que le redirectUrl.
Comment savoir que le paiement est terminé ?
Uniquement lorsque le webhook transmet l’id et le statut paid.
