n8n으로 구동되는 Slack봇 만들기

부제 : 크롤링 - 네이버지도 리뷰 요약하기

안녕하세요. 18기 n8n자동화 수업에 참여하고 있는 디디 입니다.

지난번 국립공원 생태탐방원 잔여 생활관 현황을 스크래핑 하는 워크플로우를 만들어봤는데요. https://www.gpters.org/nocode/post/create-simple-web-croquar-A7jwmS502qfBKoW
제가 골랐던 사이트가 Http Request (post) 만으로 쉽게 내용을 확인 할 수 있는 사이트였던지라 간단하게 진행할 수 있었습니다.

그 다음 n8n으로 뭘 자동화 해볼까 찾는 중에, 회사에서 저희 팀의 slack 채널 중 ‘점심’ 제안 하는 채널이 있어, 이곳에 네이버지도 url이 올라오는 경우 리뷰를 요약해서 알려주는 봇을 만들어 보기로 합니다.

그리고 데이터 수집 과정 중 마주한 벽들과 그 해결 과정을 여기에서 다시 되짚어 보겠습니다.

사용툴

  1. 채널/UI: Slack

  2. 오케스트레이션/에이전트 런타임: n8n

  3. LLM/검색 백엔드: Gemini 2.5 Flash, Perplexity Sonar Pro

진행과정

  • slack app 만들기

우선 https://api.slack.com/apps 에서 앱을 만들고, n8n에서 슬랙 노드 활용을 위한 크레덴셜 설정과 만든 앱과의 연결과정이 필요합니다. slack api 앱설정의 Event Subscriptions 에서 Request URL등록을 통해 웹훅이 정상 작동하여야 하는데, 셀프호스팅 n8n의 경우 SSL구성 등 조금 복잡한 과정이 필요해 cloudflare를 이용하는 방법으로 해결하였습니다.

특정 채널에 메세지가 포스트되면, 메세지를 보낼 수 있게 됩니다.

슬랙 트리거는 메시지를 슬랙 채널로 보냅니다

  • 네이버 지도 주소 찾기

네이버 지도에서 공유하기를 하면 https://naver.me/xzxmWCre 이와 같은 단축 url을 받을 수 있는데요. HTTP Request 노드로 주소를 날려 봅니다만, 나오는게 없습니다.

텍스트 편집기가있는 웹 페이지의 스크린 샷


많은 웹사이트들이 헤더 없이 온 요청을 데이터 수집 차단 목적으로 막게 되는데, 봇이 아닌 브라우저 처럼 보이기 위해 헤더 정보를 넣어 줘 봅니다.

노란색 점이 많은 웹 페이지의 스크린 샷


뭔가 지도 관련한게 나온거 같은데 알아 볼 수 없으니, https://codebeautify.org/htmlviewer 에 html을 붙여 넣어 봅니다. 아하.. 그냥 지도앱을 설치하라는 화면 입니다.

지도와 검색 엔진이있는 웹 사이트의 스크린 샷


HTTP Request 노드에서 Follow Redirects 옵션을 사용하라는 Chatgpt의 가이드가 있었으나 작동하지 않았고, 단축 URL의 원래 URL에 대한 구글 검색을 하다 https://www.virustotal.com/gui/home/url 이라는 사이트에 대한 정보를 확인 합니다. 사이트 위험도에 대한 검사와 더불어 최종 목적지에 대한 정보를 알 수 있습니다.

Avast Internet Security 대시 보드의 스크린 샷

Final URL 혹은 location이라는 항목으로 원래 URL을 보여주는데, 둘러보니 API를 제공하네요 무료로! 게다가 하루에 500번이라니 좋네요.

링크가있는 페이지에 대��한 링크가있는 페이지 링크가있는 페이지 링크

다시, API를 어떻게 사용해야 하는지 한 참 씨름하다, 아래의 노드를 구성해냅니다.

한국 웹 사이트의 과정을 보여주는 다이어그램

slack에서 입려된 텍스트에서, 네이버 URL을 분석 요청 API를 통해 날리고 (여긴 결과를 주지 않고, 분석 요청을 실행하는 API) 잠시 기다리고 있던 다른 분기의 노드에서는 URL에대한 BASE64 인코딩을 진행 후 virustotal 리포트 API에게 전달해 결과를 받아냅니다.

그리고 결과에서, 각 네이버지도 장소에 대한 고유번호 번호인 PlaceId를 뽑아냅니다.

  • 네이버 지도 리뷰 요약 하기

PlaceId를 추출한 이유는, 네이버지도 PC와 모바일에서 같은 장소라도 다른 단축URL이 생성되었고, PlaceId를 기준으로 주소가 정형화 되어 있었기 때문에, 조금 더 구성이 단순한 모바일페이지로 접근하기 위함 이었습니다.

한국의 Google 검색 페이지의 스크린 샷

https://m.place.naver.com/restaurant/1899758262/review/visitor
네이버지도 모바일 페이지에서 리뷰를 눌렀을 때 리뷰가 우선 10개 보여집니다.

중국 식당 웹 사이트의 스크린 샷

HTTP Request 노드로 해당 html을 수집하고, 내용을 살펴 봅니다.

텍스트 상자와 버튼이있는 웹 페이지의 스크린 샷
여러 페이지를 보여주는 웹 페이지의 스크린 샷


html이 보여지는 모습대로 제대로 들어오고 있습니다.
다음으로 CODE 노드에서 받아온 html의 리뷰 텍스트 부분만을 파싱합니다.

