Como fazer WEB SCRAPING (Raspagem de Dados) no N8N | Autotic

E aí automatizador tudo beleza Ugo aqui da Auto seja mais uma vez bem-vindo ao canal da aoti se você curte de assuntos atrelados né a automação de marketing seja de e-mail de WhatsApp de tarefas né Inteligência Artificial também que é coisa que a gente vai começar a explorar mais aqui não deixa de se inscrever no canal tá e também de deixar os likes aí nos vídeos né algum vídeo que te ajudou tá Principalmente nesse onde a gente vai estar trazendo um assunto que dificilmente né a gente vê aí a envolvendo o ntn e é um

assunto que muita gente tem nos pedido e eu tenho certeza que você vai gostar Ok então Para apoiar aí o nosso trabalho deixa um like aí tá bom e Pode deixar também as suas dúvidas né nos comentários ou no chat né a gente vai estar abrindo aí o chat você pode deixar aí também suas dúvidas beleza bom o vídeo de hoje é para falarmos sobre o Web scrap né ou seja como você consegue trir dados da Internet usando o o ntn sim embora o ntn seja voltado aí para integrações né de plataformas de aplicativos ele

também permite você fazer essa raspagem de dados tá E é mais fácil do que você eh possa pensar tá tem muita gente que fala assim ih Hugo Eu não entendo muito parece uma coisa meio complicada não é o básico aqui né eu vou estar te mostrando como é feito beleza com um exemplo bem prático aqui on a gente vai estar pegando ali informações do site da Auto tá você pode fazer isso com qualquer site que você quiser Desde que não tenha eh restrição tá um site que você consiga puxar as informações ali eh pela URL

e você vai ver como você consegue manipular essas informações e encaminhar para onde você quiser por meio aí de um de um novo HTML Tá bom então bora pra prática aqui eu já tô aqui com o meu ntn aberto tá E aí eu já tô aqui aqui também com o site da Auto aberto tá a página que nós vamos usar de exemplo é essa página aqui eh da loja né da autti onde tem alguns serviços aqui tá a Ao Total são três e aí o que que a gente vai fazer aqui a gente vai pegar

as informações eh na verdade a gente vai pegar o HTML dessa página tá por meio de uma requisição http Ok E aí nesse HTML vai vir ali todos os elementos tá vai vir as imagens vai vir o título link tudo que tem aqui no HTML a gente vai ter acesso e a gente vai mapear isso lá no nosso node HTML que é o node responsável para por fazer essa extração né fazer essa raspagem de dados tá então como é que é feito aqui primeiro você vai pegar a URL aqui da página tá E aí você

vai adicionar um node http request tá vou pegar aqui ó e obtém dados da página então eu posso botar eh obté HTML da página vou deixar aqui o modo get tá vou colar aqui a URL da página tá e você não precisa fazer mais nada porque nesse novo node aqui do http as últimas atualizações o htp request ele já consegue retornar para você o dado no formato que é esperado como eu estou pegando aqui né um um um um HTML de uma página naturalmente deixa eu executar aqui só para você entender ó executei naturalmente ele

já vai retornar aqui parece que tá com um bug aqui Ah tá beleza então naturalmente ele já vai retornar para você eh um campo chamado data tá E nele vai ser uma espécie de string tá essa string vai ser o HTML beleza aí você pode visualizar aqui no formato de Zom tá e pode visualizar no formato esquema aqui tá então ó ele retorna lá uma string com o HTML aqui tá então você não precisa ficar mexendo em nenhum parâmetro aqui beleza próximo passo vamos utilizar o node HTML que é esse aqui ó tá E aí

nós temos três funções aqui um que vai gerar HTML tá basicamente vamos usar os três Tá mas o principal aqui vai ser esse stract HTML content Ok vamos jogar para cá E aí eu posso colocar aqui assim ó eh extrai elementos do HTML Ok E aí lembra que eu falei que lá no art Prest você não precisa ficar mexendo em nada por quê porque ó pro padrão ele já vai trazer o HTML em formato string e já vai atribuir ele um nome data tá então repare que o node HTML o a propriedade do Jon né

