Skip to main content
Use this page when you want the recommended frontend card integration.

​
Step 1: load the script

<script src="https://js.pagou.ai/payments/v3.js"></script>
<script>
  Pagou.setEnvironment("sandbox");
</script>

​
Step 2: initialize the SDK

const elements = Pagou.elements({
  publicKey: "pk_sandbox_your_public_key",
  locale: "en",
  origin: window.location.origin
});

​
Step 3: mount the card field

const card = elements.create("card", {
  theme: "default"
});

card.mount("#card-element");

​
Step 4: submit through your backend

const result = await elements.submit({
  createTransaction: async (tokenData) => {
    const response = await fetch("/api/pay", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({
        token: tokenData.token,
        amount: 2490,
        installments: 1
      })
    });

    return response.json();
  }
});

​
Backend handoff

Your backend converts the token into a POST /v2/transactions request with method: "credit_card".