Forum Documentation Showcase Pricing Learn more

[PLUGIN] Juno Pagamentos - Cartão de Crédito e Boleto

Pessoal, temos agora um plugin de integração do Bubble com a Juno Pagamentos.

Com este plugin, podemos realizar cobranças via cartão de crédito ou boleto, sem e com split (recebimento dividido entre até 3 pessoas).

São 2 plugins, um para a versão Sandbox (testes) e outro para a versão Live (real), devido à uma limitação técnica.

Plugin Juno Sandbox:

Plugin Juno Live:

PRÉ-REQUISITOS:
Para usar o Plugin de Integração com a Juno Pagamentos, você precisará:

  1. Criar uma conta em sandbox.juno.com.br para testes.
  2. Criar uma conta em juno.com.br para produção.
  3. Credenciais ‘clientID’ e ‘clientSecret’. Solicite pelo email [email protected]
  4. Obter o Token privado em Integrações, no seu painel de controle Juno.
  5. Inserir nas configurações do Plugin no Bubble:
    a) Authorization: Basic XXX . Substitua XXX pelo seguinte: acesse https://www.base64encode.org/ , e insira as credenciais ‘clientId’ e ‘clientSecret’ obtidas com a Juno, divididas por um ‘:’. Vamos dizer que seu clientId seja 123, e seu clientSecret seja ABC. Insira 123:456 no campo e clique em > ENCODE <. Irá aparecer um valor no campo de baixo de aprox. 68 dígitos. Copie e cole esse valor no lugar de XXX.
    OBS: Solicite à Juno um Token com permissão de Split, se for realizar pagamentos com split.
    b) Token Público: token público obtido no seu painel de controle Juno.
    c) X-Resource-Token: insira aqui o Token Privado

OBS: Lembre-se que os tokens privados são diferentes para as contas Sandbox e Live.
Não esqueça de testar todo o fluxo de pagamento primeiro com a conta Sandbox, para depois então recriar na conta Live.

INSTRUÇÕES DE USO PARA PAGAMENTO EM CARTÃO DE CRÉDITO:

  1. Primeiro faça a chamada para criar a cobrança (sem split ou com split)
  2. Gere o Hash do Cartão de crédito que será utlizado para processar o pagamento.
  3. Faça a chamada para processar o pagamento da cobrança.
  4. Pronto. Transação realizada. Verifique no seu Dashboard Juno se a cobrança apareceu para garantir que correu tudo bem.

INSTRUÇÕES DE USO PARA PAGAMENTO EM BOLETO:

  1. Primeiro faça a chamada para gerar o boleto.
  2. Extraia da resposta da chamada o “embedded charges:first item’s checkoutURL” para pegar o link da tela de pagamento, ou o “embedded charges:first item’s installmentLink” para pegar o o link direto do boleto em PDF.

Qualquer dúvida, é só me chamar.

Abraços,

Renato Asse
:red_circle: Meus tutoriais de Bubble no YouTube
:computer: Meus tutoriais de Bubble no Blog
:camera: Meu Instagram

2 Likes

Oi. Como faço para pegar a resposta que o pagamento deu certo e gerar um dado no banco de dados de forma automática?

1 Like

Olá Renato, estou recebendo o erro 401…

… o que será que está errado?

@julio1, erro 401 é sempre UNAUTHORIZED, ou seja, sem autorização. Revise as credenciais e veja se está de acordo com as instruções do plugin.

Outra coisa, o processo aí está errado, você precisa criar um gatilho “Quando o Hash da Juno for gerado”, e aí sim colocar as ações 2 em diante dentro desse evento.

Pois é… vi isso ontem a noite… separei os processos, mas agora, nem o hash está sendo gerado…

Captura de Tela 2020-06-30 às 11.20.22

@julio1,

Aparece algum erro no console?

Nenhum.

Deixei como no vídeo seu vídeo para testar, e não aparece o Hash na tela do aplicativo, e parece que por isso, nem dispara o gatilho para criar cobrança e fazer pagamento.

@julio1,

Os erros que podem ocorrer:

  1. Unauthorized - erro na autenticação, tem que rever as credencias
  2. Não gera o hash - erro nos dados do cartão, teste outro cartão, reveja o workflow. Eu uso o cartão teste 4111111111111111, CVV 123, 12/2023. Sempre funciona. Olha o console, veja se aparece algum “false”, que vai indicar onde está o erro.

ops… agora foi… alguns detalhes corrigidos. Valeu @renatoasse !!!

Olá, alguem sabe onde consigo o dado Token Pagamento para gerar a consulta da aprovação?

Renato! Tudo bem!

A opção “Obter Hash do cartão” não está aparecendo nas chamadas nem do Sandbox, nem do Live. Não seria no workflow que eu deveria achar isso?

@tiagotravolta, esse dado vêm quando você recebe uma notificação/webhook da Juno :slight_smile:

1 Like

@eduardo.escobar.f,

Dá uma olhada nas instruções do plugin.
Essa ação aparece em Element Actions, mas antes você precisa inserir o elemento Juno na página :slight_smile:

Verdade, Renato!

Nossa, tô até envergonhado aqui… kkk! Muito obrigado, novato é assim mesmo.

Também tive esse problema.

No Sandbox só está gerando Hash com esse número de cartão que você passou “4111111111111111” - outro número não gera, nem colocando direto, nem lendo de um input. Agora, imagino que no Live funcione para qualquer número.

Algumas dúvidas que fiquei quando estava testando e que acho que podem ficar mais claras para as pessoas:

  • Você fala para preencher o Authorization, Token Público e X-Resource-Token - mas não cita que este último aparece só na chamada das ações. Eu fiquei procurando isso nas configurações do Plug-in

  • Para funcionar o Sandbox não sei se precisa preencher os dados “Dev” do plugin - na dúvida eu preenchi, mas sem saber o que é o certo.

  • Você orienta “Gerar o Hash” - acho que falta falar que isso é uma ação do elemento Juno em “Elements”.

  • Também acho que faz falta o campo de “Documentation” nos campos da ação “Obter Hash” - eu por exemplo estava colocando o ano apenas com 2 dígitos.

    Só umas contribuições para tentar ajudar, mas só temos que agradecer por você ter feito o plugin.

Abraço!

@eduardo.escobar.f, verdade.

É que dentro do curso eu já gravei uma dezena de vídeos ensinando a configurar esse plugin, pois praticamente todo mundo que usa está lá. Então eu não havia dado a devida atenção à documentação.
Mas agora com a popularização da Juno, realmente tem muita gente nova usando, que não necessariamente fazem parte da comunidade.

Vou dar uma atenção a mais na documentação pra facilitar a vida da galera.

Valeu :slight_smile:

Oi Renato. Obrigado. Abraços