que seria a string ali ele já vai deixar aqui como data então o pessoal lá do NN ele já ele já programa os nodes para que em suas configurações padrão Eles já consigam se interligar um no outro tá então aqui ele Basic bicente vai pegar esse conteúdo aqui data tá e aqui você vai informar qual é o elemento desse HTML aqui que você quer extrair o valor tá então como o nosso objetivo aqui né é pegar por exemplo a imagem o título né e o link também de acesso eu também quero pegar esse link aqui

ó o link que dá acesso à página do próprio serviço tá onde vem mais informações aqui sobre serviço né e etc tá bom E aí que que eu vou fazer aqui como eu quero pegar primeiro a imagem aqui eu já vou colocar aqui assim ó imagem tá CSS selector é basicamente o identificador daquele elemento tá eh quando a gente trabalha com raspar de dados você tem que ter pelo menos um conhecimento de CSS selector tá ou melhor CSS porque o CSS é onde você consegue a identificação ali do elemento ele pode ser por exemplo pro

ID pro name pelo próprio CSS né selector que seria a o atributo Class tá E também poderia por ser por xpf Tá mas xpf ele é um pouquinho mais avançado porque tá atrelado mais a posição ali do elemento daquela página inclu Inclusive eu não recomendo eh fazer pro xpf porque se a página tiver o acréscimo ou uma remoção ali de um elemento já você já perde a referência daquele elemento Tá então vamos sempre pegar por ID por name se tiver que é muito difícil ter às vezes ainda mais quando é utilizado Construtor né que é

WordPress Então os elementos geralmente são são atribuídos à Class tá então o que que eu vou fazer aqui eh você vai apertar f12 do seu navegador E aí você vai usar essa opção aqui ó eh que é o inspect Né para você poder clicar nele e selecionar o elemento da página repar que ele vai ó destacando aqui então se eu quero pegar o título eu encosto aqui para ele ficar azul né se eu quero a imagem ó eu encosto aqui para ficar azul se eu quisesse o botão ó aponta aqui ele vai selecionar o botão

tá então isso aqui é o insect para você selecionar qual elemento você quer pegar ali os atributos tá então vou clicar aqui na imagem e olha só que interessante ele já abre aqui o HTML para mim apontando o respectivo elemento tá que é esse IMG aqui que é imagem no HTML tá E logo aqui do lado ele já traz aqui a folha de estilo né com a formatação desse elemento aqui Hugo como é que eu faço então para pegar o identificador aqui dessa imagem simples o identificador basicamente será o nome da tag no caso aqui

o MG ponto e o nome do Class Ok sendo que tem um segredo aqui ó quando você clica aqui em Class né para você pegar o valor dele ó vou copiar tá ó vou copiar e vou jogar aqui eh num num bloco de notas Ó collei aqui tá E aí no início você coloca IMG certo que é o nome do elemento a a metatag né do elemento ali no HTML e repare que você tem aqui a primeira classe tá E aí tem um espaço e depois vem uma subclasse Tá Hugo eu poderia colocar somente a

classe sim mas eu recomendo você colocar até a subclasse porque a identificação daquele elemento ela acaba sendo bem específica tá porque se você não coloca subclasse às vezes pode ter outros elementos dessa classe aqui e aí acabar confundindo ou seja o o htm abstract pegar até elementos que você não gostaria que pegasse tá então é sempre bom você usar o identificador completo sendo o qu eh no lugar do espaço aqui entre a classe e subclasse você tem que substituir por ponto tá senão não não vai funcionar lá na sua automação do ntn tá então entre

