Oprava chyby „Could Not Find Chrome (ver. 130.0.6723.116)“ Puppeteer Chrome Error pri nasadení Vercel

Riešenie 1: Konfigurácia Puppeteer na správnu inštaláciu prehliadača Chrome na Vercel

Toto backendové riešenie založené na Node.js konfiguruje cestu vyrovnávacej pamäte a inštalačné príkazy Puppeteer, aby sa zabezpečilo, že sa Chrome nainštaluje správne.

const puppeteer = require('puppeteer');
const path = require('path');
const { v4: uuid } = require('uuid');
const fs = require('fs');

// Main screenshot function
const screenshot = async (req, res) => {
    const url = req.query.url;
    if (!url) {
        return res.status(400).json({ message: 'URL is required' });
    }

    let browser;
    try {
        // Launch Puppeteer with specific Chrome executable path and options
        browser = await puppeteer.launch({
            ignoreHTTPSErrors: true,
            executablePath: process.env.CHROME_PATH || '/opt/bin/chromium',
            args: ['--no-sandbox', '--disable-setuid-sandbox']
        });

        const page = await browser.newPage();
        await page.goto(url, { waitUntil: 'networkidle2' });
        await page.setViewport({ width: 1920, height: 1080 });

        const fileName = \`${uuid()}.png\`;
        const screenshotPath = path.join(__dirname, '..', 'public', fileName);
        await page.screenshot({ path: screenshotPath });

        res.json({ screenshotPath: \`/image/\${fileName}\` });
    } catch (err) {
        console.error('Error capturing screenshot:', err);
        res.status(500).json({ error: 'Failed to capture screenshot' });
    } finally {
        if (browser) await browser.close();
    }
};

module.exports = screenshot;

Riešenie 2: Vlastná konfigurácia bábkara pre Vercel so súborom .puppeteerrc.cjs

Toto riešenie upravuje konfiguračný súbor Puppeteer (.puppeteerrc.cjs) tak, aby špecifikoval cestu vyrovnávacej pamäte prehliadača Chrome a zabezpečil kompatibilitu so štruktúrou súborov Vercel.

const { join } = require('path');

/
 * @type {import('puppeteer').Configuration}
 */
module.exports = {
    // Specify cache directory for Puppeteer
    cacheDirectory: join(__dirname, '.cache', 'puppeteer'),
    // Specify which Chromium version Puppeteer should install
    executablePath: '/opt/bin/chromium',
    args: ['--no-sandbox', '--disable-setuid-sandbox'],
};

Riešenie 3: Implementácia premenných prostredia a skriptov v súbore package.json pre Puppeteer

Tento prístup upravuje package.json na inštaláciu konkrétnych binárnych súborov prehliadača Chrome a automatické nastavenie konfigurácií bábkara počas nasadenia.

// Add to package.json
"scripts": {
    "postinstall": "npx puppeteer install --path ./.cache/puppeteer",
    "start": "node index.js"
}

// Configure environment variable in Vercel
process.env.CHROME_PATH = "/opt/bin/chromium";

Test jednotky pre funkčnosť snímky obrazovky bábkara

Tento testovací skript Node.js Mocha overuje schopnosť Puppeteeru zachytiť snímku obrazovky z adresy URL v rôznych prostrediach.

const chai = require('chai');
const chaiHttp = require('chai-http');
const app = require('../app'); // Express app where screenshot endpoint is defined

chai.use(chaiHttp);
const expect = chai.expect;

describe('Screenshot API', () => {
    it('should return an error for missing URL parameter', (done) => {
        chai.request(app)
            .get('/screenshot')
            .end((err, res) => {
                expect(res).to.have.status(400);
                expect(res.body).to.have.property('message').eql('URL is required');
                done();
            });
    });

    it('should capture a screenshot successfully for a valid URL', (done) => {
        chai.request(app)
            .get('/screenshot?url=https://example.com')
            .end((err, res) => {
                expect(res).to.have.status(200);
                expect(res.body).to.have.property('screenshotPath');
                done();
            });
    });
});

Bežné otázky o nasadení bábkara a cloudu

1. Prečo sa mi na cloudových platformách zobrazujú chyby „Chrome sa nepodarilo nájsť“?
2. Tieto chyby sa často vyskytujú, pretože cloudové platformy predvolene neobsahujú celý binárny súbor Chrome. Môžete to opraviť zadaním executablePath v nastavení Bábkara.
3. Ako zabezpečím, aby Puppeteer fungoval v lokálnom aj cloudovom prostredí?
4. Používanie executablePath a args s vlajkami vhodnými pre cloud, napr --no-sandbox môže urobiť vaše nastavenie dostatočne flexibilné pre obe prostredia.
5. Čo robí --no-sandbox vlajka robiť v Bábkar?
6. The --no-sandbox flag deaktivuje zabezpečenie karantény prehliadača Chrome, čo umožňuje Puppeteer bežať v cloudových službách, ktoré nepodporujú karanténu, ale mali by ste ho používať opatrne.
7. Prečo potrebujem zvyk cacheDirectory pre bábkara?
8. Nastavenie vlastného cacheDirectory zaisťuje, že Puppeteer stiahne binárne súbory prehliadača Chrome na známe miesto, čo môže zabrániť chybám počas nasadenia, najmä v prostrediach bez serverov.
9. Aký je účel networkidle2 možnosť v goto metóda?
10. The networkidle2 možnosť čaká, kým nebudú aktívne viac ako dve sieťové pripojenia. Je to užitočné na zachytenie úplne načítanej stránky a spracovanie dynamického obsahu.
11. Môže Puppeteer fungovať bez špecifikovanej verzie prehliadača Chrome?
12. Áno, ale odporúča sa špecifikovať executablePath a zaistite, aby bola dostupná kompatibilná verzia prehliadača Chrome pre konzistentné výsledky v nastaveniach cloudu.
13. Ako spravujem vyrovnávaciu pamäť Puppeteer v rôznych prostrediach?
14. Môžete určiť univerzálne cacheDirectory v .puppeteerrc.cjs čo umožňuje Puppeteer nájsť binárne súbory prehliadača Chrome na platformách ako Vercel a Heroku.
15. Je puppeteer-core odlišný od puppeteer?
16. áno, puppeteer-core nezahŕňa pribalený prehliadač Chrome, aby sa zmenšila veľkosť, takže budete musieť zadať binárny súbor prehliadača Chrome. Plný puppeteer balík automaticky obsahuje Chrome.
17. Čo mám robiť, ak je Puppeteer v cloudových prostrediach pomalý?
18. Optimalizácia viewport nastavenia a zakázanie nepotrebných možností, ako napr devtools môže zlepšiť výkon v prostrediach s obmedzenými zdrojmi.
19. Je Puppeteer kompatibilný so všetkými poskytovateľmi cloudu?
20. Vo všeobecnosti áno, ale každý poskytovateľ môže mať jedinečné požiadavky. Používanie nastavení vhodných pre cloud, napr --no-sandbox zabezpečuje lepšiu kompatibilitu.

Záverečné myšlienky o tom, ako spustiť bábkara na Vercelovi

Úspešné nasadenie Puppeteer na Vercel vyžaduje pochopenie špecifických potrieb nastavenia prehliadača Chrome. Špecifikovanie možnosti spustenia a správne nakonfigurovanie ciest vyrovnávacej pamäte Puppeteer pomáha predchádzať frustrujúcej chybe „Could not find Chrome“. Tieto úpravy zabezpečujú, že Puppeteer funguje spoľahlivo v lokálnom aj cloudovom prostredí. 🚀

Keď tieto riešenia prispôsobíte svojmu projektu, snímanie snímok obrazovky z adries URL poskytnutých používateľom bude bezproblémové, čo umožní dynamickejšie webové aplikácie. Pri správnom nastavení zostáva Puppeteer neoceniteľným nástrojom na automatizáciu a zoškrabovanie webu, a to aj na platformách bez serverov, ako je Vercel.