Repararea erorii „Nu s-a putut găsi Chrome (ver. 130.0.6723.116)” Puppeteer Chrome la implementarea Vercel

Soluția 1: Configurarea Puppeteer pentru a instala Chrome corect pe Vercel

Această soluție de backend bazată pe Node.js configurează calea cache-ului Puppeteer și comenzile de instalare pentru a se asigura că Chrome se instalează corect.

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;

Soluția 2: Configurație personalizată Puppeteer pentru Vercel cu un fișier .puppeteerrc.cjs

Această soluție ajustează fișierul de configurare al lui Puppeteer (.puppeteerrc.cjs) pentru a specifica calea cache-ului Chrome și pentru a asigura compatibilitatea cu structura fișierelor 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'],
};

Soluția 3: Implementarea variabilelor de mediu și a scripturilor în package.json pentru Puppeteer

Această abordare modifică pachet.json pentru a instala anumite fișiere binare Chrome și pentru a configura automat configurațiile Puppeteer în timpul implementării.

// 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 unitar pentru funcționalitatea capturii de ecran a păpușilor

Acest script de testare Node.js Mocha verifică capacitatea lui Puppeteer de a capta o captură de ecran dintr-o adresă URL în diferite medii.

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();
            });
    });
});

Întrebări frecvente despre implementările Puppeteer și Cloud

1. De ce primesc erori „Nu am putut găsi Chrome” pe platformele cloud?
2. Aceste erori apar adesea deoarece platformele cloud nu includ în mod implicit întregul binar Chrome. Puteți remedia acest lucru specificând executablePath în configurația dvs. Puppeteer.
3. Cum mă asigur că Puppeteer funcționează atât în ​​medii locale, cât și în cloud?
4. Folosind executablePath şi args cu steaguri prietenoase cu norii ca --no-sandbox vă poate face configurația suficient de flexibilă pentru ambele medii.
5. Ce înseamnă --no-sandbox steagul face în Puppeteer?
6. The --no-sandbox flag dezactivează securitatea sandbox-ului Chrome, care permite Puppeteer să ruleze pe servicii cloud care nu acceptă sandboxing, dar ar trebui să fie folosit cu prudență.
7. De ce am nevoie de un custom cacheDirectory pentru Marionetar?
8. Stabilirea unui personalizat cacheDirectory se asigură că Puppeteer descarcă fișiere binare Chrome într-o locație cunoscută, ceea ce poate preveni erorile în timpul implementării, în special în mediile fără server.
9. Care este scopul networkidle2 opțiunea în goto metodă?
10. The networkidle2 opțiunea așteaptă până când nu există mai mult de două conexiuni de rețea active. Acest lucru este util pentru a captura o pagină complet încărcată și pentru a gestiona conținut dinamic.
11. Poate Puppeteer să funcționeze fără o versiune Chrome specificată?
12. Da, dar este recomandat să specificați executablePath și asigurați-vă că o versiune Chrome compatibilă este accesibilă pentru rezultate consistente în setările cloud.
13. Cum gestionez memoria cache Puppeteer în diferite medii?
14. Puteți specifica un universal cacheDirectory în .puppeteerrc.cjs fișier, permițând Puppeteer să găsească fișiere binare Chrome pe platforme precum Vercel și Heroku.
15. este puppeteer-core diferit de puppeteer?
16. Da, puppeteer-core exclude Chrome grupat pentru a reduce dimensiunea, așa că va trebui să specificați un binar Chrome. Plin puppeteer pachetul include Chrome automat.
17. Ce ar trebui să fac dacă Puppeteer este lent în mediile cloud?
18. Optimizarea viewport setări și dezactivarea opțiunilor inutile, cum ar fi devtools poate îmbunătăți performanța în medii cu resurse limitate.
19. Este Puppeteer compatibil cu toți furnizorii de cloud?
20. În general, da, dar fiecare furnizor poate avea cerințe unice. Utilizarea setărilor pentru cloud cum ar fi --no-sandbox asigură o mai bună compatibilitate.

Gânduri finale despre a-l face pe Puppeteer să alerge pe Vercel

Implementarea cu succes a Puppeteer pe Vercel necesită înțelegerea nevoilor specifice de configurare pentru Chrome. Precizând opțiuni de lansare și configurarea corectă a căilor de cache ale lui Puppeteer ajută la prevenirea frustrantă eroare „Nu s-a putut găsi Chrome”. Aceste ajustări asigură că Puppeteer funcționează în mod fiabil atât în ​​medii locale, cât și în cloud. 🚀

Odată ce adaptați aceste soluții la proiectul dvs., capturarea de capturi de ecran de la adresele URL furnizate de utilizator devine fără probleme, permițând aplicații web mai dinamice. Cu o configurare adecvată, Puppeteer rămâne un instrument de neprețuit pentru automatizare și web scraping, chiar și pe platforme fără server precum Vercel.