Giới thiệu

Có lẽ không ai trong chúng ta không biết đến Puppeteer. Đây là một công cụ tự động hóa trình duyệt mạnh mẽ, cho phép mô phỏng hành vi của con người trên các trang web để thực hiện nhiều yêu cầu phức tạp khác nhau. Các tác vụ thường thấy của Puppeteer bao gồm: chụp ảnh màn hình trang web, tạo PDF, kiểm tra tự động, thu thập dữ liệu web và theo dõi sự thay đổi nội dung trên web.

Trong nhiều trường hợp, chúng ta cần chạy Puppeteer trực tuyến. Ví dụ:

Trong chuỗi CI/CD, gọi một Puppeteer trực tuyến để thực hiện các bài kiểm tra tự động.
Sử dụng cron để kiểm tra định kỳ khả năng truy cập của trang web.
Chạy các trình thu thập web quy mô lớn và phân tán.

Bởi vì các tác vụ Puppeteer thường ngắn hạn và không được kích hoạt liên tục, việc lưu trữ trên một máy chủ đầy đủ (như DigitalOcean) không phải là một lựa chọn hợp lý về mặt chi phí, vì máy chủ sẽ được tính phí mọi lúc, bất kể Puppeteer có đang chạy hay không.

Giải pháp lý tưởng là triển khai Puppeteer bằng mô hình serverless. Các dịch vụ serverless tính phí dựa trên số lần gọi thực tế, do đó thường rẻ hơn trong nhiều tình huống.

Hiện tại, chỉ có một vài nền tảng hỗ trợ chạy Puppeteer theo cách serverless: Leapcell, AWS Lambda và Cloudflare Browser Rendering.

Bài viết này sẽ khám phá các nền tảng này: cách sử dụng chúng để hoàn thành một tác vụ Puppeteer điển hình, cùng với ưu và nhược điểm của từng nền tảng.

Tác vụ

Chúng ta sẽ sử dụng một trường hợp sử dụng Puppeteer phổ biến làm ví dụ: chụp ảnh màn hình của một trang web.

Tác vụ bao gồm các bước sau:

Truy cập vào một URL chỉ định
Chụp ảnh màn hình của trang
Trả về hình ảnh

Leapcell

Ví dụ mã:

javascript Copy

const puppeteer = require('puppeteer');
const { Hono } = require('hono');
const { serve } = require('@hono/node-server');

const screenshot = async (url) => {
  const browser = await puppeteer.launch({ args: ['--single-process', '--no-sandbox'] });
  const page = await browser.newPage();
  await page.goto(url);
  const img = await page.screenshot();
  await browser.close();

  return img;
};

const app = new Hono();

app.get('/', async (c) => {
  const url = c.req.query('url');

  if (url) {
    const img = await screenshot(url);
    return c.body(img, { headers: { 'Content-Type': 'image/png' } });
  } else {
    return c.text('Vui lòng thêm tham số ?url=https://example.com/');
  }
});

const port = 8080;
serve({ fetch: app.fetch, port }).on('listening', () => {
  console.log(`Máy chủ đang chạy trên cổng ${port}`);
});

Leapcell hỗ trợ triển khai trong nhiều ngôn ngữ, vì vậy yêu cầu này rất dễ dàng thực hiện.

Phát triển và gỡ lỗi cục bộ

Việc gỡ lỗi cục bộ rất đơn giản. Chỉ cần như bất kỳ ứng dụng Node.js nào khác: node index.js, và bạn đã hoàn tất!

Triển khai

Việc triển khai yêu cầu xác định lệnh xây dựng, lệnh chạy và cổng dịch vụ (như đã hiển thị trong ảnh chụp màn hình dưới đây).

Các tham số và quy trình triển khai cụ thể được chi tiết trong tài liệu chính thức.

Khi được triển khai, ứng dụng của bạn sẽ có sẵn trực tuyến.

Tóm tắt

✅ Ưu điểm:

Môi trường cục bộ và đám mây nhất quán, giúp việc gỡ lỗi dễ dàng hơn.
Hỗ trợ thư viện Puppeteer chính thức.

❌ Nhược điểm:

Cài đặt có phần phức tạp hơn: bạn phải viết trình xử lý HTTP của riêng mình.

AWS Lambda

Ví dụ mã:

javascript Copy

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

exports.handler = async (event) => {
  let browser = null;

  try {
    browser = await chromium.puppeteer.launch({
      args: chromium.args,
      defaultViewport: chromium.defaultViewport,
      executablePath: await chromium.executablePath,
      headless: chromium.headless,
    });

    const page = await browser.newPage();
    await page.goto(event.url);

    const screenshot = await page.screenshot();

    return {
      statusCode: 200,
      headers: { 'Content-Type': 'image/jpeg' },
      body: screenshot.toString('base64'),
      isBase64Encoded: true,
    };
  } catch (error) {
    return {
      statusCode: 500,
      body: 'Không thể chụp ảnh màn hình.',
    };
  } finally {
    if (browser !== null) {
      await browser.close();
    }
  }
};

