RPA/Power Automate Desktop

[Power Automate Desktop] 동적 웹 페이지 스크롤 내리기

꼰대 2021. 6. 17. 02:29

서비스되는 웹 페이지 중 스크롤을 내려야 다음 내용이 추가로 조회되어 표시해주는 것들이 있습니다. 예를 들면 네이버 쇼핑에서 원하는 제품을 검색하면 검색결과 화면이 나오는데 첫 화면에 모든 검색결과를 표시하지 않습니다. 스크롤을 하단으로 내리면 그때 추가로 검색결과를 보여주고 더 내리면 계속 추가된 검색 결과를 보여주게 됩니다. 그리고 언제인지는 모르지만 끝까지 스크롤을 내리면 페이지의 최하단이 보이죠.

페이지를 호출하는 것은 PAD에 있는데 그 다음 스크롤을 내리는 작업에 대한 작업은 없고 또한 스크롤을 내리다가 맨 끝이 어딘지 알 수 있는 방법이 없습니다.

저도 처음 난감했는데 아래 방법으로 처리하면 이를 극복할 수 있습니다.

 

목표는 네이버 쇼핑 페이지에 들어가 노트북이라고 검색하고 결과 페이지에서 스크롤을 계속 내려 검색 결과 끝까지 가보도록 하겠습니다.

먼저 전체 플로어는 아래와 같습니다.

 

우선 페이지를 열어 네이버로 이동합니다. 좌측 메뉴 웹 자동화 > 새 Microsoft Edge 시작을 끌어와 URL은 네이버, 창 상태는 편하게 보기 위해 최대화를 선택하고 저장합니다.

 

쇼핑 링크 값을 가져와야 합니다. 좌측 메뉴 웹 자동화 > 웹 페이지에서 링크 클릭을 끌어와 UI요소 드롭다운을 클릭한 다음 UI요소 추가를 클릭합니다.

 

네이버 페이지 상단 메뉴 중 쇼핑 메뉴에서 ctrl을 누른 후 마우스 클릭하여 UI 요소 추가 후 완료합니다.

 

이제 검색어로 노트북을 넣어야 합니다. 좌측 메뉴 웹 자동화 > 웹 양식 채우기 > 웹 페이지의 텍스트 필드 채우기을 끌어와 UI요소는 검색창을 위와 같은 방법으로 UI요소 추가하고 텍스트는 검색어인 노트북을 입력한 후 저장합니다.

 

다음으로 검색 버튼을 클릭해야 합니다. 좌측 메뉴 웹 자동화 > 웹 양식 채우기 > 웹 페이지 버튼 누르기를 끌어와 검색 버튼 UI요소를 추가하고 저장합니다.

검색 버튼을 클릭하는데는 여러가지 방법이 있습니다. 위 방법 말고 좌측 메뉴 마우스 및 키보드 > 키 보내기에서 Enter 키를 보내도 검색 결과가 나오고 좌측 메뉴 웹 자동화 > 웹 페이지에서 링크 클릭을 이용해도 동일한 결과를 얻을 수 있습니다.

 

이렇게 하면 아래와 같이 검색된 화면이 출력됩니다.

 

그런데 우측 스크롤 바를 보면 하단의 검색 결과가 더 있습니다. 스크롤을 내리면 추가로 검색 결과가 표시되면서 페이지 길이가 점점 늘어나는 것을 볼 수 있습니다.

 

페이지를 계속 내리면 아래와 같이 이제 더 이상 늘어나지 않고 끝에 도달 했음을 알 수 있습니다.

 

이제 이것을 자동화로 구현하도록 하겠습니다. 화면 끝까지 스크롤을 내리는 작업입니다.

PAD에는 마우스 스크롤에 대한 작업이 없습니다. 그래서 Javascript를 이용해서 스크롤을 내려야 합니다. 좌측 메뉴 웹 자동화 > 웹 페이지에서 JavaScript 함수 실행을 끌어와 JavaScript 함수 부분에 아래와 같이 추가합니다. 그리고 변수명을 prev_height로 정의합니다.

