Как сделать часть страницы с помощью PhantomJS?

Ответ 1

Чтобы отображать только часть страницы, вам нужно установить атрибут clipRect для страницы, а затем визуализировать ее.

var clipRect = document.querySelector(selector).getBoundingClientRect();
page.clipRect = {
    top:    clipRect.top,
    left:   clipRect.left,
    width:  clipRect.width,
    height: clipRect.height
};
page.render('capture.png');

Я не понимаю вторую часть вашего вопроса. Phantom.js безголовый означает, что нет фактического отображения, на которое смотрит пользователь.

Ответ 2

Рабочий пример.

var page = require('webpage').create();

page.open('http://google.com', function() {
  // being the actual size of the headless browser
  page.viewportSize = { width: 1440, height: 900 };

  var clipRect = page.evaluate(function(){
    return document.querySelector('#hplogo').getBoundingClientRect();
  });

  page.clipRect = {
    top:    clipRect.top,
    left:   clipRect.left,
    width:  clipRect.width,
    height: clipRect.height
  };

  page.render('google.png');
  phantom.exit();
});

Ответ 3

Вы можете использовать CasperJS, другой проект, основанный на PhantomJS.

casper.start('http://www.weather.com/', function() {
    this.captureSelector('weather.png', '#wx-main');
});

casper.run();

Ответ 4

Решение ниже работает для меня.

    var clipRect = document.querySelector(selector).getBoundingClientRect();
     page.clipRect = {
              top:    clipRect.top,
              left:   clipRect.left,
              width:  clipRect.width,
              height: clipRect.height
      };
   page.render('capture.png');

Но я замечаю, что это работает только в том случае, если мы делаем изображение не pdf. Чтобы это сделать для pdf, попробуйте это

page.evaluate(function (element){
    $(element).appendTo('body');
    $('body > :not(' + element + ')').hide(); 
   }, element);       
  });

window.setTimeout(function(){
    page.render("page.pdf");
  },1000);

Эти ссылки могут помочь: Как скрыть все элементы, кроме одного с помощью jquery?

https://github.com/ariya/phantomjs/issues/10465

Ответ 5

У меня была такая же потребность, я пробовал это, и это работало отлично для меня:

не забывайте http://www в URL

var page = require('webpage').create();
page.open('YourPageURL', function (status) {

if (status !== 'success') {
    console.log('Network Problem');
} else {
    var p = page.evaluate(function () {
        return document.getElementById('yourDivID').innerHTML
    });
    console.log(p);
}
phantom.exit();
});