Como Gerar Token Cartão de Crédito Pagseguro?

rkpontes commented 5 years ago

Olá, como eu poderia submeter ao PagSeguro para receber o meu creditCardToken e setar na solicitação de pagamento via Cartão de Crédito conforme wiki 2.3 Cartão de Crédito

->send([ 'paymentMethod' => 'creditCard', 'creditCardToken' => 'Vem do Javascript', 'installmentQuantity' => '2', 'installmentValue' => 50.20, ]);

AbrahimPatrick commented 5 years ago

Bom dia rkpontes, tudo bem?

Você precisa enviar o token via formulário ou ajax do seu front para o back. Eu fiz dessa forma, seguindo a documentação do laravel-pagseguro:

Input no html:

<input type="hidden" name="creditCardToken" id="creditCardToken" value="">

Requisição ajax que envia os dados do cartão e recebe o token:

function createCardToken() {
                let card = getCardValues();
                PagSeguroDirectPayment.createCardToken({
                    cardNumber: card.cardNumber, // Número do cartão de crédito
                    brand: card.brand, // Bandeira do cartão
                    cvv: card.cvv, // CVV do cartão
                    expirationMonth: card.expirationMonth, // Mês da expiração do cartão
                    expirationYear: card.expirationYear, // Ano da expiração do cartão, é necessário os 4 dígitos.
                    success: function (response) {
                        // Retorna o cartão tokenizado.
                        $('#creditCardToken').val(response.card.token);
                        // console.log(response.card.token);
                    },
                    error: function (response) {
                        // Callback para chamadas que falharam.
                    },
                    complete: function (response) {
                        // Callback para todas chamadas.
                    }
                });
            }

Função JavaScript para capturar os campos do cartão de crédito:

function getCardValues() {
                let card = {};
                card.cardNumber = $('input[name="cardNumber"]').val();
                card.cardNumber = card.cardNumber.replaceAll("-", "");
                card.brand = $('select[name="cardFlag"]').val();
                card.cvv = $('input[name="cardCode"]').val();
                card.expiration = $('input[name="cardValidate"]').val();
                card.installments = $('select[name="installments"]').val();

                if (card.expiration) {
                    let split = card.expiration.toString().split("/");
                    card.expirationMonth = split[0];
                    card.expirationYear = split[1];
                }

                return card;
}

fernandobandeira commented 5 years ago

Obrigado por ajudar @AbrahimPatrick alem disso, verifique a seção de implementação javascript da Wiki:

https://github.com/artistas/laravel-pagseguro/wiki/1.1.-Implementa%C3%A7%C3%A3o-Javascript

Eu linko o manual de integração do pagseguro neste lugar: http://download.uol.com.br/pagseguro/docs/pagseguro-checkout-transparente.pdf

Neste manual, tem a seção Obter token do cartão de crédito na página 10, entre outras seções que podem ser úteis também, dependendo de como quiser fazer a sua tela de pagamento.

artistas / laravel-pagseguro

Como Gerar Token Cartão de Crédito Pagseguro? #117