【Fetch MCP】GitHub Copilot に Web 検索をさせよう
はじめに
この記事は「ハックツハッカソン ギガノトカップ 2025」で作成した「TYPE 2 DIVE」に関する記事です。
また、以下の記事の続きとして書いています。
GitHub Copilot、使ってますか?
2025年6月現在、学割適用で無料で使い倒せる便利な AI Agent ツールであり、お世話になっている人も多いかと思います(残念ながら制限はつきましたが...)
そのままでも十二分に強力なツールですが、この AI Agent に 新しいツール を付与できるとしたらどうでしょうか?
たとえば、AI は標準で教育時のデータを参照します。これはしばしば信頼性に問題があることがあり、最新の情報は都度ユーザが調べないといけないこともしばしばあります。こういった「検索」機能を AI Agent に持たせることができれば、より強力なツールになるのではないでしょうか?
そうした 「AI Agent のための新しいツール」を付与する技術 こそが MCP Server であり、そのうち検索機能を実装したものが Fetch MCP です。
前提
筆者は以下の環境で開発を行っています。
- Windows 11 (WSL2 / ubuntu 22.04)
- Visual Studio Code
また、MCP Server の動作にあたり Node.js のインストールが必要です。
記事執筆時点で LTS が Node.js 24 ですが、安定性を重視して Node.js 22 を使用しています。このへんはお好みでどうぞ。
さっそく入れてみる
まずは MCP Server をインストールします。
VSCode を開き、左上「ファイル」→「ユーザ設定」→「設定」を開きます。
設定画面が開きます。
開発環境が Windows の場合はそのまま、WSL の場合は「リモート」タブに切り替えます。
切り替えたら、検索バーに "mcp" と入力し、「Mcp」の「settings.json で編集」をクリック。
すると、settings.json
が開きます。
編集したことがない場合、だいたい以下のようになってるかと思います(間違ってたらゴメン)。
{
"mcp": {
"inputs": [],
"servers": {}
}
}
servers
の中に最初から入っているサーバーがあった気がしますが、消して大丈夫です。
ここに Fetch MCP Server の公式 README.md に書いてあるインストール情報を追加します。
{
"mcp": {
"inputs": [],
"servers": {
"fetch": {
"command": "uvx",
"args": [
"mcp-server-fetch"
]
},
}
}
}
これでセットアップ完了!
問題なければ、追加した項目の上に「▷起動」ボタンが表示されるはずです。
いったん VSCode を再起動したのち、これをクリックします。
問題なければ表示が「実行中」に代わるはず。
つかってみる
さて、お試しで起動してみましょう。
最近は急な雨が多いので、きょうのおてんきを聞いてみます。
すると、以下のように Web ページの検索許可を求める表示が出ます!こうなってれば導入成功です。
(出ない場合は、VSCode の再起動や MCP Server の再起動を試してみてください)
「続行」をクリックすると、以下のように Web ページの検索が行われ...
検索結果が表示されます。
きょうは雨ときどき曇り、らしいです。注意報が出ていますね。気を付けよう。
ちなみに、「続行」ボタン横のプルダウンから「常に許可」などが選べます。セキュリティ的に問題がなければ「常に許可」を選んでおくと便利です。
Discussion