跟著IG潮流來爬蟲 — 如何獲取貼文內容&留言內容 — 系列5（附Python程式碼）

使用Selenium獲取Instagram貼文&留言(可下載檔案)

You-Zhi

11 min readMar 10, 2021

Selenium 動態網頁爬蟲系列文第五篇出現拉~
本篇文章會從頭解釋，跟各位介紹如何使用網頁檢視器找到所需要的資訊，如果已經了解相關內容的話，可以直接下滑到程式碼的部分唷！！

本系列文章先前已經跟大家分享如何將 Instagram 上豐富的照片爬取下來，但現在有了照片卻少了每位發文者所想表達的含意以及關鍵字很多時候都藏在「畫龍點睛」之用的貼文內容是不是有點可惜呢~

Instagram 上充滿著各種不同的發文者分享生活，每篇貼文底下都會有留言著不同的人對於貼文的想法，整個 Instagram 圈中有相當豐饒的想法可以蒐集，然而想要快速擁有許多想法並且找出現代流行的趨勢嗎~

本篇文章將會一次將爬取「貼文內容」以及「留言內容」的精隨分享給大家！請大家千萬不要錯過唷！

學會使用網頁檢視器，爬蟲不再讓人畏懼！

Selenium 必備技能－網頁檢視器概念說明

首先，我們把網頁檢視器開啟！
（Windows系統：請按F12或者是ctrl + shift +i；MacOS系統：請按option+command+c）可以看到以下畫面（圖一）。

點擊彈出視窗上方的Elements，可以檢視網站元素。（圖二）

到Elements的畫面後，可以點擊彈出視窗左上角的小鼠標。（圖三）

點完小鼠標後，此時我們在網頁任意滑動時，旁邊的「藍底區塊」將會跟著移動，如圖四所示。

是不是疑惑著「藍底區塊」是甚麼呢？...

這裡的「藍底區塊」即是對應著「鼠標指著的區塊」的網頁元素，可以再仔細看看下面的動態圖檔，就會發現藍色區塊其實一直跟著鼠標的移動，出現了多不同的藍底區塊。

以上的簡單概念，是否都清楚了呢？

再幫大家快速複習一下吧！
1. 開啟網頁檢視器（Windows系統：ctrl + shift + i ；MacOS系統：option+command+c）
2. 點擊 Element 欄位
3. 點擊視窗左上角小鼠標
4. 移動鼠標是否有藍底區塊隨著指標出現

看似簡單的過程，但在之後的操作，可是會不停地派上用場喔～

現在我們馬上進入實戰操作！

一、貼文內容

在爬蟲之前各位要先登入自己的ＩＧ唷
想要學習一次呵成讓Selenium自動登入ＩＧ的話可以參考下方文章
跟著IG潮流來爬蟲－用Selenium帶您自動登入 IG －系列1(附Python程式碼)

本篇文章以bbcnews的此篇貼文為例，就讓我們先來爬取「貼文內容」吧
（資料來源：https://www.instagram.com/p/CHAxEG3M5rV/）

（圖五）範例貼文（資料來源：https://www.instagram.com/p/CHAxEG3M5rV/）

首先，打開網頁檢視器，我們要來尋找貼文內容的網站元素在哪裡！使用前面所教的尋找網頁元素方法，可以找到貼文內容區塊的網頁元素的class name為【C4VMK】，如圖六所示。

想要爬取貼文內容我們只需要找到這個網頁元素！是不是很快速呢～
接下來我們就直接進入程式碼的階段吧！

二、程式碼（貼文內容）

首先開啟 Python3 編輯器以及下載好 chromedriver 並放在程式碼的資料夾中。
接下來將本次爬蟲所需要的套件 import 進來，如程式碼1所示。

程式碼1、引入本次爬蟲所需套件

3. 大家還記得前面所找到的貼文內容的網頁元素（classname）是甚麼嗎？沒錯！就是【C4VMK】，我們利用這個網站元素且按照下方的程式碼去執行就能獲得我們想要的貼文內容囉！

以下我會向大家說明程式碼中三個重要部分

1. 前往指定頁面

# 想要抓取資料的頁面網址url = ‘https://www.instagram.com/p/CHAxEG3M5rV/'# 前往頁面browser.get(url)

將url 設定好你想要前往的那個頁面，然後使用browser.get(url)就能透過Webdriver前往相對應的網頁，準備開始爬取資料。

如果是按照系列文章順序讀過來的朋友應該知道 browser是什麼跟怎麼開啟了吧，如果還不知道的請參考：動態網頁爬蟲第一道鎖 — Selenium教學：如何使用Webdriver、send_keys(附Python 程式碼)

2. 找到網頁元素

# 找到貼文的網頁元素(class)post_content_element = browser.find_elements_by_class_name(‘C4VMK’)

此處可以藉由 chromedriver 的功能之一（find_elements_by_class_name），將我們前面所找到的網頁元素使電腦知道接下來要抓取資料的位置是在何處並且抓取下來！

3. 查看抓取內容，取所需要的部分，並解析成我們看得懂的文字

