mcpField
P
puppeteer

puppeteer

github.com/aidotnet开发85125 次安装39 周前更新
代码仓库

关于 puppeteer

使用 Puppeteer 自动化 Chrome 或 Chromium 的技能，适用于生成 PDF、截取屏幕、抓取网页和自动填写表单等浏览器任务。

主要功能

  1. 01无头浏览器自动化
  2. 02将 HTML 生成为 PDF
  3. 03截取网页屏幕
  4. 04抓取网页数据
  5. 05自动填写表单

适用场景

  1. 01将 HTML 内容生成 PDF
  2. 02截取网站画面
  3. 03提取商品页面数据
  4. 04填写并提交网页表单

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/aidotnet/moyucode --skill puppeteer

安装后在 Claude Code 中输入/puppeteer确认已加载。

详细介绍

Puppeteer 工具

描述

用于生成 PDF、截屏、网页抓取和测试的无头 Chrome/Chromium 自动化工具。

来源

安装

npm install puppeteer

使用示例

从 HTML 生成 PDF
import puppeteer from 'puppeteer';

async function generatePDF(html: string, outputPath: string) {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  
  await page.setContent(html, { waitUntil: 'networkidle0' });
  
  await page.pdf({
    path: outputPath,
    format: 'A4',
    margin: { top: '20mm', right: '20mm', bottom: '20mm', left: '20mm' },
    printBackground: true,
  });
  
  await browser.close();
}

// Usage
const html = `
  <html>
    <head><style>body { font-family: Arial; }</style></head>
    <body><h1>Invoice #001</h1><p>Total: $100.00</p></body>
  </html>
`;
await generatePDF(html, 'invoice.pdf');
截屏
async function takeScreenshot(url: string, outputPath: string) {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  
  await page.setViewport({ width: 1920, height: 1080 });
  await page.goto(url, { waitUntil: 'networkidle2' });
  
  await page.screenshot({
    path: outputPath,
    fullPage: true,
    type: 'png',
  });
  
  await browser.close();
}
网页抓取
async function scrapeData(url: string) {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  
  await page.goto(url, { waitUntil: 'domcontentloaded' });
  
  const data = await page.evaluate(() => {
    const items = document.querySelectorAll('.product');
    return Array.from(items).map(item => ({
      title: item.querySelector('h2')?.textContent?.trim(),
      price: item.querySelector('.price')?.textContent?.trim(),
    }));
  });
  
  await browser.close();
  return data;
}
表单自动化
async function submitForm(url: string, formData: Record<string, string>) {
  const browser = await puppeteer.launch({ headless: false });
  const page = await browser.newPage();
  
  await page.goto(url);
  
  // Fill form fields
  for (const [selector, value] of Object.entries(formData)) {
    await page.type(selector, value);
  }
  
  // Submit
  await page.click('button[type="submit"]');
  await page.waitForNavigation();
  
  await browser.close();
}

PDF 选项

interface PDFOptions {
  path?: string;
  scale?: number;                    // 0.1 - 2, default 1
  displayHeaderFooter?: boolean;
  headerTemplate?: string;
  footerTemplate?: string;
  printBackground?: boolean;
  landscape?: boolean;
  pageRanges?: string;               // '1-5, 8, 11-13'
  format?: 'Letter' | 'Legal' | 'A4' | 'A3';
  width?: string;
  height?: string;
  margin?: { top, right, bottom, left };
}

标签

browser、pdf、screenshot、automation、scraping

兼容性

  • Codex：✅
  • Claude Code：✅

评论

支持 Markdown