puppeteer 设置“isMobile:true”导致“UnhandledPromiseRejectionWarning”答案

【问题标题】：puppeteer set "isMobile:true" to cause "UnhandledPromiseRejectionWarning"puppeteer 设置“isMobile:true”导致“UnhandledPromiseRejectionWarning”
【发布时间】：2019-08-05 18:40:06
【问题描述】：

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch({
    devtools: true,
    ignoreHTTPSErrors: true
  });

  const page = await browser.newPage();
  page.setUserAgent('Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1');
  page.setViewport({
    width: 375,
    height: 667,
    isMobile: true
  });
  await page.goto('https://google.com', {
    waitUntil: 'networkidle2'
  });

  await page.evaluate(() => {
    console.log(window);
  })
})();

当我在setViewport()中设置isMobile:true时，chromium正常打开，但是进程报如下错误：

(node:13360) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: net::ERR_ABORTED at https://google.com
(node:13360) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

如何处理？

【问题讨论】：

标签： node.js chromium puppeteer

【解决方案1】：

您刚刚错过了setUserAgent 方法和setViewport 方法的await。

(async () => {
 const browser = await puppeteer.launch({
   devtools: true,
   ignoreHTTPSErrors: true
 });

 const page = await browser.newPage();
 await page.setUserAgent('Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1');
 await page.setViewport({
   width: 375,
   height: 667,
   isMobile: true
 });
 await page.goto('https://google.com', {
   waitUntil: 'networkidle2'
 });

 await page.evaluate(() => {
   console.log(window);
 })
})();

另外，您可以将这些方法替换为emulate 方法。

emulate 方法是调用两个方法的快捷方式：

page.setUserAgent(userAgent)
page.setViewport(视口)

不要忘记从 puppeteer 导入设备对象。查看devices的完整列表。

const devices = require('puppeteer/DeviceDescriptors');

await page.emulate(devices['iPhone 6'])

所以，你的最终脚本应该是：

const puppeteer = require('puppeteer');
const devices = require('puppeteer/DeviceDescriptors');


(async () => {
 const browser = await puppeteer.launch({
   devtools: true,
   ignoreHTTPSErrors: true
 });

 const page = await browser.newPage();
 await page.emulate(devices['iPhone 6'])
 await page.goto('https://google.com', {
   waitUntil: 'networkidle2'
 });

 await page.evaluate(() => {
   console.log(window);
 })
})();

【讨论】：

太棒了！顺便说一句，如果你有时间，请帮我看看这个issue_57368020！
嗨@pigjane。当然，刚刚回答。

【解决方案2】：

您正在使用异步等待，并且您的代码中有一些错误，并且没有相同的处理程序，所以每当我们使用异步等待时，我们应该将代码包围在一个 try catch 块中，这是一个好习惯以 try 开始函数并以 catch 结束函数，因此每当发生错误时，它都会进入 catch 块。

(async () => {
    try {
        const browser = await puppeteer.launch({
        devtools: true,
        ignoreHTTPSErrors: true
        });

        const page = await browser.newPage();
        page.setUserAgent('Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1');
        page.setViewport({
        width: 375,
        height: 667,
        isMobile: true
        });
        await page.goto('https://google.com', {
        waitUntil: 'networkidle2'
        });

        await page.evaluate(() => {
        console.log(window);
        })
    } catch(error) {
        console.log("handle the error here", error)
    }
})();

【讨论】：