전화에 한국 코딩 앱의 스크린 샷

기본 HTTP Request에서는 파라미터를 변경 적용해도 10개만 출력되고 다음 리뷰를 얻어 낼 수 없습니다.
대부분의 많은 웹사이트는 동적사이트로 만들어져 있는데, html이 로딩되었다고 내용이 보이지 않고 자바스크립트가 나중에 데이터를 가져와서 채워주고 그것이 보여지게 됩니다.

네이버지도에서도 리뷰를 더 보려면 ‘펼처서 더보기’를 클릭 하는 액션이 있어야 하고, 웹브라우저의 개발자도구 Network 탭의 Fetch/XHR에서 해당 액션으로 graphql 이라는 API가 호출되는 것을 볼 수 있습니다.

전화에 한국 코딩 앱의 스크린 샷

그런데, n8n의 노드 중에 GrapgQL 이라는 노드가 있네요.

GraphQL에서 다음은 어떻게됩니까?


해당 노드를 사용하여 20개의 리뷰를 더 가져와서 텍스트를 파싱 합니다.

다양한 유형의 정보를 보여주는 웹 페이지의 스크린 샷


앞선 별도 API호출 없이 얻은 10개의 리뷰와 합쳐서 30개 리뷰의 텍스트가 만들어 집니다.

한국어 웹 사이트의 스크린 샷

기본페이지 리뷰와 더보기를 통한 추가 리뷰를 수집하는 '네이버 지도 리뷰 수집' 워크플로우 입니다.

프로세스의 흐름을 보여주는 다이어그램


이제 리뷰를 요약하고 슬랙메세지로 전송할 차례인데요. 멍멍님의 18기 n8n자동화 유튜브 요약에서 처음부터 사용해봤던, Basic LLM Chain에 gemini를 연결하여 슬랙으로 메세지를 보냅니다.

Google 검색 엔진의 프로세스를 보여주는 다이어그램

  • AI Agent 사용하기

그런데 단방향 메세지 전송이 뭔가 아쉽습니다. 나름 AI인데, 대화가 가능해야 할 것 같습니다.

  1. AI Agent로 교체하고, 대화의 맥락을 이어가도록 Postgres Chat Memory를 붙여 줍니다.

  2. 학습된 LLM만으로는 실시간 정보를 얻을 수 없어, Perplexity Sonar Pro API를 툴로 연결하여, 실시간 검색 결과를 내보낼 수 있게 합니다.

  3. 테스트 중 ‘잠시만 기다려 달라’는 메세지 후 실제 검색을 진행하지 않는 케이스가 발생하여, 동일 Agent를 하나 더 넣어 해당 조건에서 재시도 될 수 있도록 루프로 만듭니다. 모델, 메모리, 툴은 두 Agent가 공유합니다.

에이전트의 흐름을 보여주는 다이어그램

추가로 자주가는 뷔폐식당의 주간 메뉴를 알려주는 스케줄 트리거 기반의 워크플로우를 구성합니다. (여기서는 ‘카카오톡채널’의 ‘소식’을 누를 때의 껍데기 주소가 아닌, 실제 호출 주소를 찾았습니다)

최종적으로 구성된 워크플로우 입니다.

기계 학습 시스템의 프로세스를 보여주는 다이어그램

  • 어떻게 작동 할까?

일정 시간이 되면, 주간 메뉴를 알려줍니다.

한국 식품 일정의 스크린 샷

네이버 단축 URL이 공유되면, 리뷰 요약을 해주고, 실시간 검색이 필요한 질의는 Perplexity가 구동 됩니다.

한국 레스토랑 페이스 북 페이지의 스크린 샷

이제 실제 채널에 서비스 합니다. 막 요약도 시키는 군요 ㅋㅋ

메시지를 보여주는 컴퓨터 화면의 스크린 샷


결과와 배운점

네이버 지도 리뷰 요약해서 슬랙에 좀 보내보자로 시작했는데….
실시간 AI검색엔진이 탑재된 고품격 챗봇이 탄생했는데요.

실제 n8n의 워크플로우 노드를 만드신 분들은 아시겠지만, 하나 하나가 쉽게 만들어지는 것은 없었습니다. 정말 다양한 케이스들이 발생하며, 오류를 만들어 내고 그것들을 처리하기 위한 로직들도 필요합니다.

Chatgpt가 알려주는 코드나 표현식의 문법도 작동되지 않는 경우도 많아 실제 execution에서 결과 값을 보며 수정해야하는 작업도 필요합니다.

LLM API들은 아직까지는 실시간 검색 기능을 제공하지 않고, 원하는 데이터를 수십하기 위해 동적(Dynamic) 사이트를 크롤링(스크래핑)하는 것은 쉽지 않지만, Puppeteer나 Selenium같은 헤드리스 브라우저 방식을 쓰지 않고, 주어진 n8n 기본 노드 안에서 어떻게든 데이터를 긁어오는 과정은 힘들지만 재미있었습니다.

여러분들도 n8n으로 자동화의 즐거움을 느껴 보시기 바랍니다.

감사합니다.

Didi Bot Data Digger라고 말하는 배지

*슬랙봇에 사용한 프로필 이미지는 gemini imagen에서 만들었습니다.
이 사례글은 AI관여 없이 작성 하였습니다^^

8
1개의 답글

👉 이 게시글도 읽어보세요