How to integrate Spotify MCP with Vercel AI SDK

Framework Integration Gradient
Spotify Logo
Vercel AI SDK Logo
divider

Introduction

This guide walks you through connecting Spotify to Vercel AI SDK using the Composio tool router. By the end, you'll have a working Spotify agent that can add these songs to my running playlist, check if i follow taylor swift, see if my friends follow my playlist, verify if i saved this album already through natural language commands.

This guide will help you understand how to give your Vercel AI SDK agent real control over a Spotify account through Composio's Spotify MCP server.

Before we dive in, let's take a quick look at the key ideas and tools involved.

TL;DR

Here's what you'll learn:
  • How to set up and configure a Vercel AI SDK agent with Spotify integration
  • Using Composio's Tool Router to dynamically load and access Spotify tools
  • Creating an MCP client connection using HTTP transport
  • Building an interactive CLI chat interface with conversation history management
  • Handling tool calls and results within the Vercel AI SDK framework

What is Vercel AI SDK?

The Vercel AI SDK is a TypeScript library for building AI-powered applications. It provides tools for creating agents that can use external services and maintain conversation state.

Key features include:

  • streamText: Core function for streaming responses with real-time tool support
  • MCP Client: Built-in support for Model Context Protocol
  • Step Counting: Control multi-step tool execution
  • OpenAI Provider: Native integration with OpenAI models

What is the Spotify MCP server, and what's possible with it?

The Spotify MCP server is an implementation of the Model Context Protocol that connects your AI agent and assistants like Claude, Cursor, etc directly to your Spotify account. It provides structured and secure access to your playlists, music library, and playback controls, so your agent can perform actions like managing playlists, adding songs to your queue, checking saved tracks, and updating playlist details on your behalf.

  • Personalized playlist management: Let your agent add songs or podcasts to playlists, change playlist details like name or privacy settings, and keep your music organized just how you like it.
  • Playback control and queue updates: Direct your agent to add tracks or episodes to your current playback queue, helping you line up the perfect listening experience without lifting a finger.
  • Library checks and smart recommendations: Have your agent check if specific tracks, albums, shows, or audiobooks are already saved in your Spotify library, so you never add duplicates or miss out on favorites.
  • Social and follower insights: Ask your agent to check whether you or others are following certain artists, users, or playlists, making it easy to stay connected to your musical community.
  • Podcast and show management: Let your agent verify which podcast episodes or shows are in your library, ensuring you’re always up to date with your latest audio interests.

Supported Tools & Triggers