a classe e as subclasses você sempre substitui o espaço ali pelo ponto Beleza então está pronto aqui o nosso identificador tá vou voltar lá no NN vou colar aqui tá em CSS selector e aqui eu vou determinar o que que eu quero que traga de informação desse meu elemento eu posso retornar um atributo dele tá que aí pode ser um um HF que é o RL pode ser um sece que é às vezes o endereço ali da imagem enfim são vários atributos posso retornar o nome da classe posso retornar eh o name enfim qualquer atributo

ali da da daquele elemento tá eu posso retornar o HTML que aí já seria o código mesmo da HTML do do elemento tá o texto tá o texto é aquilo que fica ali eh dentro do do elemento que geralmente é mais quando a gente vai extrair ali um elemento do tipo parágrafo né do tipo eh spam né que é texto text área né quando é um um uma área de texto é mais para elementos de texto tá e o Val seria mais para elementos do tipo input né como se fosse ali um um text box

né um na verdade um texada texada é um input tá Só corrigindo aqui é um input e o tex seria mais eh H2 H1 H3 que são títulos né spam P que é parágrafo tá agora Val seria mais quando você quer pegar o o valor ali dentro de um de um input né um text box um text área um select enfim tá Ugo não tô entendendo nada disso que você tá falando é porque são conceitos básicos de html tá Inclusive eu recomendo depois você acessar o site lá w3s school.com e você vai aprender bastante lá

sobre HTML sobre CSS CSS selector Tá bom então aqui eu vou selecionar eh atributo Tá Hugo Qual é o atributo que eu tenho que pegar aqui dessa imagem eu tenho que pegar o sece porque como eu quero pegar a imagem a imagem aqui seria o quê a URL dela certo então eu vou pegar esse atributo aqui ó tá vendo ó CCE tá então eu vou vir aqui vou botar aqui ó src CCE é o nome do atributo tá esse return Array né Array é para você poder eh capturar de todos os elementos que tiverem esse

mesmo identificador tá por exemplo se eu chegar aqui ó e executar só para você entender ó repare ele retornou apenas uma url só de imagem tá por qu porque eu não marquei essa opção aqui return Array Se eu marcar Olha o que que vai acontecer ele vai retornar de várias tá vendo ele basicamente aqui retornou a URL de imagem das três tá então return Array é você extrair de múltiplos extrair alguma informação de múltiplos elementos que atendem esse parâmetro aqui esse que que tenham Esse identificador aqui tá Hugo mas se são três elementos Por que

retornou aí se né porque começa aqui do índice zero vai até o CCO porque é como cada imagem aqui tivesse dois se tá isso aqui pode acontecer em algumas páginas é claro que o adequado seria só retornar esses três primeiros aqui tá bom mas não tem problema se isso acontecer porque lá na frente a gente consegue limitar os itens tá e eu vou te mostrar como é que é Beleza então até aqui você tá conseguindo entender se sim deixa um like aí no vídeo tá bom se se está com alguma dúvida pode deixar aí no

chat ou então pode deixar aí nos comentários e a gente vai te esclarecendo tá bom ok E aí depois de pegar a imagem que que a gente vai pegar aqui agora a gente vai pegar o o título né Ó o título aqui então eu vou abrir aqui esse mesmo H esse meso mesmo node aqui tá com o único node você pode extrair n elementos tá E aí eu vou adicionar mais um campo aqui tá E aí aqui eu vou botar é título Ok qual é o CSS selector dele volto lá ó uso um insect aqui

do navegador ó vou encostar aqui no título tá encostei repare que ele já apontou aqui para mim ó pro H2 H2 é é a tag usada para títulos né H2 seria mais ali um subtítulo E aí repare que tem um Class dele aqui ó vou copiar tá ó ele não tem sub subclasse é só uma classe mesmo tá vendo ó não tem nenhum espaço aqui então eu só copio venho aqui coloco aqui ó H2 ponto e o nome da classe beleza que que eu quero retornar dele no caso seria text mesmo certo porque ó quando

