Modale au-dessus de votre pageBientôt disponible
La fenêtre de paiement s’ouvre au-dessus de la page en cours ; le client garde sa place dans le panier.
La fenêtre de paiement s’ouvre au-dessus de votre page sous forme de modale, sans que le client quitte la boutique. La même logique de facture que la page de paiement hébergée.
Votre page ouvre la fenêtre de paiement avec une facture créée via l’API.
Le client paie dans la modale, sans redirection.
Le statut final arrive par webhook et la modale se ferme.
La fenêtre de paiement s’ouvre au-dessus de la page en cours ; le client garde sa place dans le panier.
Montant, actif, réseau et taux fixe fonctionnent exactement comme sur la page de paiement hébergée.
Le statut de commande provient du webhook final, pas de l’état de la fenêtre du navigateur.
Un simple appel de script suffit pour ouvrir la fenêtre de paiement sur votre boutique.
Qvard propose plusieurs produits de paiement. Choisissez celui qui correspond à votre canal de vente.
A quick overview of how Qvard handles payments, integration and merchant operations.
Qvard est une passerelle de paiement crypto pour les entreprises avec checkout hébergé, factures, paiements API et soldes marchands.
Qvard prend en charge USDT, USDC, BTC, LTC, TRX, BNB et ETH. TON et USDT sur TON arrivent bientôt.
Oui. Qvard inclut les paiements API, redirectUrl, les webhooks, les relances et les journaux de livraison.
Le checkout prend en charge le logo du marchand, le nom de la boutique, la couleur du bouton et la localisation. Les URL de retour personnalisées arrivent bientôt.
Créez un compte marchand et terminez la vérification de l’entreprise. Après avoir testé une facture démo, connectez le checkout hébergé ou l’API et commencez à accepter de vrais paiements.
Les fonds sont suivis dans les soldes marchands, séparés par actif et par réseau. Vous pouvez retirer manuellement ou définir des règles de retrait pour des versements automatiques.
Intégrez le widget de paiement Qvard de trois façons:
Votre clé publique (qvard_pk_…) peut rester dans le code de votre page. Elle ne peut que créer des paiements pour votre boutique—elle ne peut pas lire les données ni retirer les fonds. Elle ne fonctionne que depuis les domaines de vos Origines autorisées et a une limite de débit.
Votre serveur doit calculer le montant ou vérifier l'inventaire? Utilisez l'onglet "Via votre serveur": votre backend crée le paiement avec la clé secrète (qvard_sk_…), et seule l'URL du paiement va au navigateur.
<script src="https://qvard.com/checkout.js"></script> <script> // 1. Décrivez le paiement var checkout = new QvardCheckout({ mode: 'modal', publishableKey: 'qvard_pk_YOUR_PUBLISHABLE_KEY', price: 10, orderId: 'order-123', onSuccess: function (e) { // 3. Gérez le résultat console.log('paid', e.paymentId); }, onError: function (err) { console.log(err.code); } }); // 2. Créez et affichez la fenêtre checkout.open(); </script>
# Créez le paiement sur votre serveur curl -X POST https://api.qvard.com/api/v1/payment \ -H 'x-api-key: qvard_sk_YOUR_SECRET_KEY' \ -H 'Content-Type: application/json' \ -d '{"price":10,"id":"order-123"}' # Réponse: {"id":"...","redirectUrl":"https://my.qvard.com/pay/..."} // Ouvrez la fenêtre de paiement dans le navigateur <script src="https://qvard.com/checkout.js"></script> <script> // 1. Décrivez le paiement var checkout = new QvardCheckout({ mode: 'modal', paymentUrl: 'https://my.qvard.com/pay/...', // Prenez redirectUrl dans la réponse du serveur onSuccess: function (e) { // 3. Gérez le résultat console.log('paid', e.paymentId); } }); // 2. Créez et affichez la fenêtre checkout.open(); </script>
<div id="checkout"></div> <script src="https://qvard.com/checkout.js"></script> <script> // 1. Décrivez le paiement var checkout = new QvardCheckout({ mode: 'inline', target: '#checkout', publishableKey: 'qvard_pk_YOUR_PUBLISHABLE_KEY', price: 10, onSuccess: function (e) { // 3. Gérez le résultat console.log('paid', e.paymentId); } }); // 2. Créez et affichez la fenêtre checkout.open(); </script>
Référence complète de l'API : api.qvard.com/doc
| Option | Description |
|---|---|
| mode | modal | inline |
| target | Sélecteur CSS ou élément DOM (mode inline uniquement) |
| publishableKey | Votre clé publique—nécessaire pour créer des paiements depuis le navigateur |
| paymentId | UUID d'un paiement créé—nécessaire pour le flux serveur |
| paymentUrl | URL complète du paiement depuis la réponse du serveur—nécessaire pour le flux serveur |
| price | Montant en USD (nécessaire avec publishableKey) |
| orderId | Votre ID de transaction (facultatif, 128 caractères max, généré automatiquement s'il est omis) |
| paymentSystemId | ID de la méthode de paiement (facultatif, depuis vos paramètres) |
| locale | Langue de la page de paiement: en, ru, es, pt, tr, id, vi, fr, de (par défaut la langue du navigateur) |
| theme | light | dark (facultatif) |
| onSuccess | Rappel lors du succès du paiement: function(e) { console.log(e.paymentId); } |
| onClose | Rappel quand l'utilisateur ferme la fenêtre sans payer |
| onError | Rappel en cas d'erreur: function(err) { console.log(err.code, err.message); } |
Codes d'erreur: invalid_mode, invalid_target, invalid_options, invalid_payment_url, network_error, invalid_key, origin_not_allowed, duplicate_order, rate_limited, invalid_request, payment_failed.
Testez le widget avec un vrai paiement de démonstration avant de l'intégrer.
Ouvrir le playground