Phantomjs 加载的页面不同于 chrome

Question

我正在尝试从以下 link 下载 html：

http://matchhistory.na.leagueoflegends.com/en/#match-details/TRLH3/1000430019?gameHash=a5e39c76a8e91ba9&tab=stats

当我在 chrome 中打开时，它会将包含我要下载的所有数据的匹配项加载到 html 中。我想在 phantomjs 中打开这些页面，但它们加载的内容不一样？我正在使用以下代码截取 phantomjs 加载的内容。这只是主要的比赛历史页面：http://matchhistory.na.leagueoflegends.com/en

var page = require('webpage').create();
var url="http://matchhistory.na.leagueoflegends.com/en/#match-details/TRLH3/1000430019?gameHash=a5e39c76a8e91ba9&tab=stats";
console.log('The default user agent is ' + page.settings.userAgent);
page.settings.userAgent = 'SpecialAgent';

page.open(url, function(status) {

  if (status !== 'success') {
     console.log('Unable to access network');
  }

 setTimeout(function (){page.render('mh.png');},1000);
 setTimeout(function (){phantom.exit();},1200);
  });

我不确定为什么他们呈现两种不同的东西。我怎样才能让 pahntomjs 渲染同样的东西？

提前致谢

Answer 1

您的 http link 可能被重定向到 https。我的猜测是 phantom.js 没有保留片段标识符（#match-details）或重定向后的任何内容，这就是为什么你得到主页 http://matchhistory.na.leagueoflegends.com/en

要解决您的问题，请将 link 与 https 结合使用，这会起作用，因为您不会被重定向。

var url="https://matchhistory.na.leagueoflegends.com/en/#match-details/TRLH3/1000430019?gameHash=a5e39c76a8e91ba9&tab=stats";

Answer 2

正如@andrew-lohr 所指出的，这是因为 PhantomJS 在处理重定向时丢弃了片段。已提出问题 (https://github.com/ariya/phantomjs/issues/12192) and pull request created to fix (https://github.com/ariya/phantomjs/pull/14941) but these haven't made their way into release as PhantomJS has suspended development (https://github.com/ariya/phantomjs/issues/15344)。

另一种方法是使用 Puppeteer (https://github.com/GoogleChrome/puppeteer)，它有一个关于如何捕获屏幕截图的用法示例。

对于您的情况，这可能就像安装 Puppeteer 一样简单：

npm install puppeteer

然后将您的代码更新为：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('http://matchhistory.na.leagueoflegends.com/en/#match-details/TRLH3/1000430019?gameHash=a5e39c76a8e91ba9&tab=stats');
  await page.screenshot({path: 'mh.png'});
  await browser.close();
})();

和运行代码通过 node 而不是 phantomjs:

node <filename>.js

Puppeteer 站点提供了有关可配置内容（查看端口等）的更多信息。

Phantomjs 加载的页面不同于 chrome

Phantomjs loads different page than chrome

javascript

screen-scraping

phantomjs