eu venho aqui aqui ó o text é essa string que fica dentro da tag tá fica até na cor branca ó por exemplo se eu fosse pegar o elemento aqui ó esse de baixo ó by Auto o text desse elemento que é um div né é by Auto chck tá como eu vou pegar o o título aqui ó eu vou pegar o texto dele que tá como configuração do smtp Beleza então vou deixar aqui como text tá e esse skip selector e se eu não me engano acho que se tivesse ali alguma tag ali misturada

no texto aí ele pularia alguma coisa assim tá inclusive Isso aqui é uma opção nova do do HTML exct vou marcar aqui o return Array né para ele poder retornar todos os títulos ali da página de cada serviço tá E aí vamos executar novamente para ver como se comporta Olha que legal ó retornou lá as três imagens né e retornou também os três títulos tá e o legal é que nesse node aqui do HTML exct né ou melhor HTML do ntn ele vai extraindo e em ordem Então por mais que cada atributo do elemento esteja

em uma coluna se você for reparar as a ordem os três é o mesmo tá ó repare que a ordem é o mesmo então primeira imagem primeiro título tá vendo ó já essa segunda imagem per ess segundo título tá então fica na ordem também não precis ordenar aqui os índices Tá bom por útimo gente vai pegar aqui agora eu quero pegar o link né o link de acesso desse serviço aqui ó aí eu já pego nesse elemento aqui ó que é um link tá vendo ó eu encostei o mouse aqui ó ó cliquei em cima

ele já aponta aqui pro elemento a né que é uma tag utilizada para links Ok E aí qual é o atributo do a é o href tá é esse aqui que a gente vai pegar onde tá o link da página do serviço tá então vamos lá ó vou pegar aqui novamente o Class dele ó vou copiar abrir aqui o bloco de not ó vou colar aqui tá no início vou colocar o nome da tag que é a ponto o nome da da classe tá E aí aqui no espaço entre a classe e subclasse eu ponho

um ponto aqui tá não pode ter espaços Beleza vou voltar aqui no meu nhn vou adicionar mais um aqui E esse aqui qual vai ser o título vou botar link tá vai ser um para extrair os links dos serviços da página colhe aqui o CSS select tá que que eu quero que retorne um atributo certo esse atributo se chama HF tá E são os links ali as URL dos links tá Array porque eu quero que retorne os links de todos os serviços ali bom vamos executar agora e vamos ver como vai ficar aí ó que

legal tá vendo ó ó ele retornou aqui ó as três imagens Os Três títulos e os três links tá tudo na mesma ordem ali Ok e agora a gente vai usar um node chamado split out tá que na verdade era o nome do comando do antigo item list tá é porque NN resolveu desmembrar né as funções em nodes individuais e aí aqui que que você vai fazer eh esse node aqui ele vai transformar o seu Array né sua sua lista de índices aqui tá em uma lista de itens porém aqui agora nesse split out ficou

até mais legal por quê Porque aqui você consegue referenciar vários arrei né antigamente no item list só podia referenciar um Então esse aqui veio para facilitar tá E aí para referênciar é muito simples você pode chegar aqui clicar e arrastar tá então Ó vou arrastar um arrei por um arrei tá então joguei imagem agora vou jogar título repare que ele vai colocando ó vírgula e o nome do arrei tá então ó arrastei imagem arrastei título e AG agora vou arrastar o Array link tá o arr Ele sempre vai ter esse ícone aqui ó de lista

tá vendo ó e quando você encosta o mouse aparece um totip aqui chamado arre tá E todos os valores ali do arrei são considerados índice tá e cada índice aqui é uma string beleza e aí olha só que legal que vai acontecer deixa aproximando mais para cá Deixa eu só renomear aqui ó gera lista de itens mesmo que é o nome mais Genérico e aí olha só que legal ele gerou lá a lista né do dos serviços né da página onde tem os campos imagem título e link tá então eh o os três primeiros deu

