PhantomJS taking screenshots on a dynamic page?

Question

JavaScript

There is a code that takes screenshots of the page using PhantomJS, on indiegogo.com categorically refuses to work, without a custom header it gives an empty screenshot, with a custom header it's just abracadabra in an unknown encoding.

var page = new WebPage()


page.customHeaders = {
"upgrade-Insecure-Requst": "1",
"accept": "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,/;q=0.8",
"accept-Encoding": "gzip, deflate, sdch, br",
"accept-Language": "ru-RU,ru;q=0.8,en-US;q=0.6,en;q=0.4",
"user-agent": "Mozilla/5.0 (iPad; CPU OS 6_0 like Mac OS X) AppleWebKit/536.26 (KHTML, like Gecko) Version/6.0 Mobile/10A5355d Safari/8536.25",
};

var fs = require('fs');
page.onError = function (msg, trace) {
console.log(msg);
trace.forEach(function(item) {
console.log(' ', item.file, ':', item.line);
});
};

page.onLoadFinished = function() {


console.log("page load finished");
page.render('export.png');

phantom.exit();
};

page.open("https://www.indiegogo.com/", function() {
page.evaluate(function() {
});
});

Maybe he needs to feed more cookies? This has not been seen on other sites.

Answer 1

The bottom line is that all content is formed after onLoadFinished(), set a delay until the tags appear on a certain selector.
That is, almost all webmasters execute their javascript on the DOMContentLoaded event of the document object.
Pay attention to examples:
https://github.com/ariya/phantomjs/blob/master/exa...
https://github.com/ariya/phantomjs/blob/master/exa...
Or here is an example casper:
docs.casperjs.org/en/latest/quickstart.html#now-le...
Before the form is filled, the input is executed
this.waitForSelector('form[action="/search"]');