AWS Lambda yêu cầu sử dụng puppeteer-core cùng với một thư viện Chromium bên thứ ba, chẳng hạn như alixaxel/chrome-aws-lambda.

Điều này là do AWS áp đặt giới hạn 250MB về kích thước của các hàm Lambda. Chromium được gói kèm với Puppeteer có thể dễ dàng vượt qua giới hạn này (khoảng 170MB trên macOS, 282MB trên Linux, và 280MB trên Windows), vì vậy một phiên bản Chromium nhẹ hơn phải được sử dụng.

Phát triển và gỡ lỗi cục bộ

Việc gỡ lỗi cục bộ yêu cầu cấu hình phức tạp do sự khác biệt trong môi trường chạy, như bạn có thể thấy trong tài liệu cho alixaxel/chrome-aws-lambda.

Triển khai

Để triển khai, bạn cần tải lên node_modules của mình dưới dạng tệp ZIP. Tùy thuộc vào trường hợp sử dụng của bạn, bạn cũng có thể cần cấu hình Lambda Layers. Logic chính có thể được viết trực tiếp trong bảng điều khiển AWS và có thể được thực thi sau khi lưu.

Tóm tắt

✅ Ưu điểm:

Mã cài đặt tương đối đơn giản.

❌ Nhược điểm:

Phụ thuộc vào thư viện Chromium bên thứ ba, có thể gây ra rủi ro tiềm tàng.
Gỡ lỗi cục bộ phức tạp.
Quy trình triển khai rườm rà, yêu cầu đóng gói và tải lên tệp ZIP, và có thể cần Lambda Layers.

Cloudflare Browser Rendering

Ví dụ mã:

javascript Copy

import puppeteer from '@cloudflare/puppeteer';

export default {
  async fetch(request, env) {
    const { searchParams } = new URL(request.url);
    let url = searchParams.get('url');
    if (url) {
      url = new URL(url).toString(); // chuẩn hóa

      const browser = await puppeteer.launch(env.MYBROWSER);
      const page = await browser.newPage();
      await page.goto(url);
      const img = await page.screenshot();
      await browser.close();

      return new Response(img, {
        headers: {
          'content-type': 'image/png',
        },
      });
    } else {
      return new Response('Vui lòng thêm tham số ?url=https://example.com/');
    }
  },
};

Cloudflare Browser Rendering là một giải pháp Puppeteer serverless tương đối mới. Tương tự như AWS Lambda, nó không hỗ trợ thư viện Puppeteer chính thức. Thay vào đó, nó sử dụng một phiên bản Puppeteer do Cloudflare cung cấp.

Mặc dù thư viện của Cloudflare an toàn hơn bất kỳ tùy chọn bên thứ ba nào, chu kỳ cập nhật chậm của nó có thể gây thất vọng - ví dụ, có lần nó đã không được cập nhật trong hơn năm tháng!

Ngoài ra, Cloudflare Browser Rendering có một số hạn chế:

Chỉ dành cho người dùng Worker Pro.
Mỗi tài khoản Cloudflare có thể tạo tối đa 2 trình duyệt mỗi phút, không có nhiều hơn 2 trình duyệt chạy đồng thời.

Phát triển và gỡ lỗi cục bộ

Gỡ lỗi cục bộ yêu cầu cấu hình phức tạp.

Triển khai

Để triển khai, chỉ cần viết hàm trực tuyến, lưu và chạy.

Tóm tắt

✅ Ưu điểm:

Mã cài đặt tương đối đơn giản.

❌ Nhược điểm:

Phụ thuộc vào thư viện Puppeteer của Cloudflare, có chu kỳ cập nhật không ổn định.
Gỡ lỗi cục bộ phức tạp.
Có rào cản thanh toán và các hạn chế khác, ngăn cản việc sử dụng linh hoạt.

Kết luận

Bài viết này đã so sánh ba nền tảng serverless chính để triển khai Puppeteer: Leapcell, AWS Lambda và Cloudflare Browser Rendering. Mỗi nền tảng đều có những ưu điểm và nhược điểm riêng.

Tuy nhiên, nếu bạn dự định triển khai dự án Puppeteer của mình trực tuyến, Leapcell là một lựa chọn xuất sắc.

Theo dõi chúng tôi trên X: @LeapcellHQ

Đọc thêm trên blog của chúng tôi

Bài viết liên quan:

Cách lưu trữ dự án Golang miễn phí (Ví dụ Gin)
Cách lưu trữ dự án Rust trên đám mây miễn phí
Lựa chọn tốt nhất cho Vercel để lưu trữ dự án Next.js

So sánh cách chạy Puppeteer trực tuyến hiệu quả nhất

Giới thiệu

Tác vụ

Leapcell

Ví dụ mã:

Phát triển và gỡ lỗi cục bộ

Triển khai

Tóm tắt

AWS Lambda

Ví dụ mã:

Phát triển và gỡ lỗi cục bộ

Triển khai

Tóm tắt

Cloudflare Browser Rendering

Ví dụ mã:

Phát triển và gỡ lỗi cục bộ

Triển khai

Tóm tắt

Kết luận

Bình luận