certinho aqui ó tá vendo ó Cada um tem sua sua url de imagem título e link tá os outros três né que como ele gerou eh mais três itens aqui porque cada imagem tinha até duas urls né os outros atributos ficaram aqui vazios tá mas aí não tem problema Por quê como só os três né possuem ali as os três atributos né eu posso então vir aqui adicionar um node chamado limite que também pertencia ao item list tá eh e aí eu coloco para ele retornar três Ok Ou seja eu tô limitando aqui eh a

minha como posso dizer a minha lista de itens Então eu quero que ele só retorne apenas os três tá ó vou executar aqui pronto ó agora sim agora eu tenho apenas a ali os três itens com todas as informações tá E aí o que que a gente pode fazer agora o próximo passo tá aqui ó limita itens bom próximo passo agora é a gente fazer um uma determinada formatação aqui para que quando essa essas imagens né forem eh foi for criado um template um HTML para referenciar essas imagens seria interessante a gente já colocar ela

como uma imagem mesmo né e não simplesmente ali o link dela por exemplo se eu pedir para poder gerar um HTML com base nessas informações aqui ele vai gerar ali uma espécie de tabela né exatamente do jeito que tá aqui sendo que você não vai ver a imagem por você não está e digamos assim incorporando ela você não está usando essas URL aqui em um elemento imagem então quando você for gerar o HTML não vai aparecer a imagem só vai aparecer o link tá então para ficar uma coisa mais assim bonita visualmente bonito a gente

vai fazer um tratamento aqui usando o node code tá você é aluno do nosso curso intensive você já deve ter ouvido falar bastante de code porque a gente faz bastante manipulação de dados através dele tá então vou adicionar aqui e aí eu vou utilizar esse node para formatar duas coisas tá a gente vai formatar a imagem para deixar ela no formato de imagem mesmo e não RL apenas e a gente pode e formatar o link também de tal modo que a gente consiga por exemplo colocar ali um um ID né porque muitas vezes vees a

raspagem de dados ela faz muito sentido para quem trabalha com afiliados né então se você é afiliado e e gostaria de criar uma automação NN que pegasse ali todos os produtos um site né de um e-commerce por exemplo E esse e-commerce tem afiliação um exemplo se você quisesse pegar todas as imagens e atribuir links de afiliados seu neles e mandar e-mail de alguém você consegue fazer isso aqui através do NN e eu vou te mostrar tá através desse mesmo tutorial aqui beleza e aí essa manipulação você consegue fazer pelo code aqui tá então o que

que a gente vai fazer aqui eu vou selecionar essa opção aqui ó para executar para cada item tá E aí eu vou até deixa eu maximizar aqui vai ficar mais fácil a visualização tá E aí o que que a gente vai fazer eh basicamente eu vou fazer assim ó calma aí igual Então se você for reparar ó é porque eu não sei se dá para acho que eu vou ter que fechar aqui para mostrar então vamos lá nós temos três Campos aqui né temos imagem título e link tá lembrando que essa parte aqui do Code

nós temos um aulão aí no canal tá que é aulão número um dominando o editor de expressão se você não não assistiu ainda essa aula Assiste porque é obrigatório para você entender um pouco do que a gente vai fazer aqui tá bom então se você parar nós temos três Campos aqui imagem título e link tá que que eu vou fazer aqui eh aqui eu já vou referenciar o nome imagem tá E aí eu já aproveito aqui ó copio e colo um outro outro Campo aqui mas referenciando ao O link tá então isso aqui significa que

eu vou atribuir algum valor para esse meu mesmo campo é como eu fosse sobrescrever o atual valor dele tá então pra imagem e que que a gente vai fazer na verdade PR link né Vamos começar por link porque fica mais fácil tá o link basicamente eu poderia fazer o seguinte eu poderia pegar esse mesmo valor aqui tá Opa ó e aí eu daria um sinal de mais que é concatenar né uma string nele e colocaria por exemplo assim ó ponto de interrogação ID E aí vou botar igual E aí vamos dizer que meu ID fosse

