MCP ExplorerExplorer

Mcp Aoai Web Browsing

@kimtthon 9 months ago
21 MIT
FreeCommunity
AI Systems
#azure-openai#mcp#mcp-client#mcp-server#playwright#web-automation#model-context-protocol
"A minimal Model Context Protocol 🖥️ server/client 🧑‍💻 with Azure OpenAI and 🌐 web browser control via Playwright."

Overview

What is Mcp Aoai Web Browsing

mcp-aoai-web-browsing is a minimal server/client application that utilizes the Model Context Protocol (MCP) and integrates Azure OpenAI with web browser control via Playwright, enabling secure interactions between AI applications and web resources.

Use cases

Use cases include automated web browsing tasks, testing web applications, and interacting with AI models to perform actions based on web content, such as data extraction or form submission.

How to use

To use mcp-aoai-web-browsing, set up the environment by renaming ‘.env.template’ to ‘.env’ and filling in the Azure OpenAI credentials. Install the ‘uv’ library for dependency management, sync the project, and execute ‘python chatgui.py’ to launch the client and navigate to a specified URL.

Key features

Key features include integration with Azure OpenAI, web browser control using Playwright, a bridge for converting MCP responses to OpenAI function calling format, and a minimalistic design for ease of use.

Where to use

undefined

Content

MCP Server & Client implementation for using Azure OpenAI

  • A minimal server/client application implementation utilizing the Model Context Protocol (MCP) and Azure OpenAI.

    1. The MCP server is built with FastMCP.
    2. Playwright is an an open source, end to end testing framework by Microsoft for testing your modern web applications.
    3. The MCP response about tools will be converted to the OpenAI function calling format.
    4. The bridge that converts the MCP server response to the OpenAI function calling format customises the MCP-LLM Bridge implementation.
    5. To ensure a stable connection, the server object is passed directly into the bridge.

Model Context Protocol (MCP)

Model Context Protocol (MCP) MCP (Model Context Protocol) is an open protocol that enables secure, controlled interactions between AI applications and local or remote resources.

Official Repositories

Community Resources

Related Projects

  • FastMCP: The fast, Pythonic way to build MCP servers.
  • Chat MCP: MCP client
  • MCP-LLM Bridge: MCP implementation that enables communication between MCP servers and OpenAI-compatible LLMs

MCP Playwright

Configuration

During the development phase in December 2024, the Python project should be initiated with ‘uv’. Other dependency management libraries, such as ‘pip’ and ‘poetry’, are not yet fully supported by the MCP CLI.

  1. Rename .env.template to .env, then fill in the values in .env for Azure OpenAI:

    AZURE_OPEN_AI_ENDPOINT=
    AZURE_OPEN_AI_API_KEY=
    AZURE_OPEN_AI_DEPLOYMENT_MODEL=
    AZURE_OPEN_AI_API_VERSION=
    
  2. Install uv for python library management

    pip install uv
    uv sync
    
  3. Execute python chatgui.py

    • The sample screen shows the client launching a browser to navigate to the URL.
    chatgui

w.r.t. ‘stdio’

stdio is a transport layer (raw data flow), while JSON-RPC is an application protocol (structured communication). They are distinct but often used interchangeably, e.g., “JSON-RPC over stdio” in protocols.

Tool description

@self.mcp.tool()
async def playwright_navigate(url: str, timeout=30000, wait_until="load"):
    """Navigate to a URL.""" -> This comment provides a description, which may be used in a mechanism similar to function calling in LLMs.

# Output
Tool(name='playwright_navigate', description='Navigate to a URL.', inputSchema={'properties': {'url': {'title': 'Url', 'type': 'string'}, 'timeout': {'default': 30000, 'title': 'timeout', 'type': 'string'}

Tip: uv

uv run: Run a script.
uv venv: Create a new virtual environment. By default, '.venv'.
uv add: Add a dependency to a script
uv remove: Remove a dependency from a script
uv sync: Sync (Install) the project's dependencies with the environment.

Tip

  • taskkill command for python.exe
taskkill /IM python.exe /F
  • Visual Code: Python Debugger: Debugging with launch.json will start the debugger using the configuration from .vscode/launch.json.

Tools

No tools

Comments

Recommend MCP Servers

View All MCP Servers