Checkout via iframe

O Checkout via iframe permite que a finalização do pagamento ocorra dentro da própria página da loja, sem redirecionamentos ou abertura de novas abas. Essa abordagem mantém o cliente no domínio do lojista, reduz interrupções e melhora a fluidez da jornada.

O conteúdo exibido no iframe é entregue diretamente pela Cielo. Isso garante segurança, estabilidade e conformidade, preservando ao mesmo tempo a integração visual com o site da loja.

ℹ️
O uso do checkout embutido é opcional. A loja pode manter o fluxo tradicional com redirecionamento ou adotar a versão integrada via iframe.

Por que usar o checkout via iframe?

Usar o checkout via iframe traz vantagens importantes para a experiência do comprador:

Pagamento na mesma página: a pessoa compradora permanece na mesma página durante o pagamento;
Mais fluidez e menos atrito: reduz passos desnecessários e torna a jornada de pagamento mais rápida;
Maior sensação de segurança: o domínio exibido no navegador permanece o da loja;
Fácil de integrar: se adapta bem a várias arquiteturas e stacks de desenvolvimento.

Pré-requisitos

Requisitos de ambiente

Ter cadastro Checkout Cielo;
Domínio com TLS ativo;
Ambiente de testes (Sandbox).

Requisitos técnicos

Back-end capaz de atuar como proxy seguro para chamadas à API do Checkout;
Front-end com suporte à renderização de iframes;
Não expor as credenciais (clientId e clientSecret) no front-end;
Capacidade de processar mensagens via postMessage, quando aplicável;
Política de segurança de conteúdo configurada para permitir apenas os recursos essenciais ao iframe e à comunicação com o back-end.

Tecnologias Suportadas

Front-end aplicações web em qualquer framework (ex.: Vue.js no exemplo de referência).;
Backend: Node.js/Express, C#, Java ou qualquer tecnologia que permita requisições HTTP com envio de headers.