# 第0項是貼文內容的資料，並利用.text解析出文字post_content_element[0].text

我們透過上述抓取資料的結果可以發現，從【C4VMK】所抓取出來的資料有相當多筆

然而只有第0項才是我們所需要的貼文內容，因此我們將一大串的資料中只找第0項並使用.text解析成我們看得懂的文字，這一步完成就已經將貼文內容成功爬下來啦！

是不是很快就將貼文內容爬取下來了呢～
是不是意猶未盡呢！
不用擔心，緊接著我們要繼續爬取貼文留言的內容，同樣以bbcnews的此篇貼文為例（資料來源：https://www.instagram.com/p/CHAxEG3M5rV/）。

三、貼文留言

按照標準步驟，大家還記得一開始要大家還記得一開始要做甚麼嗎！

小提醒：找貼文留言的網頁元素～

開啟網頁檢視器，找找貼文留言的網頁元素在哪裡。

如同每次尋找網頁元素的方法之後，大家就可以像我一樣找到貼文留言的網頁元素(classname)是【_6lAjh】！如圖所示。

既然我們找到留言的網頁元素之後是不是就可以馬上開始爬取留言了呢？

答案是還不行～大家還記得一開始要用selenium來爬取Instagram嗎，是因為Instagram是屬於動態網頁，所以呢留言並不會一次全部出現，必須一直點擊更多留言的按鈕，讓更多留言出現，這樣才不會只爬到皮毛的留言喔。

知道原因之後，要跟各位簡單說明爬取留言的順序
1. 首先一直點擊「更多留言」的按鈕，直到按鈕消失
2. 爬取留言

接下來就按照流程順序以及跟著下方程式碼執行就能爬到Instagram的留言囉！

以下會針對【爬取貼文留言的程式碼】說明幾個重要的部分

如同本篇文章的第一部分【爬取貼文內容】的一開始一樣，也要先到想要爬取的網頁的頁面，再開始進行爬取的動作喔！
點擊更多按鈕

button = True
while button: # 如果更多留言的按鈕存在
    try:
        # 等待直到Button出現
        WebDriverWait(browser, 30).until(EC.presence_of_element_located((By.CLASS_NAME, 'dCJp8')))
        # 找到Button的網頁元素(class)
        more_btn = browser.find_element_by_class_name('dCJp8.afkep')
        # 自動點擊Button
        more_btn.click()
    except:
        button = False

首先設置一個開關來控制要不要繼續點擊更多留言的按鈕(Button = True)，之後進行點擊更多留言的動作，直到找不到「更多留言按鈕的元素」之後就會停止點擊。

3. 爬取留言內容

# 建立一個放留言 element-XPath 的list
content_comment_elem = []   
# 建立將content_comment_elem中轉成文字型態後放置的list
content_comment = []    
# 抓留言的網頁元素(class)，獲得留言數量(不包含回覆底下的回覆)
element = browser.find_elements_by_class_name('_6lAjh' )  
# 將抓取留言的 XPath 存入list
for i in range(len(element)):
    content_comment_elem.append(browser.find_elements_by_xpath('//*[@id="react-root"]/section/main/div/div[1]/article/div[3]/div[1]/ul/ul['+ str(i+1) +']/div/li/div/div[1]/div[2]/span'))
# 將 content_comment_elem 中轉成文字型態後存入list
for j in range(len(element) - 1) : # 這裡-1是因為抓到最後會有個空的list    
    content_comment.append(content_comment_elem[j][0].text)

這邊首先提醒的是，本篇文章爬取的留言不包含留言底下的回覆，若有需此功能可以告訴我，之後有機會可以更新！

我們繼續進行說明重點，主要的內容順序就是
1.【建立放置留言的地方】：儲存留言元素(content_comment_elem)以及儲存轉換型態後留言的list(content_comment)
2. 【獲取留言數量】：為了跑for 迴圈讓每個留言元素都可以被抓到以及轉換
3. 【爬取留言元素】：先抓取留言元素存在list中(content_comment_elem)
4. 【轉換留言元素變成文字型態】：轉成大家看得懂文字型態存在list中(content_comment)，才能拿來運用
記住這四大重點並且按照程式碼去執行，就能將留言抓取下來囉！

恭喜大家學會如何爬取Instagram的【貼文內容】以及【留言內容】！
祝大家都能成功爬取下來~

以下是各位常見的疑問

Q1.為甚麼網頁無法自動打開？

大家可以先檢查自己的chrome 版本要和各位下載下來的chrome driver版本要相符才能自動開啟網頁喔！
小提醒：chrome driver 要跟程式碼放在一起喔~

Q2. 為甚麼文章上面寫的程式碼爬得下來，我卻爬不下來？

可能因為Instagram的網頁元素（classname）改變了，因此要更新程式碼才能繼續進行爬蟲的動作喔，方法也都跟本文前面介紹的一樣，多加理解就能解決囉！

Thinking smarter makes you work smarter!
本篇完整的程式碼在此
如果你喜歡我的文章的話，請給我一點拍手~
如果你覺得喜歡又實用的話，請給我更多的拍手！

更多Selenium相關文章連結：