Tools
Triggers
Add items to playlistAdd one or more items to a user's playlist.
Add item to playback queueAdd an item to the end of the user's current playback queue.
Change playlist detailsChange a playlist's name and public/private state.
Check if user follows artists or usersCheck to see if the current user is following one or more artists or other spotify users.
Check if users follow playlistCheck to see if one or more spotify users are following a specified playlist.
Check user s saved albumsCheck if one or more albums is already saved in the current spotify user's 'your music' library.
Check user s saved audiobooksCheck if one or more audiobooks are already saved in the current spotify user's library.
Check user s saved episodesThis spotify api endpoint (in beta) checks if episodes are saved in a user's library.
Check user s saved showsCheck if one or more shows is already saved in the current spotify user's library.
Check user s saved tracksCheck if one or more tracks is already saved in the current spotify user's 'your music' library.
Create playlistCreate a playlist for a spotify user.
Follow artists or usersAdd the current user as a follower of one or more artists or other spotify users.
Follow playlistAdd the current user as a follower of a playlist.
Get a chapterGet spotify catalog information for a single audiobook chapter.
Get albumGet spotify catalog information for a single album.
Get album tracksGet spotify catalog information about an album’s tracks.
Get an audiobookGet spotify catalog information for a single audiobook.
Get artistGet spotify catalog information for a single artist identified by their unique spotify id.
Get artist s albumsGet spotify catalog information about an artist's albums.
Get artist s related artistsGet spotify catalog information about artists similar to a given artist.
Get artist s top tracksGet spotify catalog information about an artist's top tracks by country.
Get audiobook chaptersGet spotify catalog information about an audiobook's chapters.
Get available devicesGet information about a user’s available spotify connect devices.
Get available genre seedsRetrieve a list of available genres seed parameter values for [recommendations](/documentation/web-api/reference/get-recommendations).
Get available marketsGet the list of markets where spotify is available.
Get category s playlistsGet a list of spotify playlists tagged with a particular category.
Get currently playing trackGet the object currently being played on the user's spotify account.
Get current user s playlistsGet a list of the playlists owned or followed by the current spotify user.
Get current user s profileGet detailed profile information about the current user (including the current user's username).
Get episodeGet spotify catalog information for a single episode identified by its unique spotify id.
Get featured playlistsGet a list of spotify featured playlists (shown, for example, on a spotify player's 'browse' tab).
Get followed artistsGet the current user's followed artists.
Get new releasesGet a list of new album releases featured in spotify (shown, for example, on a spotify player’s “browse” tab).
Get playback stateGet information about the user’s current playback state, including track or episode, progress, and active device.
Get playlistGet a playlist owned by a spotify user.
Get playlist cover imageGet the current image associated with a specific playlist.
Get playlist itemsGet full details of the items of a playlist owned by a spotify user.
Get recently played tracksGet tracks from the current user's recently played tracks.
Get recommendationsRecommendations are based on seed entity data, matched with similar artists and tracks.
Get several albumsGet spotify catalog information for multiple albums identified by their spotify ids.
Get several artistsGet spotify catalog information for several artists based on their spotify ids.
Get several audiobooksGet spotify catalog information for several audiobooks identified by their spotify ids.
Get several browse categoriesGet a list of categories used to tag items in spotify (on, for example, the spotify player’s “browse” tab).
Get several chaptersGet spotify catalog information for several audiobook chapters identified by their spotify ids.
Get several episodesGet spotify catalog information for several episodes based on their spotify ids.
Get several showsGet spotify catalog information for several shows based on their spotify ids.
Get several tracksGet spotify catalog information for multiple tracks based on their spotify ids.
Get several tracks audio featuresGet audio features for multiple tracks based on their spotify ids.
Get showGet spotify catalog information for a single show identified by its unique spotify id.
Get show episodesGet spotify catalog information about an show’s episodes.
Get single browse categoryGet a single category used to tag items in spotify (on, for example, the spotify player’s “browse” tab).
Get the user s queueGet the list of objects that make up the user's queue.
Get trackGet spotify catalog information for a single track identified by its unique spotify id.
Get track s audio analysisGet a low-level audio analysis for a track in the spotify catalog.
Get track s audio featuresGet audio feature information for a single track identified by its unique spotify id.
Get user s playlistsGet a list of the playlists owned or followed by a spotify user.
Get user s profileGet public profile information about a spotify user.
Get user s saved albumsGet a list of the albums saved in the current spotify user's 'your music' library.
Get user s saved audiobooksGet a list of the audiobooks saved in the current spotify user's 'your music' library.
Get user s saved episodesThis api endpoint, currently in beta, allows retrieving episodes saved in a spotify user's library.
Get user s saved showsGet a list of shows saved in the current spotify user's library.
Get user s saved tracksGet a list of the songs saved in the current spotify user's 'your music' library.
Get user s top artistsGet the current user's top artists based on calculated affinity.
Get user s top tracksGet the current user's top tracks based on calculated affinity.
Pause playbackPause playback on the user's account.
Remove playlist itemsRemove one or more items from a user's playlist.
Remove users saved albumsRemove one or more albums from the current user's 'your music' library.
Remove user s saved audiobooksRemove one or more audiobooks from the spotify user's library.
Remove user s saved episodesThis api endpoint, currently in beta, allows for the removal of episodes from a user's library and may change without notice.
Remove user s saved showsDelete one or more shows from current spotify user's library.
Remove user s saved tracksRemove one or more tracks from the current user's 'your music' library.
Save albums for current userSave one or more albums to the current user's 'your music' library.
Save audiobooks for current userSave one or more audiobooks to the current spotify user's library.
Save episodes for current userThis api endpoint, currently in beta, allows saving episodes to a user's library.
Save shows for current userSave one or more shows to current spotify user's library.
Save tracks for current userSave one or more tracks to the current user's 'your music' library.
Search for itemGet spotify catalog information about albums, artists, playlists, tracks, shows, episodes or audiobooks that match a keyword string.
Seek to positionSeeks to the given position in the user’s currently playing track.
Set playback volumeSet the volume for the user’s current playback device.
Set repeat modeSet the repeat mode for the user's playback.
Skip to nextSkips to next track in the user’s queue.
Skip to previousSkips to previous track in the user’s queue.
Start resume playbackStart a new context or resume current playback on the user's active device.
Toggle playback shuffleToggle shuffle on or off for user’s playback.
Transfer playbackTransfer playback to a new device and optionally begin playback.
Unfollow artists or usersRemove the current user as a follower of one or more artists or other spotify users.
Unfollow playlistRemove the current user as a follower of a playlist.
Update playlist itemsTo modify a playlist, use rearrange (with `range start`, `insert before`, `range length`, `snapshot id`) or replace items (`uris` in body/query).

What is the Composio tool router, and how does it fit here?

What is Tool Router?

Composio's Tool Router helps agents find the right tools for a task at runtime. You can plug in multiple toolkits (like Gmail, HubSpot, and GitHub), and the agent will identify the relevant app and action to complete multi-step workflows. This can reduce token usage and improve the reliability of tool calls. Read more here: Getting started with Tool Router

The tool router generates a secure MCP URL that your agents can access to perform actions.

How the Tool Router works

The Tool Router follows a three-phase workflow:

  1. Discovery: Searches for tools matching your task and returns relevant toolkits with their details.
  2. Authentication: Checks for active connections. If missing, creates an auth config and returns a connection URL via Auth Link.
  3. Execution: Executes the action using the authenticated connection.

Step-by-step Guide

Prerequisites

Before you begin, make sure you have:
  • Node.js and npm installed
  • A Composio account with API key
  • An OpenAI API key

Getting API Keys for OpenAI and Composio

OpenAI API Key
  • Go to the OpenAI dashboard and create an API key. You'll need credits to use the models, or you can connect to another model provider.
  • Keep the API key safe.
Composio API Key
  • Log in to the Composio dashboard.
  • Navigate to your API settings and generate a new API key.
  • Store this key securely as you'll need it for authentication.

Install required dependencies

bash
npm install @ai-sdk/openai @ai-sdk/mcp @composio/core ai dotenv

First, install the necessary packages for your project.

What you're installing:

  • @ai-sdk/openai: Vercel AI SDK's OpenAI provider
  • @ai-sdk/mcp: MCP client for Vercel AI SDK
  • @composio/core: Composio SDK for tool integration
  • ai: Core Vercel AI SDK
  • dotenv: Environment variable management

Set up environment variables

bash
OPENAI_API_KEY=your_openai_api_key_here
COMPOSIO_API_KEY=your_composio_api_key_here
COMPOSIO_USER_ID=your_user_id_here

Create a .env file in your project root.

What's needed:

  • OPENAI_API_KEY: Your OpenAI API key for GPT model access
  • COMPOSIO_API_KEY: Your Composio API key for tool access
  • COMPOSIO_USER_ID: A unique identifier for the user session

Import required modules and validate environment

typescript
import "dotenv/config";
import { openai } from "@ai-sdk/openai";
import { Composio } from "@composio/core";
import * as readline from "readline";
import { streamText, type ModelMessage, stepCountIs } from "ai";
import { experimental_createMCPClient as createMCPClient } from "@ai-sdk/mcp";

const composioAPIKey = process.env.COMPOSIO_API_KEY;
const composioUserID = process.env.COMPOSIO_USER_ID;

if (!process.env.OPENAI_API_KEY) throw new Error("OPENAI_API_KEY is not set");
if (!composioAPIKey) throw new Error("COMPOSIO_API_KEY is not set");
if (!composioUserID) throw new Error("COMPOSIO_USER_ID is not set");

const composio = new Composio({
  apiKey: composioAPIKey,
});
What's happening:
  • We're importing all necessary libraries including Vercel AI SDK's OpenAI provider and Composio
  • The dotenv/config import automatically loads environment variables
  • The MCP client import enables connection to Composio's tool server

Create Tool Router session and initialize MCP client

typescript
async function main() {
  // Create a tool router session for the user
  const { session } = await composio.create(composioUserID!, {
    toolkits: ["spotify"],
  });

  const mcpUrl = session.mcp.url;
What's happening:
  • We're creating a Tool Router session that gives your agent access to Spotify tools
  • The create method takes the user ID and specifies which toolkits should be available
  • The returned mcp object contains the URL and authentication headers needed to connect to the MCP server
  • This session provides access to all Spotify-related tools through the MCP protocol

Connect to MCP server and retrieve tools

typescript
const mcpClient = await createMCPClient({
  transport: {
    type: "http",
    url: mcpUrl,
    headers: session.mcp.headers, // Authentication headers for the Composio MCP server
  },
});

const tools = await mcpClient.tools();
What's happening:
  • We're creating an MCP client that connects to our Composio Tool Router session via HTTP
  • The mcp.url provides the endpoint, and mcp.headers contains authentication credentials
  • The type: "http" is important - Composio requires HTTP transport
  • tools() retrieves all available Spotify tools that the agent can use

Initialize conversation and CLI interface

typescript
let messages: ModelMessage[] = [];

console.log("Chat started! Type 'exit' or 'quit' to end the conversation.\n");
console.log(
  "Ask any questions related to spotify, like summarize my last 5 emails, send an email, etc... :)))\n",
);

const rl = readline.createInterface({
  input: process.stdin,
  output: process.stdout,
  prompt: "> ",
});

rl.prompt();
What's happening:
  • We initialize an empty messages array to maintain conversation history
  • A readline interface is created to accept user input from the command line
  • Instructions are displayed to guide the user on how to interact with the agent

Handle user input and stream responses with real-time tool feedback

typescript
rl.on("line", async (userInput: string) => {
  const trimmedInput = userInput.trim();

  if (["exit", "quit", "bye"].includes(trimmedInput.toLowerCase())) {
    console.log("\nGoodbye!");
    rl.close();
    process.exit(0);
  }

  if (!trimmedInput) {
    rl.prompt();
    return;
  }

  messages.push({ role: "user", content: trimmedInput });
  console.log("\nAgent is thinking...\n");

  try {
    const stream = streamText({
      model: openai("gpt-5"),
      messages,
      tools,
      toolChoice: "auto",
      stopWhen: stepCountIs(10),
      onStepFinish: (step) => {
        for (const toolCall of step.toolCalls) {
          console.log(`[Using tool: ${toolCall.toolName}]`);
          }
          if (step.toolCalls.length > 0) {
            console.log(""); // Add space after tool calls
          }
        },
      });

      for await (const chunk of stream.textStream) {
        process.stdout.write(chunk);
      }

      console.log("\n\n---\n");

      // Get final result for message history
      const response = await stream.response;
      if (response?.messages?.length) {
        messages.push(...response.messages);
      }
    } catch (error) {
      console.error("\nAn error occurred while talking to the agent:");
      console.error(error);
      console.log(
        "\nYou can try again or restart the app if it keeps happening.\n",
      );
    } finally {
      rl.prompt();
    }
  });

  rl.on("close", async () => {
    await mcpClient.close();
    console.log("\n👋 Session ended.");
    process.exit(0);
  });
}

main().catch((err) => {
  console.error("Fatal error:", err);
  process.exit(1);
});
What's happening:
  • We use streamText instead of generateText to stream responses in real-time
  • toolChoice: "auto" allows the model to decide when to use Spotify tools
  • stopWhen: stepCountIs(10) allows up to 10 steps for complex multi-tool operations
  • onStepFinish callback displays which tools are being used in real-time
  • We iterate through the text stream to create a typewriter effect as the agent responds
  • The complete response is added to conversation history to maintain context
  • Errors are caught and displayed with helpful retry suggestions

Complete Code

Here's the complete code to get you started with Spotify and Vercel AI SDK:

typescript
import "dotenv/config";
import { openai } from "@ai-sdk/openai";
import { Composio } from "@composio/core";
import * as readline from "readline";
import { streamText, type ModelMessage, stepCountIs } from "ai";
import { experimental_createMCPClient as createMCPClient } from "@ai-sdk/mcp";

const composioAPIKey = process.env.COMPOSIO_API_KEY;
const composioUserID = process.env.COMPOSIO_USER_ID;

if (!process.env.OPENAI_API_KEY) throw new Error("OPENAI_API_KEY is not set");
if (!composioAPIKey) throw new Error("COMPOSIO_API_KEY is not set");
if (!composioUserID) throw new Error("COMPOSIO_USER_ID is not set");

const composio = new Composio({
  apiKey: composioAPIKey,
});

async function main() {
  // Create a tool router session for the user
  const { session } = await composio.create(composioUserID!, {
    toolkits: ["spotify"],
  });

  const mcpUrl = session.mcp.url;

  const mcpClient = await createMCPClient({
    transport: {
      type: "http",
      url: mcpUrl,
      headers: session.mcp.headers, // Authentication headers for the Composio MCP server
    },
  });

  const tools = await mcpClient.tools();

  let messages: ModelMessage[] = [];

  console.log("Chat started! Type 'exit' or 'quit' to end the conversation.\n");
  console.log(
    "Ask any questions related to spotify, like summarize my last 5 emails, send an email, etc... :)))\n",
  );

  const rl = readline.createInterface({
    input: process.stdin,
    output: process.stdout,
    prompt: "> ",
  });

  rl.prompt();

  rl.on("line", async (userInput: string) => {
    const trimmedInput = userInput.trim();

    if (["exit", "quit", "bye"].includes(trimmedInput.toLowerCase())) {
      console.log("\nGoodbye!");
      rl.close();
      process.exit(0);
    }

    if (!trimmedInput) {
      rl.prompt();
      return;
    }

    messages.push({ role: "user", content: trimmedInput });
    console.log("\nAgent is thinking...\n");

    try {
      const stream = streamText({
        model: openai("gpt-5"),
        messages,
        tools,
        toolChoice: "auto",
        stopWhen: stepCountIs(10),
        onStepFinish: (step) => {
          for (const toolCall of step.toolCalls) {
            console.log(`[Using tool: ${toolCall.toolName}]`);
          }
          if (step.toolCalls.length > 0) {
            console.log(""); // Add space after tool calls
          }
        },
      });

      for await (const chunk of stream.textStream) {
        process.stdout.write(chunk);
      }

      console.log("\n\n---\n");

      // Get final result for message history
      const response = await stream.response;
      if (response?.messages?.length) {
        messages.push(...response.messages);
      }
    } catch (error) {
      console.error("\nAn error occurred while talking to the agent:");
      console.error(error);
      console.log(
        "\nYou can try again or restart the app if it keeps happening.\n",
      );
    } finally {
      rl.prompt();
    }
  });

  rl.on("close", async () => {
    await mcpClient.close();
    console.log("\n👋 Session ended.");
    process.exit(0);
  });
}

main().catch((err) => {
  console.error("Fatal error:", err);
  process.exit(1);
});

Conclusion

You've successfully built a Spotify agent using the Vercel AI SDK with streaming capabilities! This implementation provides a powerful foundation for building AI applications with natural language interfaces and real-time feedback.

Key features of this implementation:

  • Real-time streaming responses for a better user experience with typewriter effect
  • Live tool execution feedback showing which tools are being used as the agent works
  • Dynamic tool loading through Composio's Tool Router with secure authentication
  • Multi-step tool execution with configurable step limits (up to 10 steps)
  • Comprehensive error handling for robust agent execution
  • Conversation history maintenance for context-aware responses

You can extend this further by adding custom error handling, implementing specific business logic, or integrating additional Composio toolkits to create multi-app workflows.

How to build Spotify MCP Agent with another framework

FAQ

What are the differences in Tool Router MCP and Spotify MCP?

With a standalone Spotify MCP server, the agents and LLMs can only access a fixed set of Spotify tools tied to that server. However, with the Composio Tool Router, agents can dynamically load tools from Spotify and many other apps based on the task at hand, all through a single MCP endpoint.

Can I use Tool Router MCP with Vercel AI SDK?

Yes, you can. Vercel AI SDK fully supports MCP integration. You get structured tool calling, message history handling, and model orchestration while Tool Router takes care of discovering and serving the right Spotify tools.

Can I manage the permissions and scopes for Spotify while using Tool Router?

Yes, absolutely. You can configure which Spotify scopes and actions are allowed when connecting your account to Composio. You can also bring your own OAuth credentials or API configuration so you keep full control over what the agent can do.

How safe is my data with Composio Tool Router?

All sensitive data such as tokens, keys, and configuration is fully encrypted at rest and in transit. Composio is SOC 2 Type 2 compliant and follows strict security practices so your Spotify data and credentials are handled as safely as possible.

Used by agents from

Context
Letta
glean
HubSpot
Agent.ai
Altera
DataStax
Entelligence
Rolai
Context
Letta
glean
HubSpot
Agent.ai
Altera
DataStax
Entelligence
Rolai
Context
Letta
glean
HubSpot
Agent.ai
Altera
DataStax
Entelligence
Rolai

Never worry about agent reliability

We handle tool reliability, observability, and security so you never have to second-guess an agent action.