Skip to content

Cliente Javascript

Vinicius Silva edited this page Mar 17, 2023 · 4 revisions

Para facilitar a implementação do PagTesouro (que possui várias dependências de CSS e JS) o pacote disponibiliza um serviço em Javascript para este fim.

Utilize o comando a seguir para publicar o arquivo na pasta public/vendor/pagtesouro/js/pagtesouro.js:

php artisan vendor:publish --tag=pagtesouro

Exemplo de utilização:

<script src="{{ asset('vendor/pagtesouro/js/pagtesouro.js') }}"></script>
<script>
    const PgTesouroIframe = new PagTesouroIframe();
    PgTesouroIframe.render('#pagtesouro');
</script>

O primeiro argumento do método render() deve ser o seletor HTML válido do elemento que você deseja inserir a tela de pagamentos. Ex: Para uma div com ID xpto deve-se passar chamar render('#xpto')

Modal

Se você está fazendo uso do recurso do botão "Fechar/Concluir", deve-se passar um segundo parâmetro o método render que é um callback.

<script src="{{ asset('vendor/pagtesouro/js/pagtesouro.js') }}"></script>
<script>
    const PgTesouroIframe = new PagTesouroIframe();
    
    PgTesouroIframe
        .render('#pagtesouro', function () {
            // botao fechar clicado.. fazer algo (fechar modal por exemplo)
        });
</script>

IMPORTANTE: Quando trabalhando localmente com o recurso do botão "Fechar/Concluir" deve-se chamar o método inSandbox() antes do método render() para dizer ao cliente JS para aceitar somente os eventos vindos da API do PagTesouro de homologação. Em produção não é necessário a chamada deste método.

<script src="{{ asset('vendor/pagtesouro/js/pagtesouro.js') }}"></script>
<script>
    const PgTesouroIframe = new PagTesouroIframe();
    
    PgTesouroIframe
        .inSandbox()
        .render('#pagtesouro', function () {
            // botao fechar clicado.. fazer algo (fechar modal por exemplo)
        });
</script>