1 2 3 4 5 6 tá então é como eu pegasse a minha URL né que vem lá do link essa daqui ó vendo e atribuísse a ela essa string aqui Geralmente os ids de afiliados eles vêm assim né vem com ponto de interrogação no final ali da URL dizendo que vai chamar uma um um uma variável né um parâmetro aí coloca o nome do parâmetro igual e o valor tá depois você pode se informar também como é o formato do programa de afiliado que você faz parte Como é o formato da URL tá bom

ok então o link aqui já está formatado imagem basicamente o que que eu faria aqui eh eu criaria aí aqui eu já não preciso fazer concatenação né Eu só já definiria aqui como vai o valor então o valor basicamente seria assim ó IMG barra IMG aí aqui na imagem no elemento imagem ele vem um campo chamado tá dentro de de aspas Beleza então Aqui é onde eu deveria colocar a URL desse meu campo aqui tá E aí como você faria aqui de uma forma mais simples tá E que funciona eh como eu tenho que colocar

aqui dentro né dessas aspas duplas o Legal seria que eu dividisse isso aqui em duas Strings Como assim ungo basicamente assim ó ó se eu botar aqui agora dois sinais de mais eu vou dar até um espaço para você entender melhor ó repare que aqui Eu dividi em duas duas Strings Tá e agora aqui no meio eu vou colocar Exatamente esse input aqui ó referenciando a URL da imagem tá então quando ele for formatar né Os dados aqui nesse node code é como isso aqui gerasse isso aqui ó é como gerasse aqui ó tá vendo

ele vai gerar lá um elemento do tipo imagem e vai atribuir aurl da imagem aqui no meu atributo sece é exatamente isso que eu estou fazendo aqui deu para entender Ok então vou botar aqui ó eh gera imagem e atribui a ID de afiliado no link eu gosto sempre de renomear né o os nodes que já é uma boa prática né até porque quando alguém for mexer na sua automação já sabe o que serve cada coisa ali tá ok bom eu vou fazer o seguinte para não ficar fazendo muitas requisições no site da Auto eu

vou ativar esse pin aqui tá do node que aí ele sempre vai estar utilizando esse output aqui sem precisar fazer ali um novo Get No site Tá bom vou executar Ok bom já estamos com 30 minutos eh de vídeo vai ter um um pouquinho a mais porque realmente essa parte de web scrap ele é um pouquinho [Música] eh extenso né ainda mais com requin de detalhes aqui que a gente tá passando para vocês tá mas com certeza vai valer muito a pena O resultado é surpreendente Então olha só que legal beleza agora eu gerei ó

uma nova lista mas com os dados formatados tá então repare que a imagem agora ela não está vindo apenas a URL está vindo o próprio elemento mesmo tá ó aqui aqui também tá E lá no meu link ele já está com a referência do meu ID de afiliado beleza e o título eu mantive aqui tá resolvi não eh não mexer é claro que o título aqui você poderia por exemplo atribuir uma tag a ele também poderia né Por exemplo se eu quiser chegar aqui vamos botar aqui ó aí aqui seria título o título poderia ser

algo mais ou menos assim ó vou botar aqui tag H2 tá ó H2 e H2 aqui aí aqui Eu dividi em dois Strings Maso tem que concluir aqui com ponto e vírgula Ok e aqui eu coloco o título mesmo ó beleza vamos executar aqui para ver como sai agora ó que legal consegui formatar agora todos os os atributos ISS aqui né ó a imagem Já coloquei aqui dentro de uma tag imagem o título coloquei aqui dentro de um H2 né para ele ficar ali é maior em né e a imagem conseguir atribuir meu ID de

