🌐 MCP Agents

🌐 MCP エージェント

MCP Agents は、Streamlit、OpenAI、Puppeteerを使用し、**Model Context Protocol（MCP）**に基づいて構築された、AI 搭載の対話型ブラウザーアシスタントです。*「Wikipedia にアクセスして、火星を検索して」*のような自然言語の指示を入力すると、アプリが自動でページに移動し、クリックやスクロールを行い、さらにはコンテンツも抽出します。

---

🚀 機能

• ウェブと会話 — 簡単な英語の指示でウェブサイトを操作できます
• ビジュアル自動化 — スクリーンショットの撮影、要素のクリック、ページのスクロールを手軽に行えます
• 柔軟なエージェントシステム — モジュール式の MCP Agent フレームワークを基盤としています
• 安全な連携 — オプションのシークレット設定を使って API キーを安全に保管できます
• 完全な対話型 UI — 指示の実行結果をアプリのインターフェース上で直接確認できます

---

🎯 ユースケース

• 💼 商品情報のスクレイピング、ニュースの要約、自動ブラウジングのワークフロー
• 🧪 ウェブサイト内を案内する教育用ボット
• 📰 動的なページからの日々のコンテンツ抽出

---

⚙️ 要件

• Python 3.8 以降
• Node.js + npm（Puppeteer サーバー用）
• OpenAI API キー

---

⚡ クイックスタート

# Clone and enter the project
$ git clone https://github.com/your-username/mcp-agents.git
$ cd mcp-agents

# Install Python dependencies
$ pip install -r requirements.txt

# Verify Node.js setup
$ node --version && npm --version

# Optional: Start Puppeteer agent
$ npx -y @modelcontextprotocol/server-puppeteer

# Run the app
$ streamlit run main.py

ブラウザーで http://localhost:8501 にアクセスしてください。

---

🔐 シークレットの設定

mcp_agent.secrets.yaml という名前のファイルを作成してください。

openai:
  api_key: "your-openai-api-key"

➡️ 認証情報の漏えいを防ぐため、このファイルが .gitignore に記載されていることを確認してください。

---

💬 試せるコマンドの例

• 「www.wikipedia.org にアクセスして」
• 「ブラックホールを検索して、ページを要約して」
• 「最初の見出しをクリックして」
• 「ヒーローセクションのスクリーンショットを撮って」
• 「下にスクロールして、すべての h2 タイトルを抽出して」

---

📁 プロジェクトの概要

mcp-agents/
├── main.py                     # Streamlit application
├── requirements.txt           # Python dependencies
├── README.md                  # This file
├── mcp_agent.config.yaml      # Config for Puppeteer + agent setup
├── mcp_agent.secrets.yaml     # API secrets (ignored from Git)
├── .gitignore                 # File exclusions

---

📄 ライセンス

MIT License の下でライセンスされています。

---

🙋‍♂️ 作成者

Harsh が ❤️ を込めて開発しました。 MCP のオープンエージェントフレームワークを基盤とし、LastMileAI のツールから着想を得ています。

---

👨‍💻 AI 搭載の自動化エージェントを自分で作ってみませんか？ このリポジトリをフォークして、カスタマイズを始めましょう！