Phantom-Knoten nicht Rückgabewert von page.evaluate Funktion

Question

Ich versuche, ein bestimmtes Element einer Webseite zu extrahieren, und speichern Sie es als Bild lokal.

node.js Code, mit Phantom-Knoten:

var phantom = require('phantom'); 

phantom.create().then(function(ph) { 

    ph.createPage().then(function(page) { 

    page.property('viewportSize', {width: 1600, height: 900}); 
    page.open('http://stackoverflow.com/questions/37570827/saving-element-of-webpage-as-an-image-using-js').then(function(status) { 

     if (status == 'success') { 
      page.evaluate(function() { 
       return document.getElementById("sidebar").getBoundingClientRect(); 

      }).then(function(rect){ 
       console.log(rect); 
       page.property('clipRect', rect); 
       page.render("question2.png"); 
      }); 
     } 
     page.close(); 
     ph.exit(); 
    }); 
    }); 
}); 

console.log (rect) druckt verschiedene Werte jedes Mal wenn ich es laufen. Ich sehe nicht, warum das der Fall ist, aber so oder so, ich denke, meine Rückmeldung der Sidebar, die rect aufruft, funktioniert nicht. Stimmt etwas nicht mit dem Code?

Edit: tatsächlich, nach einem weiteren Fehlersuche, so scheint es, dass der rect richtig zurückgegeben wird, aber nicht beschränkt auf clipRect gesetzt wird ..

Answer 1

Das Problem war, dass der page.render Anruf nicht genug Zeit hat, zu beenden bevor page.close() aufgetreten ist.

Dieser Code löst das Problem:

var phantom = require('phantom'); 

phantom.create().then(function(ph) { 

    ph.createPage().then(function(page) { 

     page.open('http://stackoverflow.com/questions/37570827/saving-element-of-webpage-as-an-image-using-js').then(function(status) { 

      if (status == 'success') { 
       page.evaluate(function() { 
        return document.getElementById("sidebar").getBoundingClientRect(); 
       }).then(function(rect){ 
        page.property('clipRect', rect); 
        page.render("question.png").then(function(){ 
         page.close(); 
         ph.exit(); 
        }); 
       }); 
      } 
     }); 
    }); 
});