Vercel வரிசைப்படுத்தலில் 'Chrome ஐக் கண்டுபிடிக்க முடியவில்லை (ver. 130.0.6723.116)' Puppeteer Chrome பிழையைச் சரிசெய்தல்

தீர்வு 1: Vercel இல் Chrome ஐ சரியாக நிறுவ Puppeteer ஐ உள்ளமைத்தல்

இந்த Node.js-அடிப்படையிலான பின்தள தீர்வு, குரோம் சரியாக நிறுவப்படுவதை உறுதிசெய்ய Puppeteer இன் கேச் பாதை மற்றும் நிறுவல் கட்டளைகளை உள்ளமைக்கிறது.

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;

தீர்வு 2: .puppeteerrc.cjs கோப்புடன் வெர்சலுக்கான தனிப்பயன் பப்பீட்டீர் உள்ளமைவு

இந்த தீர்வு பப்பீட்டீரின் உள்ளமைவு கோப்பை (.puppeteerrc.cjs) சரிசெய்து Chrome கேச் பாதையைக் குறிப்பிடவும் மற்றும் 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'],
};

தீர்வு 3: Puppeteer க்காக pack.json இல் சுற்றுச்சூழல் மாறிகள் மற்றும் ஸ்கிரிப்ட்களை செயல்படுத்துதல்

இந்த அணுகுமுறை மாற்றியமைக்கிறது pack.json குறிப்பிட்ட Chrome பைனரிகளை நிறுவ கோப்பு மற்றும் வரிசைப்படுத்தலின் போது தானாகவே Puppeteer உள்ளமைவுகளை அமைக்கவும்.

// 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";

பப்பீட்டீர் ஸ்கிரீன்ஷாட் செயல்பாட்டிற்கான யூனிட் டெஸ்ட்

இந்த Node.js மோச்சா சோதனை ஸ்கிரிப்ட் பல்வேறு சூழல்களில் URL இலிருந்து ஒரு ஸ்கிரீன்ஷாட்டைப் படம்பிடிக்கும் Puppeteer இன் திறனைச் சரிபார்க்கிறது.

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

பொம்மலாட்டக்காரர் மற்றும் கிளவுட் வரிசைப்படுத்துதல் பற்றிய பொதுவான கேள்விகள்

