안녕하세요. 소심비형입니다. 이번에 네이버의 데이타랩에서 쇼핑몰 검색어 순위를 간단하게 만들다보니, 에디터의 스크립트로도 동일하게 동작하는지 테스트하게 되었습니다. 아무래도, 여러가지 전처리가 들어가는 에디터보다 네이티브 코드로 작성하는게 더 쉽고 편하긴 하더라구요^^; 범용적인 프로그램의 한계가 느껴집니다. 그래도, 범용성을 유지하면서 동일한 기능을 한다는건 여전히 큰 메리트입니다. 좀 더 썰을 풀고 싶지만... 이 글의 내용을 진행하는데에 도움이 되지는 않는거 같군요. 아무튼 아래 링크와 같은 기능을 스크립트로 만드는 방법입니다.

[ 스마트 스토어 - 키워드 분석 프로그램 v1.0 ]

 

 

이 예제에서 사용된 스크립트는 파일로 첨부되어 있습니다. 파일을 열면 아래와 같이 구성되어 있는걸 알 수 있습니다.

 

 

[ 연결 ]은 로컬 웹드라이브에 웹사이트를 연결하는걸 말합니다. 기본적으로는 웹브라우저가 화면에 표시되고, 제어할 수 있습니다. 하지만, 웹브라우저 없이 완전 자동화하려면 아래와 같이 옵션을 추가해야 합니다. ①웹브라우저 옵션에서 ②headless를 추가하세요. 이외에도 수많은 옵션들이 존재합니다. 웹브라우저의 옵션을 적절히 사용하면 막강한 매크로를 만들 수 있게됩니다.

 

 

웹사이트 주소는 "https://datalab.naver.com" 을 입력하세요. 사이트는 아래와 같은 구조를 가지고 있습니다.

 

 

엘리먼트 목록 액션은 웹사이트의 특정 엘리먼트를 가져옵니다. 물론, 설정에 따라 엘리먼트 목록을 가져올수도 있습니다. 웹드라이버와 맵핑된 웹사이트에서 데이타를 가져와야 하기 때문에 "웹브라우저 이름"을 클릭하고, [ 연결 ]의 아이디를 선택해줍니다.

 

 

요소 이름과 요소 형식은 사이트를 분석해서 찾아내야 합니다. 크롬은 고맙게도 사이트의 구성을 쉽게 알 수 있도록 개발자 도구를 무료로 제공하고 있습니다. (엣지, 파이어폭스, 사파리등등... 대부분 다 제공) 개발자 도구를 보려면 F12를 누르세요. 그리고, Control+Shift+C를 누르면 원하는 엘리먼트를 선택할 수 있습니다. 우측의 Elements에서 목록이 어떻게 구성되어 있는지 파악합니다. <ul class="rank_list"> 에 li 목록으로 포함되어 있는걸 알 수 있네요^^;

 

 

다시 엔지엠 에디터에서 요소(Element) 형식에 ClassName을 선택하고, 값인 rank_list를 입력하세요. 테스트 하다보니 카테고리에 따라 엘리먼트의 인덱스가 변경되더라구요. 카테고리가 패션의류인 경우 인덱스는 2입니다. 마지막으로 엘리먼트 값 형식에 Text를 선택해주세요. 그리고, 실행하면 아래와 같이 결과가 만들어지는 걸 알 수 있습니다. 데이터의 "엘리먼트 값" 내용을 보면 쇼핑 인사이트 검색어 순위를 가져온걸 확인할 수 있습니다.

 

 

올해는 롱패딩보다 숏패딩이 유행하려나 봅니다. 롱패딩은 4위군요. 카테고리를 바꾸고 실행 해볼까요? 위 스크립트에서 "자바스크립트 실행", "지연" 액션을 체크해주세요. 그리고, "자바스크립트 실행"의 내용을 확인 해보세요. 아래와 같이 스크립트를 실행하고 있습니다.

document.evaluate('//*[@id="content"]/div[1]/div[3]/div[1]/ul/li[5]/a', document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue.click()

 

핵심 부분은 XPath의 값입니다.

//*[@id="content"]/div[1]/div[3]/div[1]/ul/li[5]/a

 

다시~!!! 네이버 데이터랩에서 F12로 카테고리 콤보박스를 확인 해봅시다. 아래 그림을 참고해서 XPath를 복사하세요.

 

 

복사한 XPath는 디지털/가전 카테고리입니다. 이 값을 자바스크립트 실행 액션의 붙여넣기 하고 다시 실행 해보세요.

document.evaluate('//*[@id="content"]/div[1]/div[3]/div[1]/ul/li[4]/a', document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue.click()

 

제대로 검색어를 가져왔네요~ 생각보다 그렇게 어렵지는 않죠? 웹 업무를 자동화하는 것은 이처럼 사이트의 구조를 분석하여, 적절한 엘리먼트를 찾는것부터 시작됩니다. 이후에 복잡한 엘리먼트의 노드들을 탐색하면서 데이타를 파싱하고, 유의미한 데이타를 선별해서 가공 및 저장하게 됩니다. 이렇게 저장된 데이타는 통계 자료로 사용하거나 시각화하여 그래프나 차트가 될수도 있습니다. 의사결정이나 판단할 때 중요한 참고자료가 되기도 합니다.

 

 

네이버 광고에서 제공하는 데이타들도 처리하도록 로직을 만들고 개선하게 되면, 이 내용에 이어서 스크립트를 만들어서 공유하도록 하겠습니다. 겨울이 다가오니 이제 가습기가 1위를 차지하고 있네요. 얼마전까지만 해도 아이폰이 1위였던거 같은데 말이죠^^; 요즘 코로나가 다시 극성을 부리고 있습니다. 여러분들도 조심하시고~ 하시는 모든 일들이 술술 잘 풀리기를 기원합니다~!

 

개발자에게 후원하기

 

추천, 구독, 홍보 꼭~ 부탁드립니다.

여러분의 후원이 빠른 귀농을 가능하게 해줍니다~ 답답한 도시를 벗어나 귀농하고 싶은 개발자~

감사합니다~

추천1 비추천0