之前記錄了幾篇「Google Apps Script 製作爬蟲工具」的心得，使用 cheerio 套件之後，解析網頁的 HTML/XML 內容變得十分輕鬆。但越來越多網頁使用 Ajax 動態載入資料內容，這些由 Javascript 產生的內容在網頁原始碼是看不到的，那麼爬蟲自然也爬不到。真要取得動態產生的 JS 內容，需要使用不一樣的技巧，本篇將分享 NBA 賽事數據實作心得整理。
(圖片出處: NBA)
一、原理
這篇「Python爬蟲·AJAX動態頁面的解析」已經將操作原理說明得很清楚了，簡單整理一下：
- 使用 Chrome 開發人員工具
- 從 Network 觀察動態載入資料的連結是哪個
- 將爬蟲工具改為爬動態載入的那個網址
- 對取得的資料進行解析即可
瞭解原理後，技術上來說取得動態載入的資料變得一點都不困難，只是換個網址來爬而已。
但實作後發現困難之處還是有，除了判斷抓哪個網址，還可能有比爬資料更棘手的問題要解決，真的需要靠經驗累積才能找到訣竅。
二、NBA 官網範例
以下使用 NBA 官網來做範例，進入 NBA 比分戰況頁面：
- 可惜時間還太早，比賽都還沒開始，所以看不到任何比分數據。
- 不過沒關係，打開「Chrome 開發人員工具」→ 切換到「Network」頁籤，我們要觀察頁面會載入哪些資料
- 接著比賽日期切到前一天，由於 NBA 官網不會切換頁面，而是使用 Ajax 動態取得數據，我們看看 Network 會得到什麼資訊
- 畫面上紅框處看到前一天的「獨行俠 vs 火箭」比賽結果 137：123，Doncic 與 Harden 兩位明星各自都有十分傑出的演出。
- 在 Network 我們運氣很好，第二個載入的檔案 scoreboard.json 這檔名看起來就像裝了我們要的比賽數據資料，而且以 json 格式儲存，將來處理更加方便
- 右邊「Headers」欄位紅色底線處，可看到這個檔的完整連結，我們就來看看裝了什麼內容
- 切換到「Preview」可預覽檔案內容
- 上方紅色底線可看到比賽場館在休市頓的 Toyota 中心，八成就是我們要找的這場比賽
- 下方紅框有 Doncic、Harden 的本場數據，跟網頁上的資料一模一樣，可以確定這個檔能撈到所有我們需要的比賽數據
三、反爬蟲機制
1. 禁止存取數據
接著準備爬 json 資料吧，試著把前面取得的 json 連結用瀏覽器叫出來看看內容：
https://data.nba.net/prod/v2/20191224/scoreboard.json
真糟糕，怎麼只有這短短幾行，跟剛剛看的完全不一樣！根本沒有取得任何數據啊~~
無論是什麼原因，也許呼叫該網址要存取 cookie，也許有限制存取網域，總之 nba.com 有反爬蟲機制，不給輕易爬取資料，那麼該怎麼辦呢？
2. 找別的網站
我相信高手有辦法反制各種限制，而我的想法是，找出破解方法的時間，應該是遠高於換一個網站爬的時間，畢竟存放 NBA 比賽數據的網站多到數不清。
舉例來說，測試了「中國 NBA 官網」後，發現網站並沒有擋爬蟲，那麼使用以下的網址就能成功取得數據：
- 比賽網址：https://china.nba.com/scores/#!/比賽日期
- 數據 json：https://china.nba.com/static/data/scores/daily_比賽日期.json
以上日期都是 YYYY-MM-DD 格式，例如這個網址可取得 2019-12-24 數據：
https://china.nba.com/static/data/scores/daily_2019-12-24.json四、總結
簡單總結一下本篇爬蟲 Ajax 數據心得：
- 從爬取網頁原始碼改為尋找儲存數據的連結網址
- 利用 Chrome 開發人員工具的 Network，分析動態載入的連結
- 練習從檔名、網址結構找到正確的目標
- 如果遇到反爬蟲的網站，換個網站爬
更多爬蟲工具相關技巧：