Apidog

オールインワン協働API開発プラットフォーム

API設計

APIドキュメント

APIデバッグ

APIモック

API自動テスト

無料会員登録
ダウンロードMacとLinux版はこちら
Home

/

ClaudeデスクトップでFetch MCPサーバーを使う方法

ClaudeデスクトップでFetch MCPサーバーを使う方法

Ashley Goolam

Ashley Goolam

Updated on 5月 15, 2025

AIにオンデマンドでウェブコンテンツを取得させたいと思ったことはありませんか？最近、Claude Desktopをいじっているときにfetch mcp serverに出会い、これがまさにゲームチェンジャーだと気づきました！この便利なツールを使えば、Claude DesktopがURLから直接ウェブコンテンツ（HTML、JSON、Markdownなど）を取得できるようになり、リサーチや自動化に最適です。このチュートリアルでは、fetch mcp serverをセットアップし、Claude Desktopに接続して、簡単にコンテンツを取得する方法を探ります。初心者の方でも経験者の方でも、私が一歩ずつご案内します。さあ、このエキサイティングなセットアップに飛び込みましょう！

💡
始める前に、APIファンにとって素晴らしいツールであるApidogに感謝の意を表します！APIテストとデバッグを簡素化し、fetch mcp serverの旅と相性抜群です。apidog.comでぜひチェックしてみてください！さあ、このクールなプロジェクトを始めましょう…
button

Fetch MCP Serverとは？

Fetch MCP serverは、ウェブコンテンツをHTML、JSON、プレーンテキスト、Markdownなどの形式に取得・変換するために設計されたModel Context Protocol（MCP）サーバーです。Zach Caceres氏によって開発され、GitHubでホストされています。これは、Anthropic（2024年開始）によるオープン標準であるMCPエコシステムの一部であり、AIモデルを外部ツールに接続します。fetch mcp serverを使用すると、Claude Desktopはウェブページを取得したり、データを抽出したり、コンテンツをその場で変換したりすることができ、ネイティブな機能を超えて能力を向上させます。

Claudeに「example.comの最新記事を取得して」とか「このページをMarkdownに変換して」と尋ねることを想像してみてください。それがfetch mcp serverの力です！軽量で柔軟性があり、リアルタイムのウェブデータをワークフローに統合するのに最適です。Claude Desktopでセットアップして、実際に動かしてみましょう！

Fetch MCP Serverのための環境設定

Claude Desktopでfetch mcp serverのためにシステムを準備しましょう。簡単なプロセスですので、早速始めましょう！

1. 前提条件の確認:

  • Node.js: Node.js（バージョン16以上）がインストールされている必要があります。ターミナルでnode --versionを実行して確認するか、nodejs.orgからダウンロードしてください。
  • Claude Desktop: Claude Desktopがインストールされていることを確認してください（anthropic.comから入手可能）。MCPサポートには有料プラン（例：Max、Team、Enterprise）が必要です。
claude desktop

2. プロジェクトフォルダの作成:

  • ターミナルを開き、ワークスペースを作成します。
mkdir fetch-mcp-project
cd fetch-mcp-project
  • ここがfetch mcp serverセットアップの中心となります。

これでfetch mcp serverをインストールする準備ができました。次に進みましょう！

Claude DesktopでのFetch MCP Serverのインストール

さあ、fetch mcp serverをインストールしてClaude Desktopにリンクしましょう。ステップバイステップのガイドです。

1. Fetch MCP Serverリポジトリのクローン:

  • ターミナル（fetch-mcp-project内）で、以下を実行します。
git clone https://github.com/zcaceres/fetch-mcp.git
cd fetch-mcp
  • これにより、GitHubからfetch mcp serverの最新バージョンがダウンロードされます。

2. 依存関係のインストールとサーバーのビルド:

  • 必要なNode.jsパッケージをセットアップするために以下を実行します。
npm install
  • これにより、画像処理用のsharpなどの依存関係がインストールされ、サーバーが実行準備完了になります。
  • サーバーをビルドするために以下のコマンドを実行します。
npm run build

3. Claude Desktopの設定:

  • Claude Desktopの設定ファイルを開きます。macOSでは、~/Library/Application Support/Claude/claude_desktop_config.jsonにあります。存在しない場合は、テキストエディタで作成してください。または、Claude Desktopアプリで直接、[設定] > [開発者] > [設定を編集]に進み、config.jsonファイルを開くこともできます。
claude setings
mcp config file
  • fetch mcp serverの設定を追加します。
{
  "mcpServers": {
    "fetch": {
      "command": "node",
      "args": ["{ABSOLUTE PATH TO FILE HERE}/dist/index.js"]
    }
  }
}
  • {ABSOLUTE PATH TO FILE HERE}をfetch-mcp/dist/index.jsへのフルパスに置き換えてください（例：/Users/yourname/fetch-mcp-project/fetch-mcp/dist/index.js）。これは、fetch-mcpフォルダ内でターミナルでpwdを実行することで確認できます。

