無法拍攝網址的網頁截圖

Question

我一直在使用node-webshot與我的一個Sailsjs項目相當長一段時間。在此，我使用它來拍攝路線的網頁截圖，其中包含使用谷歌圖表創建的動態圖表和圖表。問題是，一旦圖形生成（在本例中爲氣泡圖），node-webshot方法調用會生成此頁面的空白圖像。但是，如果我在瀏覽器中打開路線，它會完美地生成圖形。

這是獲取動態生成圖表的那種 - http://jsbin.com/vewesafegi/edit?html,js,output

這是我使用生成其webshot帆JS節點webshot代碼。

var options = { 
     screenSize: { 
      width: 710, 
      height: 500 
     }, 
     shotSize: { 
      width: 710, 
      height: 'all' 
     }, 
     userAgent: 'Mozilla/5.0 (iPhone; U; CPU iPhone OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.20 (KHTML, like Gecko) Mobile/7B298g', 
     siteType: 'url', 
     renderDelay: 500, 
     quality: 50 
    }; 

    webshot('http://localhost:1337/generatedChart','Chart.png', options, function(err) { 
     //do something 
     res.ok(); 
    }); 

Answer 1

好吧......所以，我讀節點webshot的文檔和發現，在webshot的options，我可以設置一個名爲takeShotOnCallback鍵如果將它設置到true，可以讓我有一個回調（window.callPhantom('takeShot');）從頁面加載。

此回調會告訴網頁截圖調用採取頁面的屏幕截圖。 更多這裏 - https://github.com/brenden/node-webshot#options

而生成的鏡頭是空白的原因是因爲頁面沒有加載動畫生成的圖形在網頁截圖時。