1

我正在尝试使用 puppeteer 导航到页面,等待 webapp 达到特定状态,截屏并退出。当 SPA 处于我想要截屏的状态时,它会调用一个函数。我很难理解异步 js 代码。

我的代码如下所示:

const puppeteer = require('puppeteer');

const url = 'http://example.com/';
const width = 300;
const height = 250;
const path = '/vagrant/tmp/screenshot.jpg';

async function takeScreenshoot(url, width, height, path) {
    "use strict";

    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    await page.setViewport({width: width, height: height});

    await page.exposeFunction('interestingFunction', (async data => {
        console.log('Interesting function has been called. Taking a screenshot now.');
        await page.screenshot({path: path});
        await browser.close();
    }));

    await page.goto(url);
}

(async () => {
    "use strict";
    await takeScreenshoot(url, width, height, path);
})();

但是当我打电话时screenshot.js,我收到有关未处理承诺的警告,说“会话已关闭。很可能页面已关闭。”

node --trace-warnings screenshot.js

Interesting function has been called. Taking a screenshot now.
(node:2572) Error: Protocol error (Runtime.evaluate): Session closed. Most likely the page has been closed.
    at Session.send (/vagrant/node_modules/puppeteer/lib/Connection.js:167:29)
    at Page._onConsoleAPI (/vagrant/node_modules/puppeteer/lib/Page.js:296:20)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)
(node:2572) [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.
    at emitWarning (internal/process/promises.js:78:15)
    at emitPendingUnhandledRejections (internal/process/promises.js:95:11)
    at process._tickCallback (internal/process/next_tick.js:189:7)

如果我await browser.close()从第 18 行删除,没有警告,但脚本永远不会完成。

现在,它interstingFunction()做了更多的事情,但是将它暴露在 webapp 的窗口中是安全的。我只是试图举一个上面仍然失败的最小脚本的例子。

我正在使用节点 v8.5.0。

我接近这个错误吗?

4

1 回答 1

0

我假设该函数有一些调用者,您不需要自己使用评估来调用它。

Imo,browser.close 应该移到最后并转到公开功能之前。根据文档中的内容,exposeFunction 如果返回一个承诺,它将被等待。最后 async / await 是承诺的糖

await page.exposeFunction('interestingFunction', (async data => {
    console.log('Interesting function has been called. Taking a screenshot now.');
    await page.screenshot({path: path});
    await browser.close();
}));

await page.goto(url);

这就是我的整个例子

const url = 'http://example.com/';
const width = 300;
const height = 250;
const path = './screenshot.jpg';

async function takeScreenshoot(url, width, height, path) {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();

    await page.goto(url, {waitUntil: 'load'});

    await page.exposeFunction('jjj', (async () => {
        console.log('Interesting function has been called. Taking a screenshot now.');
        return await page.screenshot({path: path});
    }));

    await page.evaluate(async () => {
      const myHash = await window.jjj();
    });

    await browser.close();
  }

(async () => {
    await takeScreenshoot(url, width, height, path);
})();
于 2017-09-23T07:44:09.963 回答