Проблема с текущим безголовым Chrome заключается в том, что нет API для отображения полной страницы, вы получаете только «окно», которое вы установили в параметре CLI.
Я использую модуль chrome-remote-interface
, это пример захвата:
const fs = require('fs');
const CDP = require('chrome-remote-interface');
CDP({ port: 9222 }, client => {
// extract domains
const {Network, Page} = client;
Page.loadEventFired(() => {
const startTime = Date.now();
setTimeout(() => {
Page.captureScreenshot()
.then(v => {
let filename = `screenshot-${Date.now()}`;
fs.writeFileSync(filename + '.png', v.data, 'base64');
console.log(`Image saved as ${filename}.png`);
let imageEnd = Date.now();
console.log('image success in: ' + (+imageEnd - +startTime) + "ms");
client.close();
});
}, 5e3);
});
// enable events then start!
Promise.all([
// Network.enable(),
Page.enable()
]).then(() => {
return Page.navigate({url: 'https://google.com'});
}).catch((err) => {
console.error(`ERROR: ${err.message}`);
client.close();
});
}).on('error', (err) => {
console.error('Cannot connect to remote endpoint:', err);
});
Для рендеринга всей страницы одним более медленным и хитрым решением будет частичный рендеринг. Установите фиксированную высоту, прокручивайте страницу и делайте скриншоты через каждые X пикселей. Проблема в том, как управлять прокручиваемой частью? Было бы лучше внедрить собственный JS или это можно сделать через удаленный интерфейс Chrome?