SpotifyのAPIを使って楽曲検索MCPを作ってみた

はじめに

こんにちは。
SKIYAKIのエンジニアの家（@ie_webengineer)です。

今回は自前のMCPを設定したいと思います。
本当はrubyで検証したかったのですが、
色々トラブルがあり、やめました。
また次の機会に再チャレンジしたいと思います。

今回バイブコーディングで作ったので
コードの公開までに至っていないのですが、
調整してのちに公開できればしたいと思います。

やったこと

1. spotifyのダッシュボードでアプリ登録
2. MCPサーバーをバイブコーディングで作成
3. CursorでMCP設定
4. 実際に検証

実際に作ってみて検証してみる

1. spotifyのダッシュボードでアプリ登録

1. spotifyのdeveloperダッシュボードにログイン
   https://developer.spotify.com/dashboard

2. アプリ登録後ClientIDとClientSecretを用意

Create Appからアプリの情報登録

とりあえずお試しなので画像のように入力すれば良いです

2. MCPサーバーをバイブコーディングで作成

・依頼内容

clientidとclientsecretでspotifyの音源を取得できるapiを実行するmcpを用意したい

結果

今回はCursorのComposer1に作ってもらいました！
それっぽいものが数十秒でできました。

Spotify MCPサーバーを作成しました。
作成したもの
Client IDとClient SecretでSpotifyの音源情報を取得するMCPサーバーです。
以下の機能を提供します：
利用可能なツール
search_tracks - トラック（曲）を検索
search_albums - アルバムを検索
search_artists - アーティストを検索
get_track - トラックIDから詳細情報を取得
get_album - アルバムIDから詳細情報を取得
get_album_tracks - アルバムのトラック一覧を取得
get_artist - アーティストIDから詳細情報を取得
get_artist_albums - アーティストのアルバム一覧を取得

3. CursorでMCP設定

mcp.jsonに以下のように設定する
CLIENT_ID, CLIENT_SECRETは先ほど取得したものを設定する

{
  "mcpServers": {
    "spotify": {
      "command": "node",
      "args": ["/Users/xxxxxx/project/spotify-mcp/dist/index.js"],
      "env": {
        "SPOTIFY_CLIENT_ID": "xxxxxxxxxx",
        "SPOTIFY_CLIENT_SECRET": "xxxxxxxxxxxxxxx"
      }
    }
  }
}

4. 実際に検証

以下のようにちゃんとspotify mcpで設定したapiが実行されて情報が取得できました。

最後に

すでにspotify-mcpは有志で作られていたのですが、
やっぱりセキュリティ面怖いので今回は自作しました。
今後ちょっと改造して先に挙げた通り公開しよかなと思っております。
バイブコーディングすれば案外一発で誰でも簡単にできちゃうかも。