Olá! Aqui é o Daniel, da Latenode. Se você tem um site hoje, provavelmente usa algum tipo de framework de frontend, como React. Nesse caso, muitos serviços de monitoramento podem não funcionar corretamente com seu site.
Mas há uma solução! Podemos aproveitar o poder de um navegador headless na Latenode para criar esse serviço por conta própria em apenas 5 minutos. Além disso, adicionaremos notificações de bot do Telegram usando nós no-code, garantindo que você esteja sempre informado com notificações em tempo real!
Neste artigo, forneceremos um guia detalhado passo a passo sobre como criar um fluxo de automação de monitoramento de sites em latenode.com. Esse processo envolve usar um navegador headless para verificar o desempenho do site e enviar uma mensagem de relatório para você via um bot do Telegram, além de explicar como criar um bot do Telegram com o BotFather.
Além disso, há um template pronto para uso deste fluxo esperando por você no final deste artigo, permitindo que você use esse fluxo em apenas um minuto.
Automatize o monitoramento do seu site na Latenode — a melhor plataforma de automação para você
Qual é o plano?
Para criar um fluxo de monitoramento web que envie mensagens no Telegram, você precisa:
- Criar um bot do Telegram
- Criar um fluxo na Latenode
E é ainda mais fácil do que parece! Deixe-me mostrar.
Criando um bot do Telegram
Ter uma boa relação com o BotFather é fundamental nesse processo. Mas não se preocupe, não há nada que possa causar problemas.
Depois de iniciar uma conversa com o BotFather, siga estas etapas:
- Digite /newbot. Depois disso, será solicitado que você dê um nome ao seu bot e crie um nome de usuário. É uma daquelas ofertas que não dá para recusar…
Ótimo! Agora você tem um bot do Telegram e uma chave de API para ele! - Digite /help e /setjoingroups para habilitar a possibilidade de convidar seu bot para chats em grupo.
Agora, adicione seu bot a um chat em grupo ou crie um novo com ele. Esse será o local onde o bot enviará os relatórios. Você precisará do ID desse chat mais adiante neste fluxo. Para obter o ID do chat, você precisa abri-lo usando o Telegram Web.
Você está pronto para mudar para o fluxo da Latenode. Vamos lá, não vai demorar!
Criando um fluxo em latenode.com
Faça login em latenode.com e crie um novo fluxo. Este é o fluxo de que você precisa:
Esse fluxo ativa um navegador headless uma vez em um período definido para verificar se há um texto específico na página de autorização da Latenode e, dependendo de sua presença, envia mensagens positivas ou negativas no Telegram.
Visão geral do fluxo:
- Gatilhos: Aqui você vê um gatilho de Agendamento, que permite ativar uma verificação de desempenho em qualquer intervalo de tempo, e um gatilho de Webhook, que fornece um link personalizável para ativar o fluxo a qualquer momento.
- Navegador headless: É aqui que toda a mágica acontece. Neste caso específico, o navegador headless acessa esta página e procura o texto “crie sua conta”. Se essa string existir, o resultado será verdadeiro; caso contrário, será falso.
- Nós do Telegram: Nós no-code que enviam a mensagem de acordo com os resultados da execução do nó de navegador headless.
As conexões entre o navegador headless e o Telegram têm filtros. O nó superior do Telegram é executado se o resultado do nó de navegador headless for verdadeiro. O nó inferior é ativado se o resultado for falso.
A missão está clara, vamos à ação!
1. Gatilhos
Crie um novo fluxo, clique em “Adicionar nó”, vá para Ferramentas e, na seção de gatilhos, você verá Agendamento. Defina o período de ativação, selecione o fuso horário e salve as alterações.
Depois disso, clique novamente em “Adicionar nó” e escolha o gatilho Webhook. Você não precisa configurá-lo, mas pode personalizar seu link se quiser. Salve as alterações.
2. Navegador headless
Clique em “Adicionar nó”, vá para Código e selecione Navegador headless**. Este é o código que estou usando:**
await page.goto('https://app.latenode.com/auth', { waitUntil: 'networkidle2' });
// The waitForSelector is used here to ensure that the React app has finished rendering.
// This is a simple approach and might need to be adjusted based on the actual app behavior.
await page.waitForSelector('[data-test-id="authEmailInput"]', { timeout: 10000 });
// Check if the specific string exists on the page
const isStringPresent = await page.evaluate(() => {
return document.body.textContent.includes('Create your account');
});
return { "result": isStringPresent };
Basta copiar esse código para o campo de entrada e pronto.
Observação: este é apenas um exemplo simples. Você pode criar qualquer lógica aqui; o navegador headless da Latenode oferece uma enorme variedade de possibilidades com a biblioteca Puppeteer.
Se quiser verificar como seu código funciona sem ativar todo o fluxo, use o botão “executar nó uma vez”. Isso salvará automaticamente as alterações e executará apenas esse nó. Assim, os dados desse nó também poderão ser usados no próximo nó. Falando neles…
3. Nós e filtros do Telegram
Agora você precisa adicionar nós do Telegram para que o bot avise você sobre o desempenho do site.
Clique em “Adicionar nó” e encontre a API do bot do Telegram. Aqui, você deve procurar por “enviar uma mensagem de texto ou resposta”. Adicione dois nós desse tipo e conecte-os ao nó de navegador headless.
Antes de configurar esses nós, clique na conexão e selecione “configurar filtro”. Nessa janela, dê um nome ao filtro no campo “rótulo”. Em condição, escolha o resultado do nó de navegador headless no widget Helper, depois = em COMPARAR e verdadeiro em PALAVRAS-CHAVE. Salve as alterações.
O nó conectado será executado se a execução do navegador headless for bem-sucedida.
Em seguida, crie o filtro negativo. Faça tudo igual, mas escolha falso em PALAVRAS-CHAVE.
Agora, os próprios nós.
Para configurá-los:
- Insira o token de acesso do seu bot do BotFather em “conexão”.
- Insira o ID do chat em grupo com seu bot (você pode visualizá-lo usando o Telegram Web).
- Escreva o texto da mensagem do bot.
- Selecione o modo de análise. Ele altera a aparência da mensagem.
É isso! Agora é hora de salvar o fluxo e implantá-lo! Isso deixará o fluxo automaticamente ativo.
E, como prometi antes, você pode obter este fluxo da Latenode como um template pronto aqui.
Conclusão
Parabéns, você acabou de se tornar o estimado arquiteto do seu próprio fluxo de monitoramento de sites! A partir de agora, o poder de personalizar e adaptar esse fluxo às suas necessidades específicas está em suas mãos. O único limite para a versatilidade da sua abordagem é a sua própria imaginação.
Lembre-se: você não está sozinho nesta jornada de automação low-code. Se tiver dificuldades para recriar esse fluxo ou simplesmente quiser encontrar pessoas que compartilham da sua paixão, junte-se a nós em nosso canal do Discord. Lá, você pode encontrar apoio meu, dos desenvolvedores da Latenode e de uma comunidade crescente de entusiastas de low-code. Estamos ansiosos para ter você conosco!
Automatize o monitoramento do seu site na Latenode — a melhor plataforma de automação para você
