鑑於一個網址檢索該網頁上的最大圖像與節點

Question

我期待建立一個功能到一個Angular.js網絡應用程序，允許用戶將一個URL粘貼到電子商務網站如亞馬遜或Zappos和檢索主來自該頁面的產品圖片。我的計劃是將URL發佈到我的express API並處理服務器上的圖像檢索。

我最初的計劃是下載原始html，用htmlparser解析出來，選擇所有的html圖像元素soupselect並檢索它們的src屬性。理想情況下，我希望實施可在任何網站上運行的解決方案，而不僅僅是針對特定零售商網站的硬編碼值（使用特定的已知css類名稱）。我做的一個假設是，頁面上最大的圖像可能是主要的產品圖像，這個邏輯我決定嘗試按照文件大小對圖像進行排序。我的想法是用每個圖像的src url做一個http頭部請求，通過content-length頭部屬性確定它們的大小。到目前爲止，這種方法運行良好，但我真的希望避免發出如此多的http請求，即使它們只是頭部請求。

我覺得有一個更好的方法來做到這一點，使用像PhantomJS這樣的東西來加載整個頁面並解析它會更容易嗎？我試圖儘可能快地完成這項工作，從而避免下載所有圖像。有沒有人有什麼建議？

Answer 1

我認爲使用的最佳圖像不是文件大小最大的圖像，而是在頁面上顯示的圖像最大。 PhantomJS可能可以幫助您確定。加載頁面，但指示PhantomJS不加載圖像。然後選擇計算尺寸最大的圖像元素。這隻有在頁面使用img上的CSS或寬度和高度屬性來爲其指定維度時纔有效。

或者，您可以將圖像URL發送回客戶端，讓客戶端獲取圖像並確定哪些圖像最大。這限制了服務器的請求數量，並且如果最大值不是最好的，它允許用戶快速選擇不同的圖像。