mcpField
F
formpaste

formpaste

リモート
formpaste.com開発ツール013 週間前に更新
リポジトリ公式サイト

formpaste について

formpaste-mcpは、コーディングエージェントをFormpasteのホスト型サービスに接続し、問い合わせフォームの作成と組み込みを支援します。フォーム設定、スニペット、設定確認、テスト送信、任意の送信一覧を扱う6つのツールを備えています。

主な機能

  1. 01フォームを作成してアクセスキーを返す
  2. 02フレームワーク別スニペットの生成
  3. 03フォーム一覧と設定の確認
  4. 04テスト送信と組み込み確認
  5. 05本文を含む送信一覧の取得
  6. 06setupスコープでは送信内容を参照不可

活用シーン

  1. 01サイトの開発時に問い合わせフォームを作成
  2. 02既存ページにフォームスニペットを追加
  3. 03新たに組み込んだフォームの稼働確認

MCP 対応

`mcp-remote`を介し、streamable HTTPでFormpasteのホスト型MCPエンドポイントに接続します。MCPクライアントはフォーム、スニペット、送信に関する6つのツールを利用でき、APIトークンで送信内容へのアクセスを制御します。

設定

リモートサーバーはインストール不要です。クライアントを選んで設定をコピーするか、ワンクリックで導入できます。

エンドポイントhttps://api.formpaste.com/mcp
インストールコマンドをコピー
Claude CodeTerminal
Cursor.cursor/mcp.json
VS Code.vscode/mcp.json
Claude Desktopclaude_desktop_config.json
Windsurf~/.codeium/windsurf/mcp_config.json

コマンドはターミナルで実行し、JSON は各クライアントの MCP 設定に貼り付けて再起動します。認可が必要なサーバーは初回接続時にログインを求めます。

すべてのエンドポイント
Streamable HTTPhttps://api.formpaste.com/mcp認証が必要
パッケージ
npmformpaste-mcp1.0.1

ツール

6
パラメーター型必須説明
namestringはいフォームの人が読める名前。例:"Contact form"。
frameworkenumいいえ返されるスニペットの対象フレームワーク。デフォルトは html です。html | react | nextjs | astro | vue | svelte
destinationEmailstringはい送信内容をメールで受け取る宛先。配信を開始する前に検証が必要です。

詳細

formpaste-mcp

コーディングエージェントから問い合わせフォームを作成し、ページに組み込めます。フォーム、スニペット、送信内容を扱う6つのツールを提供します。

これは何ですか

このパッケージは、ホスト型 Formpaste MCP サーバー(https://api.formpaste.com/mcp、streamable-http トランスポートを使用)を指定して mcp-remote を起動する軽量なラッパーです。手動で設定する mcp-remote の構成も同じように動作します。このパッケージがあるのは主に、手動設定ではできないことを実現するためではなく、エージェントやクライアントが Formpaste の MCP サーバーを名前で見つけてインストールできるようにするためです。

要件

  • Node.js 18 以降
  • Formpaste アカウント
  • Formpaste ダッシュボードの Settings -> API & MCP で発行した API トークン

インストール

以下の各クライアントは、ホスト型 MCP エンドポイント https://api.formpaste.com/mcp に接続するよう設定されています。fpat_YOUR_TOKEN を Settings -> API & MCP で発行したトークンに置き換えてください。

Claude Code
claude mcp add formpaste --transport http https://api.formpaste.com/mcp \
  --header "Authorization: Bearer fpat_YOUR_TOKEN"
Codex
# ~/.codex/config.toml
[mcp_servers.formpaste]
command = "npx"
args = ["mcp-remote", "https://api.formpaste.com/mcp", "--header", "Authorization: Bearer fpat_YOUR_TOKEN"]
Cursor
// .cursor/mcp.json
{
  "mcpServers": {
    "formpaste": { "command": "npx", "args": ["mcp-remote", "https://api.formpaste.com/mcp", "--header", "Authorization: Bearer fpat_YOUR_TOKEN"] }
  }
}
Claude Desktop
// claude_desktop_config.json
{
  "mcpServers": {
    "formpaste": { "command": "npx", "args": ["mcp-remote", "https://api.formpaste.com/mcp", "--header", "Authorization: Bearer fpat_YOUR_TOKEN"] }
  }
}
VS Code
// .vscode/mcp.json
{
  "servers": {
    "formpaste": { "command": "npx", "args": ["mcp-remote", "https://api.formpaste.com/mcp", "--header", "Authorization: Bearer fpat_YOUR_TOKEN"] }
  }
}
このパッケージを使う任意の MCP クライアント
FORMPASTE_TOKEN=fpat_YOUR_TOKEN npx formpaste-mcp

formpaste-mcp は環境変数 FORMPASTE_TOKEN(または --token フラグ)からトークンを読み取り、ホスト型エンドポイントに接続する mcp-remote を起動します。

6つのツール

ツール用途スコープ
create_formフォームを作成し、アクセスキーと組み込み用スニペットを返しますsetup
get_snippethtml/react/nextjs/astro/vue/svelte 用のコピー&ペースト可能なスニペットを返しますsetup
list_formsID、名前、アクセスキー、受信トレイ/スパム件数とともに、すべてのフォームを一覧表示しますsetup
get_formフォームの設定を読み取り、正しく組み込まれていることを確認しますsetup
send_test_submissionテスト送信を保存し、フォームが稼働中であることを確認しますsetup
list_submissions必要に応じてメッセージ本文を含め、送信内容を一覧表示しますfull

トークンのスコープ

Formpaste API トークンには2つのスコープがあります。

  • full では、list_submissions による送信内容の読み取りを含め、すべての操作を実行できます。
  • setup では、list_submissions を除くすべての操作を実行できます。そのため、第三者からの送信内容を読み取ることはありません。

エージェントには setup スコープのトークンを使用してください。フォームの作成、スニペットの取得、フォームが正しく組み込まれていることの確認が可能で、フォームで収集したデータへのアクセス権は付与されません。

使用例

examples/wire-a-form.md で、フォームの作成、スニペットの取得、ページへの貼り付け、テスト送信、フォームが正しく組み込まれていることの確認までを順に説明しています。

リンク

コメント

MCP は初めてですか?

プロトコルの概要から最初のサーバーの導入まで、よくある疑問にまとめて答えます。

AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。