chrome-aws-lambda + lighthouse 总是导致 NO_SCREENSHOTS

Question

我正在尝试使用chrome-aws-lambda在public.ecr.aws/lambda/nodejs Docker 图像中通过 Puppeteer 运行 Lighthouse，无论我向 Lighthouse 发送哪个网站，我总是会收到如下错误：

Chrome 在页面加载期间没有收集任何屏幕截图。 请确保页面上有内容可见，然后尝试重新运行 Lighthouse。 (NO_SCREENSHOTS)

请注意，我试过像这样向它发送加载速度非常快的页面，因此与此错误相关的其他在线提示声称网站速度太慢对我来说似乎并不正确。

/Dockerfile

FROM public.ecr.aws/lambda/nodejs:latest
RUN cd /var/task/ & npm install puppeteer-core chrome-aws-lambda lighthouse --save-prod
RUN cd /var/task/ & npm install puppeteer --save-dev

/docker-compose.yml

version: "3.5"

services:
  lighthouse:
    build:
      context: .
    networks:
      - lighthousenetwork
    ports:
      - "8080:8080"
    volumes:
      - ./task/:/var/task/:delegated
    command: index.handler

networks:
  lighthousenetwork:
    driver: bridge

/task/index.js

const chromium = require('chrome-aws-lambda');
const lighthouse = require('lighthouse');

exports.handler = async (event, context, callback) => {
    let response = null;
    let browser = null;

    try {
        browser = await chromium.puppeteer.launch({
            args: [...chromium.args, "--remote-debugging-port=9222"],
            defaultViewport: chromium.defaultViewport,
            executablePath: await chromium.executablePath,
            headless: chromium.headless,
            ignoreHTTPSErrors: true,
        });

        const options = {
            output: "json",
            preset: 'mobile',
            onlyCategories: ["performance", "seo", "accessibility", "best-practices"],
            port: 9222,
        }

        const url = 'https://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event';

        const result = await lighthouse(url, options);
        console.log(`Audited ${url} in ${result.lhr.timing.total} ms.`);

        const report = JSON.parse(result.report);

        response = {
            statusCode: 200,
            body: {
                'url': url,
                'Performance': report['categories']['performance']['score'],
                'Accessibility': report['categories']['accessibility']['score'],
                'SEO': report['categories']['seo']['score'],
                'BestPractices': report['categories']['best-practices']['score'],
                'ErrorMessage': report['audits']['speed-index']['errorMessage']
            }
        }
    } catch (error) {
        return callback(error);
    } finally {
        if (browser !== null) {
            await browser.close();
        }
    }

    return callback(null, response);
};

启动 Docker 容器：

$ docker-compose up

触发 function 处理程序：

$ curl -XPOST "http://localhost:8080/2015-03-31/functions/function/invocations" -d '{"payload":"hello world!"}'

Output：

{"statusCode":200,"body":{"url":"https://developer.mozilla.org/en-US/docs/Web/API/Window/DOMContentLoaded_event","Performance":null,"Accessibility":0.91,"SEO":0.89,"BestPractices":1,"ErrorMessage":"Chrome didn't collect any screenshots during the page load. Please make sure there is content visible on the page, and then try re-running Lighthouse. (NO_SCREENSHOTS)"}}

Answer 1

我遇到了完全相同的问题。 做了很多事情，比如将不同的标志传递给 chrome、lighthouse。 没有工作。

然后我发现了这个https://github.com/GoogleChrome/lighthouse/pull/10483/files#diff-b745a09f9adfeb967c49c66acad7fdcaR77

似乎灯塔团队并不真正推荐 lambda env。

我看到其他人遇到同样的问题： https://github.com/GoogleChrome/lighthouse/issues/12101 https://github.com/GoogleChrome/lighthouse/issues/13021

是的，我建议暂时离开 lambda。 尝试在集群或其他东西上运行灯塔。

不是真正解决您看到的错误的解决方案。 但只想分享我在这方面的发现。