4. Fetch MCP Serverの実行:

  • ターミナルでfetch-mcpフォルダに移動し、サーバーを起動します。
npm start

# Alternativly you could use:
node dist/index.js
  • 「Fetch MCP Server running on stdio」またはそれに類似した出力が表示され、サーバーがアクティブであることを示します。Claude Desktopを使用している間はこのターミナルを開いたままにしてください。

5. 接続の確認:

  • Claude Desktopを開き、MCP設定（プロファイルメニューの下）に移動し、「fetch」が利用可能なサーバーの下に緑色のインジケーター付きで表示されているか確認します。表示されていない場合は、claude_desktop_config.jsonのパスを再確認するか、サーバーが実行されていることを確認してください。
claude mcp tools

これで、fetch mcp serverがClaude Desktopに接続されました。素晴らしい！早速テストしてみましょう。

fetch mcp tool

Claude DesktopでのFetch MCP Serverの使用

Claude Desktopでウェブコンテンツを取得するために、fetch mcp serverを使ってみましょう。

1. 基本的なウェブ取得のテスト（例：コンテンツの要約）:

  • Claude Desktopのチャットで、「fetchツールを使ってhttps://example.comのコンテンツを取得して。」と入力します。
  • Claudeはfetch mcp serverを使用してページを取得し、テキストとして返します。「https://example.comからコンテンツを取得しました。」のようなメッセージが表示されるかもしれません。
  • 失敗する場合は、サーバーが実行されていること、およびURLが有効であることを確認してください。
  • 注: ClaudeがチャットでMCPツールを使用する前に、常にプロンプトが表示されます。
use mcp prompt msg

2. 取得とMarkdownへの変換:

  • 「https://example.comを取得してMarkdownに変換して。」と試してみてください。
  • Fetch mcp serverはページを処理し、クリーンなMarkdownバージョンを返します。これはドキュメント作成や分析に最適です。Claudeは「https://example.comをMarkdownに変換しました：[Markdownコンテンツ]」と応答するかもしれません。
  • これは記事を読みやすいノートに変えるのに最適です！
fetch mcp markdown

これにより、fetch mcp serverを使った可能性の世界が広がります。さらに探ってみましょう！

Fetch MCP Serverの高度な機能の探求

fetch mcp serverには、基本的な取得以外にも多くの機能があります。Claude Desktopでさらに深く掘り下げる方法をご紹介します。

1. 取得リクエストのカスタマイズ:

  • 「https://example.comを最大長500文字で取得して。」のようなパラメータを追加します。
  • これにより出力が制限され、長いページに便利です。ignoreRobotsTxtのような他の設定オプションについては、GitHubリポジトリを確認してください。

2. ワークフローとの統合:

  • 他のMCPサーバー（例：Notionサーバー）と組み合わせて、「https://example.comを取得してMarkdownをNotionに保存して。」と尋ねます。
  • 設定されていれば、Claudeはツールを連携させることができ、タスクを効率化できます。

3. デバッグのヒント:

  • Claudeが接続できない場合は、サーバーパスが正しいことを確認するか、より詳細なログを表示するために--debug付きでnode dist/index.jsを実行してみてください。

これらの機能により、fetch mcp serverはClaude Desktopのセットアップにとって多用途なツールとなります！

Fetch MCP Serverをマスターするためのヒント

Claude Desktopでfetch mcp serverを最大限に活用するには：

  • パスの確認: 接続の問題を避けるために、claude_desktop_config.jsonの絶対パスを再確認してください。
  • 機能の有効化: 視覚的なコンテンツのためにenableFetchImagesを試してみてください。Claudeユーザーはこの特典を利用できます！
  • サーバーの実行を維持: サーバーが実行されているターミナルを閉じないでください。必要に応じて再起動してください。
  • GitHubの探索: fetch-mcpリポジトリには、試せるアップデートや例があります。

Fetch MCP Serverを使った私の経験

Claude Desktopでfetch mcp serverを使うのは楽しかったです！ウェブページを取得してMarkdownに変換することで、時間を大幅に節約できました。パスを正確に設定すれば、セットアップはスムーズでしたが、何度か調整する必要がありました。問題が発生した場合は、サーバーのステータスを確認するか、GitHubのissueで助けを求めてみてください。

まとめ: Fetch MCP Serverの旅

あなたはClaude Desktopでfetch mcp serverをセットアップし、ウェブコンテンツ取得の魔法を解き放ちました！ページの取得からMarkdownや画像への変換まで、AIワークフローを強化するための準備が整いました。お気に入りのサイトを取得したり、タスクを自動化したりしてみてください。そして、成功体験を共有しましょう！詳細については、GitHubリポジトリをチェックしてください。そして、Postmanのより良い代替ツールであるapidog.comにも立ち寄ることを忘れないでください！

button