1. கிளவுட் இயங்குதளங்களில் "Chrome ஐக் கண்டுபிடிக்க முடியவில்லை" என்ற பிழைகளை நான் ஏன் பெறுகிறேன்?
2. கிளவுட் இயங்குதளங்களில் இயல்பாகவே முழு Chrome பைனரியும் சேர்க்கப்படாததால் இந்தப் பிழைகள் அடிக்கடி நிகழ்கின்றன. குறிப்பிடுவதன் மூலம் இதை சரிசெய்யலாம் executablePath உங்கள் பொம்மலாட்டம் அமைப்பில்.
3. உள்ளூர் மற்றும் கிளவுட் சூழல்களில் Puppeteer செயல்படுவதை எவ்வாறு உறுதி செய்வது?
4. பயன்படுத்தி executablePath மற்றும் args போன்ற மேகங்களுக்கு ஏற்ற கொடிகளுடன் --no-sandbox உங்கள் அமைப்பை இரு சூழல்களுக்கும் போதுமான நெகிழ்வானதாக மாற்ற முடியும்.
5. என்ன செய்கிறது --no-sandbox பொம்மலாட்டத்தில் கொடி செய்யுமா?
6. தி --no-sandbox கொடி Chrome இன் சாண்ட்பாக்ஸ் பாதுகாப்பை முடக்குகிறது, இது சாண்ட்பாக்ஸிங்கை ஆதரிக்காத கிளவுட் சேவைகளில் பப்பீட்டீரை இயக்க அனுமதிக்கிறது, ஆனால் அதை எச்சரிக்கையுடன் பயன்படுத்த வேண்டும்.
7. எனக்கு ஏன் ஒரு வழக்கம் வேண்டும் cacheDirectory பொம்மலாட்டக்காரருக்கா?
8. ஒரு விருப்பத்தை அமைத்தல் cacheDirectory Puppeteer Chrome பைனரிகளை அறியப்பட்ட இடத்திற்குப் பதிவிறக்குவதை உறுதிசெய்கிறது, இது வரிசைப்படுத்தலின் போது பிழைகளைத் தடுக்கும், குறிப்பாக சேவையகமற்ற சூழல்களில்.
9. இதன் நோக்கம் என்ன networkidle2 இல் விருப்பம் goto முறை?
10. தி networkidle2 இரண்டுக்கும் மேற்பட்ட செயலில் உள்ள பிணைய இணைப்புகள் இல்லாத வரை விருப்பம் காத்திருக்கிறது. முழுமையாக ஏற்றப்பட்ட பக்கத்தைப் பிடிக்கவும், டைனமிக் உள்ளடக்கத்தைக் கையாளவும் இது பயனுள்ளதாக இருக்கும்.
11. குறிப்பிட்ட Chrome பதிப்பு இல்லாமல் Puppeteer வேலை செய்ய முடியுமா?
12. ஆம், ஆனால் குறிப்பிட பரிந்துரைக்கப்படுகிறது executablePath கிளவுட் அமைப்புகளில் நிலையான முடிவுகளுக்கு இணக்கமான Chrome பதிப்பை அணுக முடியும் என்பதை உறுதிப்படுத்தவும்.
13. வெவ்வேறு சூழல்களில் பப்பீட்டீர் தற்காலிக சேமிப்பை எவ்வாறு நிர்வகிப்பது?
14. நீங்கள் ஒரு உலகளாவிய குறிப்பிடலாம் cacheDirectory இல் .puppeteerrc.cjs கோப்பு, வெர்செல் மற்றும் ஹெரோகு போன்ற தளங்களில் குரோம் பைனரிகளைக் கண்டறிய பப்பீட்டீரை அனுமதிக்கிறது.
15. உள்ளது puppeteer-core வேறுபட்டது puppeteer?
16. ஆம், puppeteer-core அளவைக் குறைக்க, தொகுக்கப்பட்ட Chrome ஐ விலக்குகிறது, எனவே நீங்கள் Chrome பைனரியைக் குறிப்பிட வேண்டும். முழு puppeteer தொகுப்பில் தானாகவே Chrome அடங்கும்.
17. மேகக்கணி சூழலில் பப்படீயர் மெதுவாக இருந்தால் நான் என்ன செய்ய வேண்டும்?
18. உகந்ததாக்குதல் viewport அமைப்புகள் மற்றும் தேவையற்ற விருப்பங்களை முடக்குதல் போன்ற devtools வள-கட்டுப்படுத்தப்பட்ட சூழலில் செயல்திறனை மேம்படுத்த முடியும்.
19. அனைத்து கிளவுட் வழங்குநர்களுடனும் Puppeteer இணக்கமாக உள்ளதா?
20. பொதுவாக, ஆம், ஆனால் ஒவ்வொரு வழங்குநருக்கும் தனிப்பட்ட தேவைகள் இருக்கலாம். போன்ற கிளவுட் நட்பு அமைப்புகளைப் பயன்படுத்துதல் --no-sandbox சிறந்த பொருந்தக்கூடிய தன்மையை உறுதி செய்கிறது.

பொம்மலாட்டக்காரரை வெர்சலில் இயக்குவதற்கான இறுதி எண்ணங்கள்

Vercel இல் Puppeteer ஐ வெற்றிகரமாக பயன்படுத்த, Chrome க்கான குறிப்பிட்ட அமைவு தேவைகளைப் புரிந்து கொள்ள வேண்டும். குறிப்பிடுவது துவக்க விருப்பங்கள் மற்றும் Puppeteer இன் கேச் பாதைகளை சரியாக உள்ளமைப்பது ஏமாற்றமளிக்கும் "Chromeஐக் கண்டுபிடிக்க முடியவில்லை" பிழையைத் தடுக்க உதவுகிறது. இந்த மாற்றங்கள் உள்ளூர் மற்றும் கிளவுட் சூழல்களில் நம்பகத்தன்மையுடன் Puppeteer செயல்பாட்டை உறுதி செய்கின்றன. 🚀

இந்தத் தீர்வுகளை உங்கள் திட்டப்பணிக்கு ஏற்ப மாற்றியமைத்தவுடன், பயனர் வழங்கிய URL களில் இருந்து ஸ்கிரீன் ஷாட்களைப் படம்பிடிப்பது தடையற்றதாகி, அதிக ஆற்றல்மிக்க வலைப் பயன்பாடுகளை அனுமதிக்கிறது. சரியான அமைப்புடன், வெர்செல் போன்ற சர்வர்லெஸ் பிளாட்ஃபார்ம்களில் கூட, பப்படீர் ஆட்டோமேஷன் மற்றும் வெப் ஸ்கிராப்பிங்கிற்கான விலைமதிப்பற்ற கருவியாக உள்ளது.