Aceitar um pagamento

Aceitar pagamentos online com segurança

Complexidade:

Personalize logotipo, imagens e cores.

Compatibilidade integrada com Apple Pay e Google Pay.

Clone um exemplo de integração da documentação ou do GitHub.

Veja a demonstração para ter um exemplo hospedado.

Configurar a Stripe
Lado do servidor

Primeiro, verifique se você criou um nome para a conta no Stripe Dashboard.

Então instale as bibliotecas para acessar a API da Stripe no seu aplicativo:

Terminal

# Available as a gem
sudo gem install stripe

Gemfile

# If you use bundler, you can add this line to your Gemfile
gem 'stripe'

Redirecione seu cliente para o Stripe Checkout
Lado do cliente
Lado do servidor

Add a checkout button to your website that calls a server-side endpoint to create a Checkout Session.

checkout.html

<html>
  <head>
    <title>Buy cool new product</title>
  </head>
  <body>
    <form action="/create-checkout-session" method="POST">
      <button type="submit">Checkout</button>
    </form>
  </body>
</html>

Uma sessão de checkout é o programa que representa o que seu cliente vê ao ser redirecionado para o formulário de pagamento. Você pode configurar opções como:

itens de linha a serem cobrados
moedas a serem usadas

Você também precisa especificar:

Uma página success_url em seu site, para onde o cliente é redirecionado ao finalizar o pagamento.
Uma página cancel_url em seu site, para onde o cliente é redirecionado se clicar no seu logotipo no Checkout.

As sessões do Checkout expiram 24 horas após a criação.

Depois de criar uma sessão do Checkout, redirecione o cliente para o URL retornado na resposta.

# This example sets up an endpoint using the Sinatra framework.
# Watch this video to get started: https://youtu.be/8aA9Enb8NVc.

require 'json'
require 'sinatra'
require 'stripe'
# Set your secret key. Remember to switch to your live secret key in production.
# See your keys here: https://dashboard.stripe.com/apikeys
Stripe.api_key = 'sk_test_4eC39HqLyjWDarjtT1zdp7dc'

post '/create-checkout-session' do
  session = Stripe::Checkout::Session.create({
    line_items: [{
      price_data: {
        currency: 'usd',
        product_data: {
          name: 'T-shirt',
        },
        unit_amount: 2000,
      },
      quantity: 1,
    }],
    mode: 'payment',
    # These placeholder URLs will be replaced in a following step.
    success_url: 'https://example.com/success',
    cancel_url: 'https://example.com/cancel',
  })

  redirect session.url, 303
end

Por padrão, a Stripe ativa cartões e outras formas de pagamento predominantes que podem ajudar você a atingir mais clientes, e você pode ativar ou desativar formas de pagamento diretamente no Stripe Dashboard. A Stripe avalia a moeda, as restrições de forma de pagamento e outros parâmetros para determinar a lista de formas de pagamento aceitas para exibição no Checkout.

Teste seu endpoint iniciando seu servidor web (por exemplo: localhost:4242) e executando o seguinte comando:

Terminal

curl -X POST -is "http://localhost:4242/create-checkout-session" -d ""

Você deve ver uma resposta no seu terminal parecida com esta:

Terminal

HTTP/1.1 303 See Other
Location: https://checkout.stripe.com/pay/cs_test_...
...

Testes

Agora o botão de checkout já deve estar pronto para redirecionar seu cliente para o Stripe Checkout.

Clique no botão de checkout.
Você é redirecionado para o formulário de pagamento do Stripe Checkout.

Se sua integração não estiver funcionando:

Abra a guia Rede nas ferramentas de desenvolvedor do navegador.
Clique no botão de checkout e confirme se uma solicitação de XHR é enviada para o endpoint no lado do servidor (POST /create-checkout-session).
Verifique se a solicitação retorna um status 200.
Use console.log(session) dentro de seu ouvinte de clique de botão para confirmar se os dados retornados estão corretos.

Mostrar uma página de finalização
Lado do cliente
Lado do servidor

É importante que o cliente veja uma página de finalização depois de enviar o formulário de pagamento corretamente. Hospede essa página de finalização no seu site.

Criar uma página de finalização mínima:

success.html

<html>
  <head><title>Thanks for your order!</title></head>
  <body>
    <h1>Thanks for your order!</h1>
    <p>
      We appreciate your business!
      If you have any questions, please email
      <a href="mailto:orders@example.com">orders@example.com</a>.
    </p>
  </body>