afiliado Tá agora você vai ver a mágica acontecer tá que até então a gente só tá vendo código aqui né texto simples e agora eu vou adicionar aqui o mesmo node HTML que é esse aqui tá porém eu vou escolher agora e eu posso escolher esse aqui ó convert to HTML table tá essa operação aqui ela não tinha antigamente tá pessoal do ntn incluiu e e de fato assim foi uma mão na roda porque você montar tabela no ntn era muito chato era muito difícil tá E agora tem uma operação aqui que o node ele

mesmo já cria uma estrutura de tabela do HTML para você muito legal tá então que que a gente vai fazer aqui agora ag Vou botar aqui ó gera tabela gera a tabela tá ó vou executar ó repare que ele gerou aqui a tabela tá ó é como ele pegasse ali os elementos e fosse colocando ali dentro da das células né que estão em uma linha em uma coluna né então é como ele pegasse os teus dados aqui e colocasse numa estrutura de tabela tá E aí aqui ele dá o nome de de table mesmo beleza

OK agora sim é que a mágica vai acontecer só confundi aqui porque o gerar tabela ele só formata ali em tabela agora agim a gente vai usar aqui o node HTML novamente tá e a gente vai escolher aqui generate HTML template Então por padrão você já vai ter acesso aqui um simples template HTML uma folha aqui de estilo mas aí ais que você vai fazer aqui é o seguinte nessa aqui deiner tá vendo ó vou até clicar aqui para marcar ó tá vendo ó aqui dentro eu posso apagar todo esse conteúdo tá e posso mencionar

essa minha variável aqui table do ntn tá quando você quer mencionar uma variável você tem que fazer como segue aqui o tutorial você usar Chaves duplas né então vou botar aqui ó Chaves duplas tá E aí eu coloco Jon ponto Qual é o nome do do campo table tá vendo ó table Ok só isso tá então ele vai pegar essa minha tabela aqui o node anterior montou né E vai eh compilar aqui nesse HTML que é onde vai acontecer a mágica aqui você vai ficar impressionado tá então eu vou botar aqui ó era o o

HTML vamos Executar tudo agora beleza Olha só isso aqui até jogar aqui mais pro lado para ficar mais fácil para você ver olha só que legal esse aqui ó ele gerou a tabela ali em HT ml tá com a imagem aqui seja Agora sim eu consigo ver a imagem né Não somente a URL dela tá ó e para cada imagem aqui tem o respectivo título ó e se você for reparar ele tá um pouquinho maior eu botei ali H2 né ó claro que se eu coloco H1 né Ia ficar um texto um pouquinho maior e

temos aqui o link tá vendo ó já com eh já com com a referência aqui do ID de afiliado beleza e aí o que você pode fazer aqui para finalizar é por exemplo enviar isso aqui para um e-mail né então sei lá você po pode criar uma automação aqui no NN que por exemplo todos os dias né Por exemplo aqui em vez de ser um start aqui poderia ser um scandle né ou seja um um agendador né onde você poderia por exemplo né ó chegar e falar assim ó todos os dias às 9 da manhã

ou 9:30 da manhã né Se quiser botar um horário quebrado e Execute esse workflow Ou seja todos os dias 9:30 é como ele fosse lá numa determinada página sua escolha pegasse ali o os serviços né daquela página A ideia é que na primeira página ali vinha ter ven a ter os serviços mais recentes digamos assim tá faria as devidas formatações e mandaria para um e-mail da sua lista de contatos aí então você poderia criar uma automação que todos os dias enviasse ali vamos dizer assim um newsletter né dizendo o seguinte ó novos serviços na auto

contrate agora e aí toda vez que a pessoa clicar ali no serviço da Auto e comprar como ela vai estar clicando por meio do seu link você ganharia comissão Então olha só que legal Dá para você fazer uma automação eh envolvendo o seu trabalho aí de afiliados ou seja em vez de você ficar pegando ali a imagem eh título link e colando manualmente ali né num sei lá numa na sua planilha e depois você mandando isso por e-mail manualmente você agora pode fazer tudo isso automatizado usando o ntn tá então vou botar aqui no finalzinho

