1. 程式人生 > >客戶端瀏覽器爬蟲在爬取動態生成的img元素及動態設定src屬性的問題

客戶端瀏覽器爬蟲在爬取動態生成的img元素及動態設定src屬性的問題

問題:

1、img元素的onload設定後,設定/修改其src屬性不會觸發onload回撥,因此你無法知道頁面中的動態圖片什麼時候載入完,暫時只能setTimeout 5秒;

2、頁面JS捕獲了scroll事件以做到延遲載入,這種情況下可以呼叫img Element的scrollIntoView,但問題是這個API設計得有問題,W3C那幫人就是白痴,照理說應該和ES6 JavaScript的Promise API相互結合起來,否則你不知道一個非同步的UI狀態改變的呼叫什麼時候真正完成了

3、PhantomJS倒是可以設定clipRect然後截圖,這樣重新編碼可以把圖片內容取出來,純JS也可以使用canvas元素中轉一下,然後取出Blob或者Data URL。但純JS居然沒有一個可以獲取圖片元素原始資料的方法?!

4、可以假設一個http(s)代理伺服器指令碼,將所有的圖片請求的響應body資料都儲存起來。問題是,目前還真沒有一個好用的proxy指令碼實現,比方說Node.js倒是有一個http-proxy第3方庫,但是Node裡的Stream支援pipe很方便,想clone則很麻煩。而且IO操作一般都是非同步觸發+註冊回撥函式的風格。Python裡面雖然有強大的類庫,包括產品級別效能的Twisted,可那都是類庫形式,居然就沒一個好用的demo演示指令碼!

5、如果使用假設本地代理伺服器來截獲儲存圖片資料的話,則headless瀏覽器內的JS爬蟲需要一種方法獲得此資料,為此需要一個一致的命名風格,比如說,基於原始url重新對映為一個本地檔案系統的檔名。不過這個轉換演算法需要仔細考慮。(/、?等特殊字元對映為什麼別的字元呢)

6、圖片格式的問題,現在Web上可用的圖片格式有:jpg、bmp、png、webp、gif、svg。