# Checkout crypto, bouton de paiement et API | Cosmos Pay

URL: https://payments.cosmospay.lat/integrations?lang=fr

> D’un lien de paiement sans code à votre propre écran de paiement avec l’API. Choisissez comment vous encaissez et à quoi ressemble le paiement sur votre site.

## Des paiements en stablecoins sur votre site

D’un lien de paiement sans code à votre propre écran de paiement avec l’API. Choisissez comment vous encaissez et à quoi ressemble le paiement sur votre site.

### Placez le paiement là où il s’intègre à votre site.

Envoyez vos clients vers notre checkout, ouvrez-le depuis un bouton, affichez-le dans votre page ou construisez le vôtre avec l’API. Essayez chaque option ci-dessous : chaque démo fonctionne sur cette page, avec des données d’exemple qui ne peuvent pas être réglées.

#### Bouton de paiement (Une ligne de HTML)

Notre script affiche un bouton qui ouvre le checkout dans une fenêtre au-dessus de votre page, et prévient votre page quand le paiement est confirmé.

```html
<script defer
  src="https://payments.cosmospay.lat/embed/cosmos-pay.js"></script>

<!-- link: your payment link's id, from the dashboard or the API -->
<cosmos-pay-button
  link="cmh9a1q7r0000l208x9k4d1pz">
</cosmos-pay-button>

<script>
  document.querySelector("cosmos-pay-button")
    .addEventListener("cosmospay:paid", showThanks);
</script>
```

