1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

TypeScript版の FastMCP を少し試す(自作MCPサーバー)

Last updated at Posted at 2025-05-06

もう少し文章を足せば完成、という状態だった記事を、しばらく寝かせてしまっていたので、画面内のキャプチャ画像が少しだけ古いものが混じっているかもしれません(実施した内容・機能には問題は生じないかと思います ← 一部の内容については、記事の最後の部分で補足をしました)

はじめに

MCP に関するお試しとして、MCPサーバーのクイックスタートに手をつけてみたり、基本的な機能を触ってみたりしています。

自作MCPサーバー

その中で公式の TypeScript SDK を使った自作MCPサーバーというのも試していました。

そのような中、MCPサーバーの実装を手軽に行える「FastMCP」というのを見かけて気になっていたので、それを試したという話です。

以下のように、TypeScript版・Python版があるようですが、自分は TypeScript版を試しました。

FastMCP(TypeScript版)

image.png

FastMCP(Python版)

image.png

実際に試してみる

実際に試していきます。

パッケージのインストールとクイックスタート

パッケージのインストールは、fastmcp のみの指定で良いようです。

npm install fastmcp

また、Quickstart には、以下のコードが書かれていました。

import { FastMCP } from "fastmcp";
import { z } from "zod";supports Standard Schema

const server = new FastMCP({
  name: "My Server",
  version: "1.0.0",
});

server.addTool({
  name: "add",
  description: "Add two numbers",
  parameters: z.object({
    a: z.number(),
    b: z.number(),
  }),
  execute: async (args) => {
    return String(args.a + args.b);
  },
});

server.start({
  transportType: "stdio",
});

ひとまず、計算をする処理に少しだけ手を加えた以下で試すことにします。

app.ts
import { FastMCP } from "fastmcp";
import { z } from "zod";supports Standard Schema

const server = new FastMCP({
  name: "My Server",
  version: "1.0.0",
});

server.addTool({
  name: "add",
  description: "2つの数を足して、さらに5を足す",
  parameters: z.object({
    a: z.number(),
    b: z.number(),
  }),
  execute: async (args) => {
    return String(args.a + args.b + 5);
  },
});

server.start({
  transportType: "stdio",
});

公式の MCP の TypeScript SDK を使った場合との比較

前に MCPサーバーを自作した時、公式の MCP の TypeScript SDK を使って開発した場合と比較してみます。

image.png

以前と今回の実装内容がシンプルすぎて、今のところ差分がほとんどない状況でした。

Claude for Desktop から使う

設定

あとは Claude for Desktop から利用してみます。

FAQ の部分を見ると、設定が書いてありました。

image.png

以前、自分が TypeScript SDK で試した時に、TypeScript のコードを Node.js で直接実行する形で扱えたので、今回もそのやり方を用いることにします。

{
  "mcpServers": {
    "my-mcp-server": {
      "command": "node",
      "args": ["/【ファイルを置いたフォルダの絶対パス】/app.ts"]
    }
  }
}

動作確認

準備ができたので、Claude for Desktop を使った動作確認をやってみます。

とりあえず、ツールが利用可能になっているかを GUI上で確認してみました。

image.png

問題なく使えそうだったので、「ツールで1と2を足して」というプロンプトを試しました。

image.png

上記のツール利用を許可する操作をして、以下の結果が得られました。
MCPサーバーを使った処理を、うまく実行できたようです。

image.png

おわりに

今回、前に使った公式の MCP の TypeScript SDK ではなく、TypeScript版の FastMCP を使って MCPサーバーの自作を試しました。

簡単な MCPサーバーの自作だと、FastMCP を使った効果があらわれなかったので、さらに FastMCP の詳細を見てみたり、さらなる処理の実装を試せればと思います。

その他

その他、今回の内容を進めている中で見かけて気になったものをメモしてみます。

FastMCP の Showcase の情報になります。

image.png

【追記】 記事公開時点での GUI

記事公開時点で、記事に書いた内容を試した際、見た目が変わっていた部分を少しキャプチャしてみました。

例えば、自作MCPサーバーの実行時の許可の画面は、今現在だと以下になっていました(※「リクエスト」の部分は、デフォルトでは閉じられていたのを開いた状態にしています)。

image.png

また、処理実行後のチャット画面は以下になりました(※「add」の部分は、デフォルトでは閉じられていたのを開いた状態にしています)。

image.png

MCPサーバーに関する変更

また新規チャット画面で、利用可能な MCPサーバーを確認できる画面でも変更が入っています。これは、MCPサーバーの機能の ON/OFF ができるようになったことによるものです。

image.png

「my-mcp-server」を選ぶと、以下のように「add」の機能の ON/OFF が選べます。

image.png

なお、複数の機能を実装している場合、全体の ON/OFF と個々の機能の ON/OFF が行えるようになっています。

例えば「Filesystem MCP Server(filesystem)」のほうを見てみると、以下のような ON/OFF の設定を行えるようになっています。

image.png

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?