이 작업은 JavaScript 함수를 실행하는 작업으로 함수 내용은 현재 페이지의 높이를 구해 prev_height 변수에 넣는 작업입니다.

 

다음으로 좌측 메뉴 반복 > 반복을 끌어와 피연산자에 모두 1을 넣고 저장합니다. 이 내용은 1과 1이 같을 동안 반복하는 구문이고 항상 참이므로 무한루프를 도는 반복문입니다.

무한루프를 사용하는 이유는 페이지의 높이가 얼마인지 알 수 없기 때문에 무한으로 스크롤을 내리면서 높이 값을 구하기 위해 사용합니다.

 

스크롤을 현재 페이지 기준 제일 아래로 내리겠습니다. 좌측 메뉴 웹 자동화 > 웹 페이지에서 JavaScript함수 실행을 끌어와 아래와 같이 입력하고 저장합니다. 함수 내 구문이 현재 페이지 하단까지 스크롤을 내리는 내용입니다.

 

스크롤을 내린 현재의 페이지 높이를 구해야 합니다. 좌측 메뉴 웹 자동화 > 웹 페이지에서 JavaScript함수 실행을 끌어와 아래와 같이 입력합니다. 변수명은 current_height도 저장합니다.

 

이제 스크롤을 내리기 이전 높이와 스크롤을 내린 높이를 비교합니다. 좌측 메뉴 조건 > 만약을 끌어와 아래와 같이 입력하고 저장합니다.

이 구문은 이전 높이와 현재 높이가 같다면 조건문 내 구문이 실행됩니다.

 

좌측 메뉴 반복 > 반복 종료를 끌어와 조건문 내 배치합니다.

이 구문은 이전 높이와 현재 높이가 같다면 반복문을 종료하고 빠져나가겠다라는 뜻입니다.

 

다음으로 반복문 마지막과 조건문 사이에 좌측 메뉴 변수 > 변수 설정을 끌어와 변수명과 값을 아래와 같이 입력하고 저장합니다.

 

반복문을 정리해보면 다음과 같습니다.

반복문 이전 최초 현재 페이지의 높이를 구합니다. 그 다음 반복문에서 스크롤을 한번 내리고 현재 페이지의 높이를 구합니다. 그래서 이전 페이지 높이와 현재 페이지 높이가 같은지 비교합니다. 같지 않다면 현재 페이지 높이를 이전 페이지 높이에 저장하고 다시 반복문을 시작합니다.

스크롤이 내려가게 되면 이전 페이지 높이와 현재 페이지 높이가 다르게 되고 다시 스크롤을 내리게 됩니다.

그러다가 더 이상 스크롤을 내릴 수 없게 되면 이전 페이지 높이와 현재 페이지 높이는 같게 됩니다. 그렇게 되면 반복문을 빠져나오게 됩니다.

 

이제 끝났습니다. 테스트 해보면 스크롤이 계속 내려가게 되고 마지막 부분까지 오면 플로어는 종료됩니다.

추가로 만약에 다시 스크롤을 맨 위로 올리고 싶다면 JavaScript실행에 "window.scrollTo(0, 0);" 구문을 추가하면 됩니다.

 

 

그리고 위 내용을 python으로 구현하는 방법은 아래와 같습니다.

2021.05.06 - [RPA/Python] - [selenium] 동적 페이지 스크롤

 

[selenium] 동적 페이지 스크롤

예를 들면 쇼핑몰 같은 페이지는 처음부터 모든 문서를 로딩하지 않고 스크롤을 내리면 이후 문서가 로딩되는 동적 페이지이다. 페이지 스크롤 및 동적 페이지 스크롤 방법은 아래와 같다. from 

ggondae.tistory.com

 

반응형