如何使用 puppeteer 最大化浏览器窗口？答案

【问题标题】：How to maximize browser window using puppeteer?如何使用 puppeteer 最大化浏览器窗口？
【发布时间】：2019-10-25 20:21:31
【问题描述】：

我正在尝试使用puppeteer 最大化浏览器窗口。我尝试了下面的代码，但浏览器没有最大化到完整模式。我也没有在 puppeteer 库中找到任何可用的函数来最大化窗口。

(async () => {
  const browser = await puppeteer.launch({headless: false , slowMo: 100, rgs: ['--start-fullscreen', '--window-size=1920,1080'], executablePath: 'C:/Program Files (x86)/Google/Chrome/Application/chrome.exe' });
  const page = await browser.newPage();

  await page.setViewport({ width: 1920, height: 1080 });

【问题讨论】：

标签： node.js puppeteer

【解决方案1】：

args: ['--start-maximized'] 是在最大化窗口中打开 chrome 的正确方法

【讨论】：

【解决方案2】：

我也遇到过这个问题

我的解决方法：先关闭或最小化之前打开的chrome窗口

【讨论】：

【解决方案3】：

这对我来说很好。

await puppeteer.launch({ 
      headless: false,
      defaultViewport: null,
      args: ['--start-maximized'] 
});

【讨论】：

【解决方案4】：

await page.goto("https://www.google.com")
  await page.setViewport({
  width: 1920,
  height: 1080 ,
  deviceScaleFactor: 1,
});

你错过了 deviceScaleFactor https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio

【讨论】：

【解决方案5】：

当心--start-maximized 标志doesn't work in a headless mode。然后你必须设置窗口大小，例如像这样：--window-size=1920,1040.

您可以这样做的方式是在配置中定义这两个选项：

config.json：

{
    "browserOptions": {
        "headless": {
            "headless": true,
            "args": [                
                "--window-size=1920,1040"        
            ],
            "defaultViewport": null
        },
        "gui": {
            "headless": false,
            "args": [                
                "--start-maximized"           
            ],
            "defaultViewport": null
        }
    }
}

然后你根据环境变量选择使用哪一个——你可以为此实现一个小模块：

Helpers/browserOption.js：

require('dotenv').config();
const config = require('../config.json');

module.exports = {
    browserConfig: () => {
        if (process.env.BROWSER === "headless") {
            return config.browserOptions.headless;
        }

        return config.browserOptions.gui;
    }
};

那么如果你将环境变量BROWSER 设置为headless，具体的窗口大小将在浏览器启动时设置，如果你选择在非无头模式下运行脚本，--start-maximized arg 将被使用.

在脚本中，可以这样使用：

const browserOption = require('./Helpers/browserOption');
const browser - await puppeteer.launch(browserOption.browserConfig());

【讨论】：

【解决方案6】：

在我的情况下帮助defaultViewport: null

【讨论】：

【解决方案7】：

我希望我在您的代码中看到的错字是在这篇文章中出现的。

Chrome 参数作为键 args 的值传递给 puppeteer.launch 函数，而不是 rgs。

另外，在您的 Chrome 配置中，我怀疑标志 --start-fullscreen 和 --window-size 是矛盾的。

最后，您可能对 Chrome 标志 --start-maximized 感兴趣。

有关 Chrome 标志的完整列表，请参阅 Peter Beverloo 的这篇文章。

【讨论】：