안녕, 세상!

셀레니움으로 인스타 정보 크롤링(스크래핑) 본문

It공부/Data science

셀레니움으로 인스타 정보 크롤링(스크래핑)

dev_Lumin 2021. 2. 6. 00:43

( 본 글의 크롤링은 크롤링이라기보다 스크래핑이 더 가깝습니다.

 보통 사람들이 스크래핑도 크롤링이라고 부르는 경향이 있는 것 같습니다.

 저도 일단 대중적인 표현으로 크롤링이라고 표현하겠습니다만

 이 부분을 염두해주고 봐주시면 감사하겠습니다. )

 

크롤링을 할 때 개인 사진 및 자료를 무단으로 수집해서 

해당 개인에게 동의의 없이 수익활동을 한다면 불법입니다.

본 글은 지적 탐구와 호기심을 바탕으로 수익 없이 오로지 학습을 목적으로 인스타의 데이터에 접근해

사용해본 것입니다.

해당 사진에 대한 무단 배포를 절대 하지 않습니다.

 

필자는 윈도우 운영체제에서 크롬 웹브라우저와 jupyter notebook으로 실습을 진행하였습니다.

(1) 인스타 셀레니움 창 띄우기

앞서 셀레니움을 사용하기 위해 한것처럼 빈 크롬 창을 띄우고 인스타 url로 접속합니다.

from selenium import webdriver
driver = webdriver.Chrome('./chromedriver.exe')
url = 'https://www.instagram.com/'
driver.get(url)

그럼 셀레니움이 적용되는 창에 인스타그램 로그인 페이지가 뜹니다.

인스타를 접속하기 위해 로그인이 필요하므로 마찬가지로

개발자 도구를 사용하여 id, 비밀번호, 로그인 버튼 모두 xpath를 복사하고 

driver.find_element_by_xpath(' ')를 이용하여 로그인시켜줍니다.

driver.find_element_by_xpath('//*[@id="loginForm"]/div/div[1]/div/label/input').send_keys('본인인스타id')
driver.find_element_by_xpath('//*[@id="loginForm"]/div/div[2]/div/label/input').send_keys('본인인스타비밀번호')
driver.find_element_by_xpath('//*[@id="loginForm"]/div/div[3]').click()

위의 코드가 run이 되면 크롬 창이 자동으로 본인 계정으로 로그인을 할 것입니다.

 

 

(2) 인스그램 파악

최종적으로 하려는 것은 인스타의 사진들을 크롤링하는 것입니다.

그러려면 인스타그램의 검색 결과 페이지로부터 정보를 추출해야 하는데

해당 페이지가 정적인지 동적 페이지인지 우선 파악하겠습니다.

필자는 '전국 맛집'이라는 키워드로 검색을 하였습니다.

그럼 다음과 같이 결과가 나옵니다.

검색을 하고 처음부터 로드된 사진들이 있는 반면,

밑으로 계속 내리다 보면 새로운 사진들이 추가적으로 로드가 됩니다.

그런데 밑으로 내려서 새로운 사진들이 로드가 되더라도 url의 변화는 없습니다.

즉 검색 결과에 대한 사진들의 목록을 나타내 주는 위의 페이지는 동적 페이지라는 것입니다.

동적 페이지이므로 개발자 도구로 network를 봐서 request url을 이용하여 접근하면 될 것 같다고

생각이 들지만, 아직 로드되지 않는 사진들에 대해서는 접근을 할 수 없다는 것입니다.

 

그럼 이번엔 사진을 직접 클릭하고 나서 클릭한 사진이 집중될 때의 페이지를 보겠습니다.

해당 페이지에서는 다음 사진을 보는 오른쪽 화살표 혹은 이전 사진을 볼 수 있는 왼쪽 화살표를 클릭하면

위의 url이 바뀌는 것을 확인할 수 있습니다.

이를 통해 정적 페이지라는 것을 알 수 있으며 해당 url로 딱 해당 사진만은 가져올 수 있습니다.

하지만 하고자 하는 것은 여러 사진들에 대해 데이터 추출을 자동화시키는 것인데

한 사진만 뽑게 하는 것은 크게 의미 있지 않습니다.

또한 화살표를 클릭하여 다음 url을 보았지만, 사진들마다의 url은 다르지만

url의 패턴이 없기 때문에 반복적으로 사진들을 추출할 수 없습니다.

 

그래서 우리는 셀레니움을 사용하는 것입니다.

즉 직접 마우스 컨트롤이 가능한 셀레니움을 이용하여 자동으로 다음 사진으로 넘어가게 하며, 

넘어간 그 사진에 대해 데이터를 추출할 수 있게 되는 것입니다.

 

 

(3) 사진 데이터 추출

이미지를 추출할 때 앞서 이전 글에서 html 태그를 셀렉트 할 때 사용한 셀럭터와 비슷한

css_selector을 사용합니다.

마찬가지로 selector이기 때문에 tag와 class 혹은 id 등의 정보로

해당 html 코드 부분을 접근할 수 있습니다.

 

우선 다시 사진 목록들이 있는 페이지로 돌아가 사진을 선택하는 것부터 코드로 자동화시켜보겠습니다.

시작할 사진의 xpath를 복사합니다.

그리고 해당 사진이 클릭되게 합니다.

driver.find_element_by_xpath('//*[@id="react-root"]/section/main/article/div[1]/div/div/div[1]/div[3]/a/div[1]/div[2]')

 

이제 한 번 사진을 추출해보겠습니다.

