Introdução
O módulo "Integrações" permite combinar facilmente APIs e serviços online por meio de programação visual. O módulo oferece uma interface amigável, onde você pode arrastar e conectar blocos-nós, criando a lógica de seus aplicativos de forma visual. Isso simplifica o desenvolvimento, tornando-o acessível até mesmo para aqueles que não são programadores profissionais, e acelera significativamente o processo de integração de diferentes sistemas:
Elementos principais da interface do módulo Integrações
Antes de começar a criar seus primeiros fluxos e integrações, vamos entender a interface. Compreender como os principais elementos estão organizados facilitará o trabalho e ajudará você a se familiarizar mais rapidamente.
1. Painel esquerdo com nós
O painel esquerdo é onde você encontrará todos os nós disponíveis. Estes são os elementos que você usará para construir seus fluxos de dados.
Para usar um nó, basta arrastá-lo para a área de trabalho. Todos os nós têm suas funções e podem ser configurados individualmente.
Exemplo de nós:
- Inject: permite enviar dados para o fluxo manualmente.
- Debug: exibe dados e mensagens no menu de depuração.
- Function: permite escrever código personalizado em JavaScript.
- Template: usado para criar modelos de texto ou HTML.
2. Abas
As abas estão localizadas acima da área de trabalho e permitem que você alterne entre diferentes projetos ou fluxos de dados. Isso é conveniente se você estiver trabalhando em várias integrações ao mesmo tempo ou quiser dividir a lógica em vários fluxos.
- Criar Novas Abas: Você pode adicionar uma nova aba clicando no botão com o sinal de mais
+. Cada nova aba representa um fluxo de dados separado, o que ajuda a organizar melhor o projeto. - Renomear Abas: Para renomear uma aba, clique duas vezes em seu nome e digite um novo nome. Isso é especialmente útil se você tiver muitas abas e quiser entender claramente o que há em cada uma delas.
- Excluir Abas: Clique com o botão direito na aba e selecione a opção Delete no menu de contexto. Tenha cuidado para não perder dados importantes.
- Desativar Abas: No mesmo menu de contexto, a opção Disable desativa o fluxo da aba, sem excluí-la. A aba desativada terá a opção Enable — que reativa o fluxo. No esquema JSON, esse estado é armazenado no campo
disabledda aba.
Exemplo: Se você estiver trabalhando na integração de pagamentos, pode criar abas separadas para cada serviço.
3. Área de Trabalho
A área de trabalho é a parte central da interface, onde você constrói e edita seus fluxos de dados.
- Posicionamento de Nós: Depois de arrastar um nó do painel esquerdo, ele aparecerá na área de trabalho. Aqui você pode movê-lo, conectá-lo a outros nós e criar a lógica do seu fluxo.
- Conexão de Nós: Para conectar nós, basta arrastar uma linha da saída de um nó para a entrada de outro. Assim, os dados serão transmitidos pelo fluxo de um nó para outro.
- Gerenciamento de Fluxos: A área de trabalho permite criar vários fluxos de dados, o que ajuda a organizar integrações e lógicas complexas.
Dica: Você pode ampliar a área de trabalho usando o mouse ou o touchpad para ver todos os detalhes do seu fluxo.
4. Formulário de edição de nó
Quando você clica duas vezes em um nó na área de trabalho, abre-se o formulário de edição de nó. Esta é a janela onde você configura o comportamento do nó.
- Campos de Configuração: Cada nó tem seus próprios parâmetros que você pode editar. Por exemplo, no nó
Function, você pode escrever e editar código. - Salvar Alterações: Após editar o nó, clique no botão
Submitpara salvar as alterações.
Exemplo: No nó
Function, você pode escrever código em JavaScript que transforma dados. No nóTemplate, você pode criar um modelo que insere dados dinamicamente.
5. Painel de depuração
O painel de depuração está localizado à direita e é usado para visualizar dados de saída e mensagens do nó Debug. O painel possui duas abas: Debug — mensagens do fluxo e Configuration.
- Visualizar Mensagens: Quando você executa o fluxo de dados, o nó
Debugenvia mensagens para a aba Debug. Isso ajuda você a ver o que está acontecendo em seu fluxo e verificar a precisão dos dados. - Filtrar Mensagens: A lista acima das mensagens alterna quais mensagens mostrar: all nodes — de todos os nós, current workflow — apenas dos nós da aba atual. Isso é conveniente quando você tem muitos dados de sa ída de diferentes nós
Debug. - Limpar a Janela de Debug: Clique no ícone de cruz ao lado do filtro para remover mensagens antigas e se concentrar em novos dados.
Exemplo: Se você estiver usando um nó
Functionpara realizar cálculos, adicione um nóDebugno final do fluxo para verificar se seu código está processando os dados corretamente.
6. Botões de controle
Botão "Abrir em tela cheia"
- Este botão permite expandir a interface do módulo Integrações para tela cheia, o que é útil ao trabalhar em fluxos de dados complexos ou ao demonstrar o projeto em um monitor grande.
- Ao clicar neste botão, você terá mais espaço para edição e poderá ver melhor todos os detalhes de seus fluxos.
Botão "Publicar"
- Este é o botão principal que salva e implanta todas as alterações feitas em seus fluxos de dados, tornando-os ativos. Depois de adicionar ou modificar nós, certifique-se de clicar neste botão para que suas configurações comecem a funcionar.
Botão "Importar"
- Este botão permite importar um esquema existente de JSON ou um exemplo da lista. Você pode saber mais na seção Importar.
Esquema de Entrada e transmissão de esquema entre nós
Cada nó no formulário de edição exibe um bloco Input Schema — este é o esquema de dados que vem do nó anterior no fluxo. O esquema mostra os campos disponíveis na forma de pares "chave — tipo", levando em consideração a aninhamento de objetos.
Se a descrição do campo estiver na descrição da API, ela será exibida ao lado da chave. Essas mesmas descrições são capturadas pelo editor de código como autocompletar e dicas ao escrever modelos Mustache.
Quais nós transmitem o esquema para o próximo nó
Nem todos os nós conseguem transmitir o esquema. A lista de nós que fazem isso:
- Function — o esquema é formado a partir do campo Output Example (JSON). Este campo também é usado como dados de teste ao chamar o fluxo sem executar realmente o código da Function.
- Admin API — o esquema é obtido da descrição do método na descrição da API. Ao clicar no botão Execute, o esquema é atualizado com a resposta real da API. Os campos que coincidem com a descrição da API mantêm suas descrições textuais.
- Http Request — inicialmente, não há esquema. O esquema aparece após clicar no botão Execute e é obtido da resposta real.
Botão Execute
Os nós Admin API e Http Request suportam o botão Execute no formulário de edição. Ele inicia a execução de toda a cadeia de nós desde o início do fluxo até o nó atual.
Características:
- O servidor executa o fluxo com base no estado do último
Publish— antes de testar, certifique-se de que o fluxo está publicado. - Se o nó
functionno caminho não transmitir dados adiante, mas tiver preenchido o Output Example (JSON), esse valor é usado como dados de teste. - Em caso de resposta bem-sucedida, o resultado é transmitido para o próximo nó como esquema.
- Em caso de erro, o esquema não é transmitido para o próximo nó.
Chamada automática de nós somente leitura
Todos os nós admin-api que realizam solicitações apenas de leitura (GET) são chamados automaticamente ao abrir a página de Integrações e ao atualizar o fluxo através do botão Publish. Isso permite sempre ter um esquema de dados atualizado sem a necessidade de execução manual.