在phantomjs中获取页面宽度很奇怪

以下是脚本代码：

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

page.paperSize = {
  format: 'A4', 
  orientation: "landscape"
};

page.open('http://www.google.com', function () {

  var arr = page.evaluate(function () {
     var pageWidth = document.body.clientWidth;
     var pageHeight = document.body.clientHeight;

     return [pageWidth, pageHeight];
  });

  console.log('pagwWidth: ' + arr[0] + '; pageHeight: ' + arr[1]);

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

我正在尝试获取document.body页面的clientWidth和clientHeight。执行此脚本时，我将获得以下值：

pagwWidth: 400; pageHeight: 484

为什么上面的宽度是400px？我想我应该更宽一些

---

谢谢你的回复。但是我不明白下面的事情。当我使用viewportSize={宽度：1024，高度：800}

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

page.paperSize = {
  format: 'A4', 
  orientation: "landscape"
};

page.viewportSize = {width: 1024, height: 800};
page.open('http://www.google.com', function () {

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

我得到以下文件：

但是如果我使用viewportSize={width:400，height:400}

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

page.paperSize = {
  format: 'A4', 
  orientation: "landscape"
};

page.viewportSize = {width: 400, height: 400};
page.open('http://www.google.com', function () {

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

我得到同样的结果：

---

因此，我不明白viewportSize对视图有何影响？

文档受视口大小而不是纸张大小的影响。按照这条思路思考，网页在web浏览器中的外观与当前的打印机设置无关

如果要影响页面布局，请使用

viewportSize

：

page.viewportSize = { width: 1024, height: 800 };

---

这现在是一个不同的问题。文档的“打印”（到PDF文件）强制使用不同的布局，即调整为纸张大小。如果仍然转储文档宽度和高度，则它们仍然与视口匹配。