# 다음 코드는 테스트 페이지에서 Ajax의 '벽' 뒤에 있는 텍스트를 가져옵니다.

from selenium import webdriver
import time
import os

# 크롬 드라이버가 있는 파일 경로를 설정한다.
path = os.getcwd()

# working directory를 변경
os.chdir(path)

# 셀레니움 웹드라이브가 웹페이지를 따로 열지 않고도 데이터를 가져올 수 있게 해주는 장치이다.
# 만약 없으면 코드 실행 중 페이지가 자동으로 열린다.
options = webdriver.ChromeOptions()
options.add_argument('headless')  # headless: 크롤링 할때 브라우저가 안뜨도록 설정

# 설치한 크롬드라이브의 위치를 webdriver에게 알려줘야 한다. chromedriver.exe가 있는 경로를 설정해준다.
driver = webdriver.Chrome('chromedriver.exe', options=options)

URL = "http://pythonscraping.com/pages/javascript/ajaxDemo.html"
driver.get(URL)

time.sleep(3)

print(driver.find_element_by_id("content").text)
driver.close()

"""
자바스크립트
최신 웹 페이지에 거의 어디서나 쓰이는 자바 스크립트에 대한 설명이 필요합니다.
자바 스크립트는 현재 웹에서 가장 널리 쓰이고 가장 잘 지원되는 클라이언트 스크립트 언어입니다. 자바스크립트는 사용자 추적을 위한 정보 수집, 폼을 새로 고치지 않은 상태에서의 정보 전송, 멀티미디어 파일 등에 쓰이며 심지어 게임도 만들 수 있습니다. 아주 단순해 보이는 페이지에도 자바스크립트가 많이 들어 있을 때가 잦습니다. 자바스크립트는 페이지의 소스 코드에서 <script> 태그 부분에 들어 있습니다.

제이쿼리
제이쿼리(jQuery)는 대단히 널리 쓰이는 자바스크립트 라이브러리입니다. 유명한 인터넷 사이트의 70%가 제이쿼리를 사용하고, 다른 사이트 들도 30% 정도는 제이쿼리를 사용했습니다. 제이쿼리를 사용하는 사이트는 코드 어딘가에 다음과 같이 제이쿼리를 불러오는 임포트 문이 있으므로 쉽게 구별할 수 있습니다.
<scrpit src = "http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
사이트에서 제이쿼리를 사용한다면 반드시 조심해서 스크랩해야 합니다. 제이쿼리는 자바스크립트가 실행된 다음에 동적으로 HTML 콘텐츠를 생성할 수 있기 때문입니다. 앞에서 사용한 방법대로 페이지 콘텐츠를 스크랩하면 자바스크립트로 생성한 콘텐츠는 모두 놓치게 됩니다.

Ajax와 동적 HTML
여태까지 우리가 웹 서버와 한 통신은 페이지를 가져올 때 일종의 HTTP 요청을 보낸 것 뿐이었습니다. 페이지를 새로 고치지 않고 폼을 전송하거나 서버에서 정보를 가져온 경험이 있다면 그건 아마 Ajax를 통한 것이었을 겁니다.
Ajax는 비동기 자바스크립트와 xml의 약자이며, 
서버에 별도의 페이지를 요청하지 않고 정보를 주고 받기 위해 사용됩니다. 
Ajax와 마찬가지로 DHTML(Dynamic HTML)도 같은 목적을 위해 함께 사용하는 기술을 묶어 부르는 말입니다. DHTML은 클라이언트 쪽 스크립트가 페이지의 HTML 요소 바뀜에 따라 바뀌는 HTML이거나 CSS 입니다. 사용자가 커서를 움직여야만 버튼이 나타나거나, 클릭에 따라 배경색이 바뀌거나 Ajax 요청으로 새로운 콘텐츠가 나타날 수도 있습니다.
다양한 웹사이트에서 아주 많이 스크랩한다면 곧 브라우저에 보이는 콘텐츠가 사이트에서 스크랩한 소스 코드와는 맞지 않는 상황이 발생할 겁니다. 스크레이퍼가 내놓은 결과를 보고 브라우저에서 보던 내용이 다 어디로 사라졌는지 궁금해 질 것입니다. 또한 페이지에서 리다이렉트가 일어나서 다른 페이지로 이동했지만, 페이지 URL은 전혀 바뀌지 않을 수도 있습니다.
이런 모든 상황은 자바스크립트가 페이지에서 하는 일을 스크레이퍼는 하지 못하기 때문에 일어나는 일입니다. 자바스크립트가 없다면 HTML은 그냥 가만히 있을 뿐이며, 자바스크립트를 잘 실행하는 웹 브라우저에서 보이는 것과는 매우 다르게 보일 수 있습니다.
페이지가 Ajax나 DHTML을 써서 콘텐츠를 바꾸거나 불러올 때 어쨋든 스크랩을 하려면 해결책은 두가지 뿐입니다.  하나는 자바 스크립트를 분석해 콘텐츠를 직접 스크랩하는 것이고, 하나는 자바스크립트 자체를 실행할 수 있는 파이썬 패키지를 써서 웹사이트를 브라우저에 보이는 그대로 스크랩하는 것입니다.

셀레니움과 팬텀JS
셀리니움은 강력한 웹 스크래이핑 도구입니다. 셀리니움은 브라우저가 웹사이트를 불러오고 필요한 데이터를 가져오고, 스크린 샷을 찍거나, 특정 행동에 대한 것들을 자동화 합니다.
셀리니움에는 자체적인 웹 브라우저가 들어 있지 않으므로 다른 브라우저가 있어야 동작합니다. 팬텀JS라는 브라우저를 사용하면 그래픽을 전혀 렌더링 하지 않기 때문에  셀리니움과 팬텀JS를 결합하면 대단히 강력한 웹 스크래이퍼를 갖게 됩니다.

셀리니움 설치 
pip install selenium

팬텀 JS
웹사이트(http://phantomjs.org/download.html)에서 내려받을 수 있습니다.
"""
"""

이전에는 find와 findAll 같은 BeautifulSoup 선택지를 써서 페이지 요소를 선택했습니다. 셀리니움은 웹드라이버의 DOM에서 요소를 찾을 떄 완전히 새로운 선택자를 사용합니다.
예제에서는 선택자 find_element_by_id를 사용했지만 다음과 같이 다른 선택자를 사용했어도 됩니다.

driver.find_element_by_css_selector("#content")
driver.find_element_by_tag_name("div")

이 콘텐츠를 BeautifulSoup으로 파싱하는 것도 가능합니다. 웹드라이버의 page_source 함수는 현 시점의 DOM을 문자열로 반환합니다.

모든 것이 정확히 설치되고 설정됐다면 스크립트를 실행하고 몇 초 뒤에는 텍스트를 출력할 겁니다.
다만 이 방법은 좀 비효율 적이고, 문제가 생길 소지도 있습니다.
더 효율적인 방법은 페이지를 완전히 불러왔을 때만 존재하는 요소를 계속해서 확인하다가, 그 요소가 존재할 때만 데이터를 가져오는 겁니다.

여러가지 예상 조건을 사용할 수 있는데, 그중에서도 자주 쓰이는 것은 다음과 같습니다.

-알림 박스 팝업
-요소(텍스트 박스 등) 선택 상태로 바뀜
-페이지 타이틀이 바뀌거나, 어떤 텍스트가 페이지 또는 특정 요소안에 표시됨
-보이지 않던 요소가 DOM상에 보이게 되거나, 반대로 어떤 요소가 DOM에서 사라짐

물론 예상 조건을 사용하려면 어떤 요소를 지켜볼지 지정해야 합니다. 지켜볼 요소는 위치 지정자로 정합니다. 위치 지정자는 선택자와는 다릅니다. 위치 지정자는 By객체를 사용하는 추상 쿼리 언어입니다. By 객체는 다양한 방법으로 사용될 수 있는데, 선택자를 만들 때도 쓸 수 있습니다.

By 객체와 함꼐 쓸 수 있는 위치 지정자는 다음과 같습니다.

ID
id 속성으로 요소를 찾습니다.

CLASS_NAME
class 속성으로 요소를 찾습니다. 

CSS_SELECTOR
class, id, tag 이름으로 요소를 찾습니다. 표기법은 각각 #idName, .className, tagName입니다.

LINK_TEXT
링크 텍스트로 <a> 태그를 찾습니다. 

PARTIAL_LINK_TEXT
LINK_TEXT와 비슷하지만 문자열 일부에 일치하는 텍스트를 찾습니다.

NAME
name 속성으로 요소를 찾습니다. 폼을 다룰 때 편리합ㄴ디ㅏ.

TAG_NAME
태그 이름으로 요소를 찾습니다.
"""
