A
licenseB
qualityD
maintenanceA server that enables browser automation using Playwright, allowing interaction with web pages, capturing screenshots, and executing JavaScript in a browser environment through LLMs.
12
14,310 npm
1
MIT
Web Content MCP Server
by amotivv
Cloudflare 브라우저 렌더링 실험 및 MCP 서버
이 프로젝트는 Cloudflare Browser Rendering을 사용하여 LLM 컨텍스트에 대한 웹 콘텐츠를 추출하는 방법을 보여줍니다. REST API 및 Workers Binding API를 활용한 실험과 LLM에 웹 컨텍스트를 제공하는 데 사용할 수 있는 MCP 서버 구현이 포함됩니다.
프로젝트 구조
지엑스피1
Related MCP server: MCP Web Tools Server
필수 조건
Node.js(v16 이상)
브라우저 렌더링이 활성화된 Cloudflare 계정
타입스크립트
Wrangler CLI(Worker 배포용)
설치
저장소를 복제합니다.
git clone https://github.com/yourusername/cloudflare-browser-rendering.git
cd cloudflare-browser-rendering종속성 설치:
npm installCloudflare Worker 설정
Cloudflare Puppeteer 패키지를 설치하세요:
npm install @cloudflare/puppeteerWrangler 구성:
# wrangler.toml
name = "browser-rendering-api"
main = "puppeteer-worker.js"
compatibility_date = "2023-10-30"
compatibility_flags = ["nodejs_compat"]
[browser]
binding = "browser"작업자 배치:
npx wrangler deploy작업자 테스트:
node test-puppeteer.js실험 실행
기본 REST API 실험
이 실험은 Cloudflare Browser Rendering REST API를 사용하여 웹 콘텐츠를 가져오고 처리하는 방법을 보여줍니다.
npm run experiment:rest퍼펫티어 바인딩 API 실험
이 실험은 Puppeteer와 함께 Cloudflare Browser Rendering Workers Binding API를 사용하여 더욱 고급 브라우저 자동화를 구현하는 방법을 보여줍니다.
npm run experiment:puppeteer콘텐츠 추출 실험
이 실험은 LLM의 컨텍스트로 사용하기 위해 웹 콘텐츠를 추출하고 처리하는 방법을 보여줍니다.
npm run experiment:contentMCP 서버
MCP 서버는 LLM의 컨텍스트로 사용하기 위해 Cloudflare Browser Rendering을 사용하여 웹 콘텐츠를 가져오고 처리하는 도구를 제공합니다.
MCP 서버 구축
npm run buildMCP 서버 실행
npm start또는 개발을 위해:
npm run devMCP 서버 도구
MCP 서버는 다음과 같은 도구를 제공합니다.
fetch_page- LLM 컨텍스트에 대한 웹 페이지를 가져와 처리합니다.search_documentation- Cloudflare 문서를 검색하여 관련 콘텐츠를 반환합니다.extract_structured_content- CSS 선택기를 사용하여 웹 페이지에서 구조화된 콘텐츠를 추출합니다.summarize_content- 보다 간결한 LLM 컨텍스트를 위해 웹 콘텐츠를 요약합니다.
구성
Cloudflare 브라우저 렌더링 엔드포인트를 사용하려면 BROWSER_RENDERING_API 환경 변수를 설정하세요.
export BROWSER_RENDERING_API=https://YOUR_WORKER_URL_HEREYOUR_WORKER_URL_HERE 배포된 Cloudflare Worker의 URL로 바꾸세요. 여러 파일에서 이 자리 표시자를 바꿔야 합니다.
테스트 파일:
test-puppeteer.js,examples/debugging-tools/debug-test.js,examples/testing/content-test.jsMCP 서버 구성:
cline_mcp_settings.json.example브라우저 클라이언트에서:
src/browser-client.ts(환경 변수가 설정되지 않은 경우 대체용으로)
Cline과 통합
MCP 서버를 Cline과 통합하려면 cline_mcp_settings.json.example 파일을 적절한 위치에 복사하세요.
cp cline_mcp_settings.json.example ~/Library/Application\ Support/Code/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json또는 기존 cline_mcp_settings.json 파일에 구성을 추가합니다.
주요 학습 내용
Cloudflare 브라우저 렌더링에는 브라우저 바인딩과 상호 작용하기 위해
@cloudflare/puppeteer패키지가 필요합니다.브라우저 바인딩을 사용하는 올바른 패턴은 다음과 같습니다.
import puppeteer from '@cloudflare/puppeteer'; // Then in your handler: const browser = await puppeteer.launch(env.browser); const page = await browser.newPage();브라우저 렌더링 바인딩을 사용하는 Worker를 배포하는 경우
nodejs_compat호환성 플래그를 활성화해야 합니다.리소스 누수를 방지하려면 사용 후에는 항상 브라우저를 닫으세요.
특허
MIT
Available Tools
4 toolsextract_structured_contentC
Extracts structured content from a web page using CSS selectors
ParametersJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| selectors | Yes | CSS selectors to extract content | |
| url | Yes | URL to extract content from |
TDQS
C2.9/5.0
Behavior2/5
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It states what the tool does but lacks critical behavioral details: it doesn't specify if it fetches the page internally, handles errors, requires internet access, has rate limits, or what the output format is. For a tool with no annotations, this leaves significant gaps in understanding its operation.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Conciseness5/5
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is extremely concise and front-loaded: a single sentence that directly states the tool's function without any fluff. Every word earns its place by conveying essential information about extraction, content type, source, and method. It's efficiently structured for quick understanding.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Completeness2/5
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the complexity of web extraction (involving network calls, parsing, and structured data output), the description is incomplete. There's no output schema, and the description doesn't explain return values, error handling, or behavioral traits. With no annotations and only basic parameter coverage, it fails to provide enough context for effective use in real-world scenarios.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Parameters3/5
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The schema description coverage is 100%, meaning the input schema already documents both parameters ('url' and 'selectors') with descriptions. The tool description adds no additional meaning beyond what's in the schema—it doesn't explain parameter interactions, provide examples, or clarify semantics. With high schema coverage, the baseline score of 3 is appropriate.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Purpose4/5
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose: 'Extracts structured content from a web page using CSS selectors'. It specifies the verb ('extracts'), resource ('structured content'), and method ('CSS selectors'), which is specific and actionable. However, it doesn't explicitly differentiate from sibling tools like 'fetch_page' or 'summarize_content', which would require a 5.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Usage Guidelines2/5
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives. It doesn't mention scenarios where extraction is preferred over fetching the whole page, searching documentation, summarizing, or taking a screenshot. Without any context or exclusions, users must infer usage from the purpose alone.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
fetch_pageC
Fetches and processes a web page for LLM context
ParametersJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| includeScreenshot | No | Whether to include a screenshot (base64 encoded) | |
| maxContentLength | No | Maximum content length to return | |
| url | Yes | URL to fetch |
TDQS
C2.9/5.0
Behavior2/5
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It mentions 'fetches and processes' but doesn't clarify aspects like rate limits, authentication needs, error handling, or what 'processes' entails (e.g., cleaning HTML, extracting text). This leaves significant gaps for a tool that interacts with external resources.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Conciseness5/5
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that front-loads the core purpose without any wasted words. It's appropriately sized for the tool's complexity, making it easy to parse quickly.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Completeness2/5
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the tool's complexity (fetching and processing web pages), lack of annotations, and no output schema, the description is incomplete. It doesn't explain return values, error cases, or behavioral traits, leaving the agent with insufficient information for reliable use.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Parameters3/5
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 100% description coverage, so the baseline is 3. The description adds no additional meaning beyond the schema, which already details parameters like 'url', 'includeScreenshot', and 'maxContentLength'. No extra syntax, format, or usage context is provided.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Purpose4/5
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose with specific verbs ('fetches and processes') and resource ('a web page'), and specifies the outcome ('for LLM context'). It doesn't explicitly differentiate from sibling tools like 'extract_structured_content' or 'summarize_content', which prevents a perfect score.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Usage Guidelines2/5
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives like 'extract_structured_content' or 'search_documentation'. It lacks context about prerequisites, exclusions, or comparative use cases, offering only a basic functional statement.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
search_documentationC
Searches Cloudflare documentation and returns relevant content
ParametersJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| maxResults | No | Maximum number of results to return | |
| query | Yes | Search query |
TDQS
C2.9/5.0
Behavior2/5
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
No annotations are provided, so the description carries the full burden of behavioral disclosure. It states the tool searches and returns content, but doesn't describe important behaviors like whether it performs web searches, accesses a local database, requires authentication, has rate limits, or what format the returned content takes (e.g., text snippets, links, full documents).
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Conciseness4/5
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence that gets straight to the point without unnecessary words. It's appropriately sized for a simple search tool, though it could potentially be more structured with additional context.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Completeness2/5
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
For a search tool with no annotations and no output schema, the description is incomplete. It doesn't explain what kind of content is returned (snippets, full pages, metadata), how results are ranked, whether authentication is needed, or any limitations. Given the lack of structured fields, the description should provide more operational context.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Parameters3/5
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 100% description coverage, clearly documenting both parameters ('query' and 'maxResults'). The description doesn't add any meaningful parameter semantics beyond what the schema already provides, such as search syntax examples or result format details.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Purpose4/5
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose with a specific verb ('Searches') and resource ('Cloudflare documentation'), making it immediately understandable. However, it doesn't distinguish this tool from its sibling tools like 'fetch_page' or 'extract_structured_content', which might also retrieve documentation content in different ways.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Usage Guidelines2/5
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives. It doesn't mention any prerequisites, constraints, or compare it to sibling tools like 'fetch_page' (which might retrieve a specific page) or 'summarize_content' (which might process content).
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
summarize_contentC
Summarizes web content for more concise LLM context
ParametersJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| maxLength | No | Maximum length of the summary | |
| url | Yes | URL to summarize |
TDQS
C2.9/5.0
Behavior2/5
Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?
With no annotations provided, the description carries the full burden of behavioral disclosure. It states the tool 'summarizes web content' but doesn't describe how it works (e.g., extraction method, processing time, error handling), what limitations exist (e.g., supported content types, rate limits), or what the output looks like. This leaves significant gaps in understanding the tool's behavior.
Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.
Conciseness5/5
Is the description appropriately sized, front-loaded, and free of redundancy?
The description is a single, efficient sentence with zero waste. It's front-loaded with the core purpose and includes a clear goal, making it appropriately sized and well-structured for quick understanding.
Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.
Completeness2/5
Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?
Given the complexity of summarizing web content, no annotations, and no output schema, the description is incomplete. It doesn't explain the return format, potential errors, or behavioral traits like content processing methods. For a tool with 2 parameters and significant operational implications, more context is needed.
Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.
Parameters3/5
Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?
The input schema has 100% description coverage, clearly documenting both parameters ('url' and 'maxLength'). The description adds no additional parameter semantics beyond what the schema provides, such as format details for 'url' or typical values for 'maxLength'. Baseline 3 is appropriate when the schema does the heavy lifting.
Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.
Purpose4/5
Does the description clearly state what the tool does and how it differs from similar tools?
The description clearly states the tool's purpose with a specific verb ('summarizes') and resource ('web content'), and it provides the goal ('for more concise LLM context'). However, it doesn't explicitly differentiate from sibling tools like 'extract_structured_content' or 'fetch_page', which might have overlapping functionality.
Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.
Usage Guidelines2/5
Does the description explain when to use this tool, when not to, or what alternatives exist?
The description provides no guidance on when to use this tool versus alternatives like 'extract_structured_content' or 'fetch_page'. It doesn't mention prerequisites, exclusions, or specific contexts where this summarization tool is preferred over other content-handling siblings.
Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.
Tool Schema Changelog
Recent tool additions, removals, and schema changes observed during successful MCP inspections.
4 tool updates
v1.0.0- First observed
extract_structured_content - First observed
fetch_page - First observed
search_documentation - First observed
summarize_content
TDQS
B3.1/5.0
Scored across 4 tools
Disambiguation4/5
The tools are mostly distinct in purpose, with extract_structured_content, fetch_page, and summarize_content each handling different aspects of web content processing. However, fetch_page and summarize_content could be slightly confused as both relate to processing web content for LLM context, though their specific focuses differ.
Naming Consistency5/5
All tool names follow a consistent verb_noun pattern with snake_case, such as extract_structured_content and fetch_page. This uniformity makes the set predictable and easy to understand, with no deviations in naming conventions.
Tool Count3/5
With 4 tools, the count is on the lower side for a web content server, which might feel thin for covering a broad domain like web content processing. However, it is reasonable for a focused set, though it could benefit from additional tools for more comprehensive coverage.
Completeness2/5
There are significant gaps in the tool surface for web content processing. For example, there are no tools for updating or deleting content, handling dynamic content like JavaScript, or managing multiple pages. The inclusion of search_documentation is also inconsistent with the general web content focus, creating a notable gap in core operations.
Maintenance
ActivityInactive
ResponsivenessNo issues
Related MCP Connectors
Web search and any page as LLM-ready Markdown for AI agents. Free keyless tier, no signup.
Hosted browser for agents: open pages, search the web, extract data, read PDFs and take screenshots.
Web search, browser automation, scraping, crawling and CAPTCHA solving for AI agents.
Unblocking and fresh web data for agents: URL to Markdown, YouTube, Maps, Amazon, jobs. Pay per call
Related MCP Servers
- AlicenseNot gradedqualityDmaintenanceA Model Context Protocol server that allows LLMs to interact with web content through standardized tools, currently supporting web scraping functionality.1MIT
- AlicenseAqualityDmaintenanceThis MCP server provides tools for interacting with Cloudflare Browser Rendering, allowing you to fetch and process web content for use as context in LLMs directly from Cline or Claude Desktop.510MIT
- FlicenseNot gradedqualityDmaintenanceA server that enables AI systems to browse, retrieve content from, and interact with web pages through the Model Context Protocol.1-