MCP FetchPage

Captura inteligente de páginas da web com suporte automático a cookies e extração de seletores CSS.

GitHub
2

Documentação

MCP Fetch Page

Busca de páginas da web baseada em navegador com suporte automático a cookies e extração por seletores CSS.

Recursos

  • 🤖 Automação de Navegador: Renderização completa de JavaScript com Puppeteer
  • 🍪 Gerenciamento Automático de Cookies: Carrega todos os cookies salvos automaticamente
  • 🎯 Suporte a Seletores CSS: Extraia conteúdo específico com seletores
  • 🌐 Predefinições de Domínio: Seletores integrados para sites comuns
  • 📱 Suporte a SPA: Suporta totalmente conteúdo dinâmico e AJAX

Início Rápido

1. Configurar o Servidor MCP

Adicione à configuração do seu Claude Desktop (~/Library/Application Support/Claude/claude_desktop_config.json):

{
  "mcpServers": {
    "mcp-fetch-page": {
      "command": "npx",
      "args": ["-y", "mcp-fetch-page@latest"]
    }
  }
}

Para personalizar o diretório de dados em tempo de execução (recomendado em VPS), defina MCP_FETCH_PAGE_DATA_DIR no MCP env:

{
  "mcpServers": {
    "mcp-fetch-page": {
      "command": "npx",
      "args": ["-y", "mcp-fetch-page@latest"],
      "env": {
        "MCP_FETCH_PAGE_DATA_DIR": "/data/mcp-fetch-page"
      }
    }
  }
}

Reinicie o Claude Desktop.

2. Instalar a Extensão do Chrome (Opcional - para páginas autenticadas)

Baixe e instale a extensão do Chrome para salvar cookies de sessões autenticadas:

📥 Baixar Extensão dos Releases

Passos de instalação:

  1. Baixe o mcp-fetch-page-extension-vX.X.X.zip do release mais recente
  2. Descompacte o arquivo
  3. Abra o Chrome e vá para chrome://extensions/
  4. Ative o "Modo de desenvolvedor" (canto superior direito)
  5. Clique em "Carregar sem compactação" e selecione a pasta descompactada

Uso

Uso Básico

  1. Faça login em um site no Chrome
  2. Clique no ícone da extensão "Fetch Page MCP Tools"
  3. Clique no botão "Salvar Cookies"
  4. Use no Claude/Cursor: fetchpage(url="https://example.com")

Uso Avançado

// Basic fetching with automatic cookie loading
fetchpage(url="https://example.com")

// Extract specific content with CSS selector
fetchpage(url="https://example.com", waitFor="#main-content")

// WeChat articles (automatic selector)
fetchpage(url="https://mp.weixin.qq.com/s/xxxxx")

// Run in non-headless mode for debugging
fetchpage(url="https://example.com", headless=false)

Predefinições de Domínio

O sistema usa automaticamente seletores otimizados para:

  • mp.weixin.qq.com → .rich_media_wrp (artigos WeChat)
  • wx.zsxq.com → .content (Knowledge Planet)
  • cnblogs.com → .post (Blog Garden)
  • Adicione mais em mcp-server/domain-rules.json (domain-selectors.json continua suportado para compatibilidade)

Ferramentas de Depuração

# Standalone debug script (recommended for development)
cd mcp-server
node debug.js test-page "https://example.com"
node debug.js test-spa "https://example.com" "#content"

# MCP Inspector (for integration testing)
npx @modelcontextprotocol/inspector
# Then visit http://localhost:6274

Diretório de Dados (Opcional)

Por padrão, os dados em tempo de execução são armazenados em ~/Downloads/mcp-fetch-page/:

  • Cookies: ~/Downloads/mcp-fetch-page/cookies
  • Páginas: ~/Downloads/mcp-fetch-page/pages

Para uso com MCP, configure MCP_FETCH_PAGE_DATA_DIR no campo env da configuração do seu cliente MCP. O servidor sempre usará:

  • <MCP_FETCH_PAGE_DATA_DIR>/cookies
  • <MCP_FETCH_PAGE_DATA_DIR>/pages
  • <MCP_FETCH_PAGE_DATA_DIR>/domain-rules.json (sobreposições opcionais do usuário mescladas com regras integradas)

node mcp-server/server.js é apenas para desenvolvimento/depuração local.

Parâmetros

  • url (obrigatório): A URL a ser buscada
  • waitFor (opcional): Seletor CSS para extrair conteúdo específico
  • headless (opcional): Executar o navegador em modo headless (padrão: true)
  • timeout (opcional): Tempo limite em milissegundos (padrão: 30000)

Estrutura de Arquivos

mcp-fetch-page/
├── package.json              # npm package config
├── package-lock.json         # npm lockfile
├── node_modules/             # npm dependencies
├── README.md                 # This file
├── README-zh.md              # Chinese version
├── CLAUDE.md                 # Claude Code usage guide
├── chrome-extension/         # Chrome extension
│   ├── manifest.json
│   ├── popup.js
│   ├── popup.html
│   └── background.js
└── mcp-server/              # MCP server
    ├── server.js            # Main server
    ├── debug.js             # Debug tools
    ├── domain-rules.json     # Domain rules config (selector + blocked markers)
    └── domain-selectors.json # Legacy selector config (compatibility fallback)

Solução de Problemas

  • Extensão não funciona: Certifique-se de estar em um site normal (não em páginas chrome://)
  • Nenhum cookie encontrado: Tente fazer login novamente e salvar os cookies
  • MCP não conecta: Verifique a instalação do Node.js e reinicie seu editor
  • Erro de caminho: Defina MCP_FETCH_PAGE_DATA_DIR no env da configuração MCP para um caminho absoluto gravável na sua máquina/VPS
  • Seletor CSS não funciona: Verifique se o seletor existe na página

É isso! 🍪