ó um node chamado send send e-mail tá aí vou botar aqui ó Envia e-mail aí é claro você tem que ter um um smtp tá para poder configurar aqui nesse node aí aqui em from né você coloca aqui o o nome do seu remetente botei aqui da atick mesmo tá o e-mail vou botar o meu aqui do Gmail aí assunto eu posso botar novos serviços por exemplo tá nov serviços aí aqui em meio formate eu vou deixar HTML mesmo por quê Porque eu vou passar aqui como parâmetro ó o próprio HTML que foi gerado para

mim tá só isso ok e aqui eu posso escrever assim ó todos os dias as 9:30 A tá ó posso até incluir isso aqui perfeito ó e a nossa automação está pronto tá então Imagine que quando for por exemplo amanhã às 9:30 da manhã né a sua automação vai ser acionada automaticamente e aí ela vai ó pegar as informações do site vê que é muito rápido né vai fazer ali os devidos tratamentos vai gerar o html e vai mandar o e-mail para o os seus contatos né que fazem parte ali da sua lista tá E

aí o seu contato né Será que eu botei o e-mail errado deixa eu ver ali Ah tá porque demorou um pouquinho e aí o seu contato abriu a caixa de e-mail Olhou lá U é auto tique novos serviços Calma aí deixa eu clicar aqui para saber e olha só que top aqui né é claro que lá no no template HTML eu poderia botar aqui um um texto né uma descrição falando Olá tudo bem Gostaria de apresentar você o novo serviços da aoti e clique para saber mais e tal poderia botar uma coisinha mais elaborada tá

mas aqui é só para você entender então a pessoa aqui ó poderia ver o a imagem aqui do serviço tá vendo ó o título né e o link aqui é claro o que esse link aqui você poderia ao invés de você colocar aqui num numa tabela link você poderia também incorporar ao atributo href da imagem então por exemplo ao invés de a pessoa ver o link aqui e clicar Ela poderia clicar diretamente na imagem e já cair lá na página do serviço tá ou então por exemplo aqui ao invés de aparecer o link assim você

poderia colocar um texto por trás dele um link né porque o o link o a tag de link ela também aceita um texto para você e incorporar aqui uma url então ficaria clique aqui sabe pra pessoa não poder ver aqui o o link e vê que também tá com seu ID entendeu vai ficar uma coisa mais profissional ou seja o que você quiser fazer de formatação de html você pode fazer vai da sua criatividade Tá mas foi mais para mostrar para você que é possível você acessar lá o site em que você é afiliado né

extrair ali a os elementos seja de servço produtos infoprodutos enfim e pegar essas informações e repassar para os seus contatos né mas esses produtos esses itens já estarem Associados com o seu a sua url de afiliado bacana né então assim isso aqui foi só um exemplo prático de web scrap Mas você pode fazer coisas muito mais avançadas se você quiser principalmente se você for trabalhar em conjunto né com o automa né Inclusive a gente tem um vídeo aqui no no canal do auto a gente fala sobre o automa que ele também faz o Web scrap

tá é esse aqui ó ele tem é esse aqui ó o automa tá ele também faz o Web scrap porém ele é mais voltado pra interação web né então além do do ntn você também conseguiria fazer esse web scrap tá que serve para essas coisas né você poder ali pegar informações de um lugar apresentar em outro e automatizar assim um um um processo Beleza então é isso aí se você gostou desse vídeo deixa um like aí tá Para apoiar aí o nosso canal Não deixe de se inscrever é muito importante tá porque torna o nosso

canal eh mais visível digamos assim na na plataforma aqui do YouTube tá e ativa o Sininho também porque às vezes a gente posta um vídeo você só vai tomar conhecimento às vezes um dois três dias depois e com o Sininho ativado aí você já vai receber notificação na hora tá já para poder conferir o vídeo Beleza então muito obrigado pela atenção um grande abraço e até próximo tutorial valeu