iT邦幫忙

0

巴哈瀑布流 Side Project 開發筆記 -6:巴哈場外休憩區C頁爬蟲(樓層留言區顯示)

  • 分享至 

  • xImage
  •  

0

巴哈場外休憩區C頁爬蟲 - 樓層留言區顯示

這邊我其實卡過好一陣子,就是不知道為什麼邏輯撞車

總之,我是設計 ArticleBody 會包著 ArticleReply
Reply 的值本身就是一個物件裝陣列,會儲存該樓所有留言和留言的各個部件

超連結無法預覽 - 被 JavaScript 加工過的 HTML

巴哈的留言內容本體,在初始的 HTML 內完全就是個純文本
使用者的留言送出疑似超連結的東西時,會被巴哈偵測,自動轉換成可以預覽的狀態
可能在稍後被 JS 轉換成有 <a><img> 包起來的東西

Cheerio 只是一個解析器,它只解析 Axios 拿回來的 HTML
也就是說, 它不會讓巴哈原站上面的 Javascript 被執行,進而影響到它爬回來的 HTML 的內容
所以我爬回來的留言一定是原始的純文本,所有的超連結都無法預覽或打開

雖然老用戶仔細回想使用經歷,確實該會是這樣,但當下這個事實有驚到我
那,我要怎麼顯示留言區的媒體內容?

正則表示法

一樣是小哈提點的辦法,利用 正則表示法 篩出所有可能會是超連結的文本,加上對應的前後 HTML 標籤
正則表示法看起來像天書,但懂規則就其實很好理解,雖然看上去是真的凌亂......

任何你覺得會出現的符號,一律以 \ 開頭
以篩出 GIF 舉例:https:\/\/[-A-Za-z0-9+&@#\/%?=~_|!:,.;]*[-A-Za-z0-9+&@#\/%=~_|]\.gif
https: 後面是不是要接 // ? 仔細看上面那串,就是在每個 / 之前都加上了 \ ,對吧?

而如果你 不確定會接什麼 ,但是你對於它 可能會是什麼 有個底的話
就使用中括號 [] 篩出那個 Range
例如 A-Za-z 就是指你覺得 大寫與小寫的字母 A~Z 都有可能出現,請它留意有滿足條件的就算通過

正則表示法


圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言