[Lire le guide de l’embed](https://dev.cosmospay.lat/docs/embed/)

#### Checkout intégré (Une ligne de HTML)

Le checkout s’affiche dans votre page : montant, QR code et bouton du wallet, avec un statut mis à jour en direct et des événements que votre page peut écouter.

```html
<script defer
  src="https://payments.cosmospay.lat/embed/cosmos-pay.js"></script>

<!-- link: your payment link's id, from the dashboard or the API -->
<cosmos-pay-checkout
  link="cmh9a1q7r0000l208x9k4d1pz"
  lang="fr" theme="auto">
</cosmos-pay-checkout>

<script>
  document.querySelector("cosmos-pay-checkout")
    .addEventListener("cosmospay:status", (event) => {
      console.log(event.detail.status); // PENDING, SUBMITTED, SUCCEEDED
    });
</script>
```

[Lire le guide de l’embed](https://dev.cosmospay.lat/docs/embed/)

#### Checkout hébergé (Aucun code sur votre site)

Envoyez votre client vers une page de paiement que nous hébergeons. Choisissez l’un des quatre designs par lien ; aucun autre site ne peut intégrer la page dans un cadre.

Design du checkout:

- **Classique**: Une colonne épurée : montant, statut en direct, QR code et détails du paiement.
- **Partagé**: Les moyens de paiement dans un volet latéral avec compte à rebours. Le payeur choisit.
- **Reçu**: Les champs du paiement avec un reçu à côté : détails, ligne de découpe et total.
- **Carte**: Un grand compte à rebours, des champs annotés et une carte de paiement qui porte le QR code.

```html
<!-- Send your customer to the hosted checkout. Its design
     (classic, split, ticket or card) is set on the link,
     in the dashboard or with the API (checkoutTheme). -->
<a href="https://payments.cosmospay.lat/cmh9a1q7r0000l208x9k4d1pz">
  Pay with Cosmos Pay
</a>
```

[Créer un lien de paiement](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### Liens de paiement et QR (Sans code)

Créez un lien dans le dashboard et partagez-le par chat, e-mail ou QR code imprimé. Votre client l’ouvre et paie depuis son wallet.

[Créer un lien de paiement](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### API et SDK (Votre propre interface)

Créez des intents de paiement depuis votre serveur, dessinez votre propre écran de paiement et recevez le résultat par des webhooks signés.

```ts
import { Client } from "@cosmosapp/pay_sdk";

const client = new Client({ apiKey: process.env.COSMOS_PAY_API_KEY });
const intent = await client.paymentIntents.createPay({
  destination: "G…YOUR_ACCOUNT",
  amount: "25",
});
// send your customer to the hosted checkout
const checkoutUrl = "https://payments.cosmospay.lat/" + intent.id;
```

[Lire la référence de l’API](https://dev.cosmospay.lat/docs/api/)

#### Plugins e-commerce (Bientôt)

Des plugins WooCommerce et Shopify, pour encaisser dans votre boutique sans écrire de code.

[Dites-nous quelle boutique vous utilisez](https://payments.cosmospay.lat/integrations?lang=fr#contact)

Quel que soit votre choix, confirmez le paiement sur votre serveur via le webhook ou l’API.

### Quelques lignes de code.

Créez le paiement sur votre serveur, partagez le lien du checkout et laissez le webhook vous prévenir quand il est payé.

- Une API REST documentée en OpenAPI
- Un SDK TypeScript : @cosmosapp/pay_sdk
- Des webhooks signés en HMAC-SHA256
- Des clés de test (dv_) et des clés live (prod_)

- [Lire la documentation](https://dev.cosmospay.lat/docs/)
- [Référence de l’API](https://dev.cosmospay.lat/docs/api/)

#### REST

```bash
curl https://api.cosmospay.lat/cosmos-api/v1/payment-intents/pay \
  -H "Authorization: Bearer $COSMOS_PAY_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "chain": "stellar",
    "destination": "G…YOUR_ACCOUNT",
    "amount": "25",
    "assetCode": "USDC",
    "assetIssuer": "GA5ZSEJYB37JRC5AVCIA5MOP4RHTM335X2KGX3IHOJAPP5RE34K4KZVN",
    "msg": "Order #1001",
    "checkoutTheme": "ticket"
  }'
```

#### SDK TypeScript

```ts
import { Client } from "@cosmosapp/pay_sdk";

const client = new Client({ apiKey: process.env.COSMOS_PAY_API_KEY });
const intent = await client.paymentIntents.createPay({
  destination: "G…YOUR_ACCOUNT",
  amount: "25",
});
// send your customer to the hosted checkout
const checkoutUrl = "https://payments.cosmospay.lat/" + intent.id;
```

#### Webhook

```json
{
  "id": "evt_01JB…",
  "type": "PAYMENT_INTENT_SUCCEEDED",
  "createdAt": "2026-10-24T22:36:56.000Z",
  "data": {
    "id": "cmh9a1…",
    "status": "SUCCEEDED",
    "amount": "25",
    "txHash": "6864…2e54"
  }
}
```

L’id de la réponse est le lien : https://payments.cosmospay.lat/<id>

### Trois façons de commencer à encaisser.

Commencez aujourd’hui avec un lien et passez à l’API quand vous en avez besoin. Toutes utilisent le même checkout, le même dashboard et les mêmes webhooks.

#### Liens de paiement (Sans code)

Créez un lien dans le dashboard et partagez-le par chat, e-mail ou QR code.

- Un montant fixe, ou choisi par le payeur
- Un message que le payeur voit dans son wallet
- Le statut en direct dans le dashboard

[Créer un lien de paiement](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### Checkout hébergé (Peu de code)

Envoyez vos clients vers un checkout que nous hébergeons, avec le QR code, les boutons de wallet et le statut en direct.

- Quatre designs prêts à l’emploi
- En français, anglais, espagnol, portugais, allemand, hindi et chinois
- Des pages qu’aucun autre site ne peut intégrer

[Voir les options d’intégration](https://payments.cosmospay.lat/integrations?lang=fr)

#### API de paiement (Contrôle total)

Créez des intents de paiement depuis votre serveur et suivez le résultat grâce aux webhooks signés.

- REST, documentée en OpenAPI
- Un SDK TypeScript
- Des webhooks signés en HMAC-SHA256

[Lire la documentation](https://dev.cosmospay.lat/docs/)

### Guides associés

[Voir tous les guides](https://payments.cosmospay.lat/learn?lang=fr)

#### [Comment ajouter un bouton de paiement crypto ou un checkout à votre site](https://payments.cosmospay.lat/learn/crypto-payment-button?lang=fr)

Chargez un script, ajoutez un bouton de paiement ou un checkout intégré pour un lien de paiement, et confirmez le paiement sur votre serveur.

#### [Comment accepter des paiements en USDC en ligne](https://payments.cosmospay.lat/learn/accept-usdc-payments?lang=fr)

Encaissez en USDC avec un lien de paiement, le checkout hébergé ou l’API, et faites d’abord un essai sur un réseau de test.

#### [Comment envoyer un lien de paiement sur WhatsApp](https://payments.cosmospay.lat/learn/whatsapp-payment-links?lang=fr)

Créez un lien dans le tableau de bord, envoyez-le dans une conversation ou imprimez son QR code, et voyez quand il est payé.

### Commencez à accepter les stablecoins.

Créez un compte gratuit, générez une clé de test et envoyez votre premier lien de paiement dès aujourd’hui.

[Créer un lien de paiement](https://dev.cosmospay.lat/login?next=%2Fdashboard%3Fview%3Dpayments)

#### Écrivez-nous

Une question sur les offres, l’intégration ou les paiements protégés : dites-le-nous, nous répondons par e-mail.

[organization@cosmospay.lat](mailto:organization@cosmospay.lat)
