HackMD
動態網頁爬蟲-使用Selenium
tags: python selenium crawler
介紹
動態網頁
動態網頁顧名思義，指的就是網頁內容是動態的，每次瀏覽同一個網頁的內容可能都不同，例如: 書本的搜尋，匯率，新聞等等，根據使用者的選擇或輸入不同的互動，動態的產生網頁內容。
客戶端動態網頁
產生有兩種方式:
- 從網頁伺服器下載JavaScript程式碼，在客戶端執行後產生內容。
- 透過客戶端的需求，在伺服器端產生內容後，以AJAX(Asynchronous JavaScript And XML)技術下載到客戶端。
伺服器端動態網頁
在網頁伺服器內以伺服器程式語言(如: PHP，ASP.NET或JSP等等)執行後來動態產生網頁後再回應給客戶端。
Selenium
對於爬蟲來說，如果爬取動態網頁內容，只會得到一堆JavaScript程式碼，因為網頁內容需要透過執行JavaScript程式碼後產生，所以對於動態網頁，爬蟲會看不到執行後的結果，所以無法使用Beautiful Soup或lxml來爬取資料。
Selenim為一個跨平台的自動瀏覽器(Automates Browsers)，其原本是用來做為Web應用程式的軟體測試框架，本身為開放原始碼，用在爬蟲上，可以做為模擬使用者輸入內容，點擊連結來與網頁作互動。
Selenium套件
Selenium為數個元件組合而成的一個套件，其元件有:
- Selenium IDE: 一套建立Selenium測試的整合開發環境，附屬在Chrome或Firefox瀏覽器內，可以錄製，編輯和除錯建立的Selenium測試。
- Selenium Client API: 可以直接使用程式語言來建立Selenium測試，支援: Java，Ruby，JavaScript，C#和Pythonx來跟Selenium WebDriver通訊。
- Selenium WebDriver: 接收來自Selenium API的命令來控制瀏覽器，支援Chrome，Firefox，Safari，Microsoft Edge ，IE等瀏覽器。
安裝Selenium
對Python來說，需要安裝有個，一個是Selenium Client API(也就是Python模組)，另一個就是WebDriver，。
安裝Selenium Client API
pip3 install selenium
安裝WebDriver
步驟一: 下載
https://www.selenium.dev/documentation/webdriver/getting_started/install_drivers/
備註:
- Selenium 4.6版（包含）以後不需要再下載driver了。
- Selenium 4.5版以前請下載對應瀏覽器的WebDriver
注意:
- WebDriver並非下載最新版本就好，而是下載的版本必須和你的瀏覽器版本一樣，例如你的Chrome瀏覽器是106版，那WebDriver就要下載106版的。
Windows作業系統請下載chromedriver_win32.zip即可。
解壓縮
將下載的zip檔案解壓縮到你的Python程式目錄下。
Selenium基本操作
引入selenium的webdriver物件
from selenium import webdriver
初始化WebDriver
driver = webdriver.Chrome('chromedriver')
注意：
如果是在MacOS下，如果和Python放在同一層目錄，需要額外加上代表目前路徑的
./符號，如：driver = webdriver.Chrome('./chromedriver')
設定等待網頁載入的時間，如果提早載入完成，會提早結束等待，如果時間不夠，讀到的網頁內容會有殘缺:
driver.implicitly_wait(10)
連線到網站:
driver.get('https://rate.bot.com.tw/xrt?Lang=zh-TW')
印出網頁標題:
print(driver.title)
取得網頁內容並印出:
html = driver.page_source
print(html)
也可以利用BeautifulSoup來分析網頁內容:
soup = BeautifulSoup(driver.page_source, 'lxml')
print(soup.prettify())
將取得的網頁內容存到本地端:
with open('index.html', 'w', encoding='utf-8',) as file:
file.write(soup.prettify())
關閉WebDriver, 瀏覽器也會跟著關閉:
driver.quit()
完整程式碼
from selenium import webdriver
from bs4 import BeautifulSoup
import requests
driver = webdriver.Chrome('chromedriver')
driver.implicitly_wait(10)
driver.get('https://rate.bot.com.tw/xrt?Lang=zh-TW')
print(driver.title)
html = driver.page_source
print(html)
soup = BeautifulSoup(driver.page_source, 'lxml')
print(soup.prettify())
with open('index.html', 'w', encoding='utf-8',) as file:
file.write(soup.prettify())
driver.quit()
Selenium資料定位
Selenium有兩個系列的資料定位函式:
find_element(): 用來取得網頁中的第一個定位到的HTML元素。find_elements(): (名稱中多了一個s)，用來取得所有網頁中定位到的元素。
這兩個函式都可以使用下面方式來定位元素:
| 名稱 | 說明 |
|---|---|
"id" |
使用id屬性值來定位元素 |
"name" |
使用name屬性值來定位元素 |
"xpath" |
使用XPath表達式來定位元素 |
"link text" |
使用超連結文字來定位元素 |
"partial link text" |
使用部分超連結文字來定位元素 |
"tag name" |
使用標籤名稱來定位元素 |
"class name" |
使用class屬性值來定位元素 |
"css selector" |
使用CSS選擇器來定位元素 |
ID = "id"
XPATH = "xpath"
LINK_TEXT = "link text"
PARTIAL_LINK_TEXT = "partial link text"
NAME = "name"
TAG_NAME = "tag name"
CLASS_NAME = "class name"
CSS_SELECTOR = "css selector"
定位台灣銀行匯率下載CSV按鈕，並模擬點擊來下載檔案
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.common.exceptions import NoSuchElementException
from bs4 import BeautifulSoup
import requests
driver = webdriver.Chrome('chromedriver')
driver.implicitly_wait(10)
driver.get('https://rate.bot.com.tw/xrt?Lang=zh-TW')
print(driver.title)
html = driver.page_source
try:
download_csv = driver.find_element(By.LINK_TEXT, '下載 Excel (CSV) 檔')
print(download_csv.tag_name)
print(download_csv.get_attribute('href'))
download_csv.click()
except NoSuchElementException:
print('無法定位')
driver.quit()
備註:
下載的檔案名稱會跟直接從網站下載的檔名不同
Selenium動作函式:
| 名稱 | 說明 |
|---|---|
click() |
點擊元素 |
click_and_hold() |
在元素上按住滑鼠左鍵 |
context_click() |
在元素上按住滑鼠右鍵 |
double_click() |
點擊兩次元素 |
move_to_element() |
移動滑鼠游標到元素中間 |
key_up() |
放開鍵盤的按鍵 |
key_down() |
按下鍵盤的按鍵 |
perform() |
執行所有儲存的動作 |
send_keys() |
送出按鍵到元素 |
release() |
在元素上鬆開滑鼠按鍵 |
執行JavaScript程式碼
使用 Selenium 滾動網頁捲軸(scrollBar)
driver.execute_script('window.scrollBy(0,1000)')
說明:
scrollBy(x,y)中，x為必須參數，表示向右滾動的像素值；y也為必須參數，表示向下滾動的像素值
driver.execute_script('window.scrollTo(0,1000)')
說明:
scrollTo(x,y) 中，x為必要參數，表示要在視窗顯示區左上角顯示的x坐標；y也為必要參數，表示要在視窗顯示區左上角顯示的y坐標
捲軸拉到底
driver.execute_script('window.scrollTo(0,document.body.scrollHeight)')
或
driver.execute_script('window.scrollTo(0,document.documentElement.scrollHeight)')
send_key()常用的按鍵代碼
ENTER SHIFT LEFT_SHIFT CONTROL LEFT_CONTROL ALT LEFT_ALT SPACE
Selenium例外物件
| 名稱 | 說明 |
|---|---|
| ElementNotSelectableException | 選取的該元素不允許被選取 |
| ElementNotVisibleException | 元素存在，但是不可見 |
| ErrorInResponseException | 伺服器端回應錯誤 |
| NoSuchElementException | 選取的元素不存在 |
| TimeoutException | 超過時間限制 |
