O Connect Widget é a solução frontend plug & play da Pluggy que permite aos usuários conectar suas contas financeiras em um fluxo passo a passo, para que você só precise se preocupar em interagir com seus dados em vez de se preocupar com fluxos de login complicados.
Confira nossa documentação do Pluggy Connect Widget docs para mais informações!
Criar um endpoint ConnectToken#
Primeiro, você precisará configurar um endpoint em seu backend que será responsável por obter e fornecer um Connect Token. Este token será usado para conceder autorização ao PluggyConnect para acessar a API da Pluggy em nome de sua Aplicação.
Esse processo deve ser feito em seu backend, uma vez que o Create ConnectToken (POST /connect_token) requer autenticação na API da Pluggy (obtendo uma chave de API válida, usando o CLIENT_ID e CLIENT_SECRET de sua Aplicação).
Início rápido com Vercel#
Se você usar Vercel, fornecemos uma solução de um clique que você pode usar imediatamente, implantando este endpoint diretamente do nosso exemplo em nossos Quickstarts repositório.
Você só precisará configurar as variáveis de ambiente PLUGGY_CLIENT_ID e PLUGGY_CLIENT_SECRET.
Pronto! Agora, você pode buscar seu Connect Token em https://YOUR-APP-NAME.vercel.app/api/token.
Dica: você também pode especificar opções do endpoint Connect Token, como especificar clientUserId, chamando este endpoint com POST em vez de GET, assim:
// substitua YOUR-APP-NAME pela sua URL implantada
fetch('https://YOUR-APP-NAME.vercel.app/api/token', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
options: { clientUserId: 'user-123@mail.com' }
})
})
.then(response => response.json())
.then(data => console.log(data))
// o console irá registrar:
// {"accessToken":"eyJhbGciOiJSUzI1NiIsInR5c... "}
.catch(error => console.error(error));Configurar e Lançar PluggyConnect#
Com seu endpoint Connect Token implantado, você está pronto para integrar o PluggyConnect em sua aplicação do lado do cliente.
Revise nossos exemplos de Início Rápido#
Temos um conjunto de exemplos Frontend documentados e totalmente funcionais que você pode clonar e começar a usar imediatamente e lançar nossa interface Pluggy Connect. Você só precisa substituir a URL do endpoint ConnectToken pela sua própria.
Você encontrará exemplos com frameworks e plataformas populares, como:
- React
- NextJS
- HTML+JS simples
- Flutter
- ReactNative
- iOS
Opções e Configurações#
Para personalizar melhor sua experiência, confira as diferentes configurações disponíveis em nossa documentação.
Você encontrará opções para filtrar tipos de conectores, definir o idioma do widget e se inscrever nos diferentes callbacks de eventos que seriam acionados com base em diferentes ações e eventos do usuário.