우선 사진에 대해서 개발자 도구로 태그를 확인해봅니다.

위와 같이 이미지 링크가 있는 코드를 확인할 수 있으며 해당 코드가 이미지를 나타내는 코드라는 것을

알 수 있습니다.

그럼 주변 태그들을 살펴봅니다.

 

위와 같이 링크가 속한 태그는 img라는 태그 안에 class는 'FFVAD'라는 것을 알 수 있습니다.

그래서 코드를 다음과 같이 

image = driver_find_element_by_css_selector('img.FFVAD') 라고 하면

해당 선택한 이미지가 아니라 검색 키워드의 처음 이미지가 저장될 것입니다.

그 이유는 위의 개발자 코드를 올려보면(사진에선 안보임) 'FFVAD'라는 img안 class가 또 있기 때문입니다.

그러므로 'img.FFVAD'로 접근하는 것은 올바른 방법이 아닙니다.

 

그럼 해당 이미지가 어디까지 어느 코드까지 속한 것인지 확인을 해보니,

빨간색 네모 박스 부분이 이미지의 젤 바깥 코드입니다.

그러므로 빨간색 네모 박스 부분의 태그 클래스로 css_selctor을 사용해야 합니다.

image = driver.find_element_by_css_selector('div.PdwC2 img.FFVAD')

이미지를 css_selector로 저장을 했으니 이제 링크에 접근을 해야 합니다.

보통 이미지 파일은 'src'가 이미지 파일입니다.

image_url=image.get_attribute('src')

get_attribute(' ')로 해당 링크를 추출합니다.

그럼 이제 image_url에 이미지 링크가 저장된 것입니다.

image_url

결과로 나온 url을 복사하여 크롬에 복붙 하면 해당 사진이 잘 나오는 것을 확인할 수 있습니다.

 

그런데 여기서 또 흥미로운 사실을 알 수 있습니다.

인스타의 사진 부분을 추출할 때 css_selector를 사용한다고 했는데,

인스타의 선택된 사진 같은 경우 css_selector에 줄 조건에 대한 태그 부분이 모두

'div.PdwC2 img.FFVAD' 로 통일되어 있습니다.

 즉 다음의 페이지에서 다음 사진을 넘기고 난 뒤 마찬가지로 저 태그로 css_selector로 

이미지의 url을 추출할 수 있다는 것입니다.

이를 통해 여러 사진들을 추출할 수 있는 패턴을 안 것입니다.

 

그렇다면 특정 사진이 선택되었을 때 해당 사진을 뽑아낼 수 있는 태그와 클래스를 알았으니

이제 다음 사진으로 넘어가는 것을 구현할 수 있다면

반복을 통해 여러 사진들을 자동화시켜서 뽑아올 수 있는 것입니다.

 

다음 사진으로 넘어가는 버튼을 셀레니움으로 컨트롤하는것은 .clilk으로 하면 될 것입니다.

넘어가는 버튼을 구현하기 전 받아온 이미지 링크를 기반으로 이미지를 저장하는 것부터 해보겠습니다.

(4) 이미지 저장

이미지 저장은 다음과 같이 할 수 있습니다.

# 이미지 저장을 위한 패키지
import urllib
# 이미지 저장
urllib.request.urlretrieve(image_url, '전국맛집1.jpg')
# 현재 jupyter notebook폴더에 해당사진이 이름으로 저장됨

urllib를 import 한 후 위와 같이 사용하면 url에 대해서 이미지를 저장할 수 있게 됩니다.

 

 

 

(5) 다음 사진으로 넘어가기 버튼

다음 사진으로 넘어가기 버튼 같은 경우는 셀레니움의 xpath를 이용하여 반복적으로 다음 사진을 넘길 수 있습니다.

하지만 인스타에서 직접 해보니 주의해야 할 부분이 있습니다.

첫 번째 사진을 선택하고 넘어가기 버튼을 다음과 같이 한 번 실행해봅니다.

(아래의 사진에서 화살표 부분을 xpath를 가지고 셀레니움으로 넘어가게 하기)

# 다음 포스팅으로 이동하는 버튼(첫 포스팅)
driver.find_element_by_xpath('/html/body/div[4]/div[1]/div/div/a').click()

위의 코드를 한번 실행해주면 다음 사진으로 잘 넘어가지만 다시 한 번 실행시키면 이전 사진인

처음 사진으로 돌아오게 됩니다.

즉, xpath부분이 쭉쭉 넘어가게 적용이 되지 않는다는 것입니다.

 

그래서 이번엔 두 번째 포스팅을 선택한 채 넘어가기 버튼에 대한 xpath를 복사하여 셀레니움으로 넘어가게 해보았습니다.

# 두번째 포스팅부터 다음 사진으로 이동하는 버튼코드 부분이 계속 
# 똑같은 xpath로 사용가능
driver.find_element_by_xpath('/html/body/div[4]/div[1]/div/div/a[2]').click()

해당 코드를 여러 번 실행하면 쭉쭉 다음 사진으로 잘 넘어가는 것을 확인할 수 있습니다.

 

 

이제 위의 스킬들로 반복문을 사용하여 인스타에 검색하여 나온 결과 사진들에 대해서 

자동으로 사진 데이터를 추출해낼 수 있게 됩니다.

 

 

 

( 위의 방법은 본 글을 포스팅한 시점 기준으로 가능하지만 추후 업데이트가 되면서 안될 수도 있습니다.)

 

 

Comments