Inject tools from external MCP server

[mauricio-cantu]

Hey!!

First of all, congrats and thanks for this amazing SDK, I'm really enjoying building AI powered apps with it!

Now with MCP I was wondering if there's a way to connect to MCP providers (such as https://smithery.ai/ for example) and "inject" the tools from it into the SDK tools config. By what I've seen in the docs there's the experimental_createMCPClient but I couldn't understand How to integrate with external services, like Smithery (https://smithery.ai/).

Thought about this idea reading the docs for Spin.ai. They allow to map actions and tools from an external MCP and load them into the AI agent (check "Using your MCP with a SpinAI Agent" on this page). Check the createActionsFromMcpConfig method.

Any insights on this? If this is something already possible to be accomplished and I didn't notice I apologize. And please let me know How to do it 😂

Thanks!!

[RoversX]

same question.

[mauricio-cantu]

take a look at my comment below

[RoversX]

Thank you, I think I am still trying to figure out how to integrate the most basic mcp, I think I am not even close to that step.🤣 I am using groq as provider I don't know if it will work

[mauricio-cantu]

For those who want to do something similar I managed to do it with the following approach. In this example I'm using the GitHub management tool from Smithery (https://smithery.ai/server/@smithery-ai/github). Since I'm connecting directly through the createMCPClient from AI SDK, tools are already returned in a compatible way to inject into the model configuration. It wasn't working before for me probably because I was using the env prop, which looks buggy as this related issue (#5258)...

Of course it can be improved, we could read the tools from a JSON file for example and create each one dynamically...

const npmPrefix = execSync("npm prefix -g").toString().trim();
const npxPath = path.join(npmPrefix, "bin", "npx");

const mcpClient = await createMCPClient({
  transport: {
    type: "stdio",
    command: npxPath,
    args: [
      "-y",
      "@smithery/cli@latest",
      "run",
      "@smithery-ai/github",
      "--config",
      '{"githubPersonalAccessToken":"GH_PAT"}',
    ],
  },
});

const tools = await mcpClient.tools();

const response = await generateText({
  model: gemini1_5Pro,
  tools,
  maxSteps: 2,
  prompt: "Create a repo called 'Created by AI'",
});

// here the repo has been created successfully

[nirajrajgor]

Recently implemented a very similar usecase of creating mcp client and connecting using vercel ai sdk to llm.

1. For http streamable remote mcp server, you have to install mcp sdk.
   npm i @modelcontextprotocol/sdk

import { StreamableHTTPClientTransport } from "@modelcontextprotocol/sdk/client/streamableHttp.js";

const mcpClient = await createMCPClient({
  transport: new StreamableHTTPClientTransport(
    new URL(
      "https://server.smithery.ai/@upstash/context7-mcp/mcp?api_key=axaxaxscsnfjsnjdhbfj"
    )
  ),
});

const response = await generateText({
  model: openai('gpt-4o'),
  tools: await mcpClient.tools(), // use MCP tools
  prompt: 'Find products under $100',
});

2. For SSE remote mcp server, no need to install sdk as vercel ai sdk directly support that usecase.

const mcpClient = await createMCPClient({
  transport: {
    type: "sse",
    url: "https://mcp.context7.com/sse",
  },
});

const response = await generateText({
  model: openai('gpt-4o'),
  tools: await mcpClient.tools(), // use MCP tools
  prompt: 'Find products under $100',
});

[hireshBrem]

thanks for this! the docs on mcp for vercel is so confusing.

[ryzencool]

Does MCP Client support react native, I treid connect to mcp server and get tools, but failed