node.js - 为什么 puppeteer 不能在 azure webapp 上运行

Question

我使用过 Nodejs 并尝试截取给定 URL 的屏幕截图。它在本地运行完美，但部署到 Azure 后在创建 puppeteer 时出现问题。

代码

exports.getScreenShot = async function (req, res) {
    const requesturl = req.param('url');
    if (!requesturl) {
        return res.send(400, 'Missing url');
    }
    const parsedUrl = url.parse(requesturl);
    if (!parsedUrl.protocol) {
        return res.send(400, 'Invalid url, missing protocol');
    }
    if (!parsedUrl.hostname) {
        return res.send(400, 'Invalid url, missing hostname');
    }

    const options = {
        'width': req.param('width'),
        'height': req.param('height'),
        'delay': req.param('delay'),
        'userAgent': req.param('userAgent'),
        'full': (req.param('full') === 'true')
    };

    options.width = options.width || 1024;
    options.height = options.height || 768;
    options.delay = options.delay || 200;    
    const browser = await puppeteer.connect({
        browserWSEndpoint: 'wss://chrome.browserless.io/'
    });

    let page = await browser.newPage();
    await page.goto(requesturl);
    await page.waitFor(parseInt(options.delay));
    let imageName = parsedUrl.hostname.replace(/\W/g, '_');
    let pathName = parsedUrl.pathname.replace(/\W/g, '_').replace(/_$/, '');
    if (pathName) {
        imageName += pathName;
    }
    imageName = `${imageName}.png`;
    var tempPath = temp.path({ suffix: '.png' });
    await page.setViewport({ width: parseInt(options.width), height: parseInt(options.height) });
    await page.screenshot({
        path: tempPath,
        fullPage: options.full
    });
}

Answer 1

请参阅 SO Tag Info for puppeteer，如下所示。

Puppeteer 是一个 Node 库，它提供了一个高级 API 来通过 DevTools 协议控制无头 Chrome或Chromium 。它还可以配置为使用完整的（非无头）Chrome 或 Chromium。

无论是无头或非无头的 Chrome 或 Chromium，它们都需要 GDI 支持。但是，在 Windows 上的 Azure App Services 上，它与 冲突Win32k.sys (User32/GDI32) Restrictions，如下图所示。

和其他类似的框架PhantomJS/Selenium也受到它的限制，见下文。

因此，您不能在 Windows 上的 Azure WebApp 中使用 puppeteer。解决方法是在 Linux 上使用 Azure VM 或 Azure WebApp。从本质上讲，此问题与您的其他 SO 线程Chrome 驱动程序无法在 azure web apps 上工作重复。

希望能帮助到你。

Answer 2

如何在 Azure 云服务或 Azure Functions 中运行 Headless Chrome

将 puppeteer.launch 替换为 puppeteer.connect

const browser = await puppeteer.connect({  browserWSEndpoint: 'wss://chrome.browserless.io/'

});