</html>

Em seguida, atualize o endpoint de criação da sessão do Checkout para usar essa nova página:

# Set your secret key. Remember to switch to your live secret key in production.
# See your keys here: https://dashboard.stripe.com/apikeys
Stripe.api_key = 'sk_test_4eC39HqLyjWDarjtT1zdp7dc'

# This example sets up an endpoint using the Sinatra framework.
# Watch this video to get started: https://youtu.be/8aA9Enb8NVc.

require 'json'
require 'sinatra'

post '/create-checkout-session' do
  session = Stripe::Checkout::Session.create({
    line_items: [{
      price_data: {
        currency: 'usd',
        product_data: {
          name: 'T-shirt',
        },
        unit_amount: 2000,
      },
      quantity: 1,
    }],
    mode: 'payment',
    success_url: 'http://localhost:4242/success.html',
    cancel_url: 'http://localhost:4242/cancel.html',
  })

  redirect session.url, 303
end

Se quiser personalizar a página de finalização, leia o guia sobre página de finalização personalizada.

Testes

Clique no botão de checkout
Preencha os dados de pagamento com os dados do cartão de teste:
- Informe o número do cartão 4242 4242 4242 4242.
- Informe uma data futura qualquer como validade do cartão.
- Informe qualquer número de 3 dígitos como CVC.
- Informe qualquer código postal de cobrança.
Clique em Pagar.
Você será redirecionado para a nova página de finalização.

Localize então o novo pagamento no Stripe Dashboard. Os pagamentos finalizados aparecem na lista de pagamentos do Dashboard. Quando você clica em um pagamento, a página de detalhes do pagamento é exibida. A seção Resumo do checkout contém dados de cobrança e a lista de itens comprados, que você pode usar para fazer a execução manual do pedido.

Outros recursos para testes

Temos diversos cartões que você pode usar para testar se sua integração está pronta para entrar em modo de produção. Use-os com qualquer CVC, código postal e data de validade futura.

Número	Descrição
	Finaliza e processa o pagamento imediatamente.
	Conclua a autenticação 3D Secure 2 para que o pagamento seja processado.
	Sempre falha, com o código de recusa `insufficient_funds`.

Veja a lista completa de cartões para teste em nosso guia de testes.

Apple Pay e Google Pay

Não é necessário mudar nada na configuração nem na integração do Stripe Checkout para ativar Apple Pay e Google Pay. A Stripe administra esses pagamentos da mesma forma que os outros pagamentos com cartão.

O botão do Apple Pay é exibido em uma sessão do Checkout quando todas estas condições são cumpridas:

O Apple Pay está ativado para o Checkout no Stripe Dashboard.
O dispositivo do cliente executa macOS (10.14.1 ou posterior) ou iOS (12.1 ou posterior).
O cliente usa o navegador Safari.
O cliente tem um cartão válido registrado no Apple Pay.

Essas condições garantem que o Checkout só mostre o botão Apple Pay para clientes que possam usá-lo.

OpcionalCriar antecipadamente produtos e preços

OpcionalClientes existentes
Lado do servidor

OpcionalPreencher dados do cliente
Lado do servidor

OpcionalSalvar dados da forma de pagamento
Lado do servidor

OpcionalSeparar autorização e captura
Lado do servidor

Agora que sua integração básica está funcionando, veja como receber uma notificação programaticamente sempre que um cliente pagar.

Aceitar um pagamento

Configurar a StripeLado do servidor

Redirecione seu cliente para o Stripe CheckoutLado do clienteLado do servidor

Testes

Mostrar uma página de finalizaçãoLado do clienteLado do servidor

Testes

Outros recursos para testes

Apple Pay e Google Pay

OpcionalCriar antecipadamente produtos e preços

OpcionalClientes existentesLado do servidor

OpcionalPreencher dados do clienteLado do servidor

OpcionalSalvar dados da forma de pagamentoLado do servidor

OpcionalSeparar autorização e capturaLado do servidor

Veja também

Configurar a Stripe
Lado do servidor

Redirecione seu cliente para o Stripe Checkout
Lado do cliente
Lado do servidor

Mostrar uma página de finalização
Lado do cliente
Lado do servidor

OpcionalClientes existentes
Lado do servidor

OpcionalPreencher dados do cliente
Lado do servidor

OpcionalSalvar dados da forma de pagamento
Lado do servidor

OpcionalSeparar autorização e captura
Lado do servidor