Vercel AI SDK + Scrapeless: Web Tools for Your Agents via MCP

TL;DR:

• The Vercel AI SDK connects to the Scrapeless MCP Server with createMCPClient from @ai-sdk/mcp, passing the endpoint and the x-api-token header in the transport config.
• await client.tools() returns all 21 tools — scrape_markdown, scrape_html, google_search, google_trends, scrape_screenshot, and a 16-tool browser_* set — keyed by name, ready to spread into generateText.
• In AI SDK 5 and later the MCP client lives in its own package: import createMCPClient from @ai-sdk/mcp, not experimental_createMCPClient from ai, which was removed.
• Each tool exposes an execute method, so you can call tools.scrape_markdown.execute({ url }) directly and read the Markdown back before a model is involved — no model key needed to load or call tools.
• Only the generateText step needs a model-provider key, because that is where the model decides which tools to call.
• Start on the Scrapeless free plan and give your TypeScript agents real web tools.

The Vercel AI SDK is the standard toolkit for building AI apps in TypeScript, and a model inside it can only act through the tools you pass it. Nothing in the base SDK reaches the live web. The Model Context Protocol closes that gap: point the SDK's MCP client at a server and every tool that server exposes becomes an AI SDK tool you can spread straight into generateText or streamText.

This guide connects the AI SDK to the Scrapeless MCP Server, loads its 21 tools, calls one for real, and then hands the set to a model — verified against the live endpoint. The only step that needs a model-provider key is the generation call, and this post marks exactly where that line sits.

What the Scrapeless MCP Server gives an agent

The Scrapeless MCP Server exposes web-scraping and browser tools an agent can call directly, so the scraping layer is not something you build or host. One connection serves 21 tools: scrape_markdown and scrape_html for page content, google_search and google_trends for search data, scrape_screenshot for captures, and a 16-tool browser_* set that drives a cloud browser through clicks, typing, scrolling, and waits.

The browser_* tools run on the Scrapeless cloud browser, so a model can navigate an interactive page and read what actually renders without a browser on your machine. For the protocol itself, What is MCP is the explainer, and LangChain + Scrapeless MCP wires the same server into a Python stack.

Prerequisites

• Node.js 22 or later.
• A Scrapeless API key from the dashboard, exported as SCRAPELESS_API_KEY.
• A model-provider key such as OPENAI_API_KEY only for the generation step. Loading and calling the tools does not need one.

Install

Install the AI SDK core and the MCP client package.

npm install ai@7.0.34 @ai-sdk/mcp@2.0.16

Set your Scrapeless key in the shell, and keep the placeholder out of your source.

export SCRAPELESS_API_KEY="sk_your_key_here"

Connect and load the tools

createMCPClient opens the connection. The http transport carries the endpoint and the headers, and client.tools() runs the handshake and returns the tools keyed by name.

import { createMCPClient } from "@ai-sdk/mcp";

const client = await createMCPClient({
  transport: {
    type: "http",
    url: "https://api.scrapeless.com/mcp",
    headers: { "x-api-token": process.env.SCRAPELESS_API_KEY! },
  },
});

const tools = await client.tools();
const names = Object.keys(tools).sort();
console.log("tool count:", names.length);
console.log("tools:", names.join(", "));

await client.close();

The live server returns 21 tools, loaded with only the Scrapeless key set.

tool count: 21
tools: browser_click, browser_close, browser_create, browser_get_html, browser_get_text, browser_go_back, browser_go_forward, browser_goto, browser_press_key, browser_screenshot, browser_scroll, browser_scroll_to, browser_snapshot, browser_type, browser_wait, browser_wait_for, google_search, google_trends, scrape_html, scrape_markdown, scrape_screenshot

The transport and message layer follow the Model Context Protocol specification, which rides on the JSON-RPC 2.0 specification. The AI SDK also accepts a transport instance for stdio or SSE servers; the Scrapeless server is a hosted HTTP endpoint, so the http transport is the right one here.

Call a tool directly

Each entry in the returned object is a full AI SDK tool with an execute method, so you can call one yourself before any model is wired in. execute takes the arguments and a call context, and returns a result whose content is a list of blocks.

import { createMCPClient } from "@ai-sdk/mcp";

const client = await createMCPClient({
  transport: {
    type: "http",
    url: "https://api.scrapeless.com/mcp",
    headers: { "x-api-token": process.env.SCRAPELESS_API_KEY! },
  },
});

const tools = await client.tools();
const result = await tools.scrape_markdown.execute(
  { url: "https://quotes.toscrape.com/" },
  { toolCallId: "call_1", messages: [] },
);
const text = result.content
  .filter((block: { type: string }) => block.type === "text")
  .map((block: { text: string }) => block.text)
  .join("");
console.log("markdown chars:", text.length);
console.log("contains a quote:", text.includes("Einstein"));

await client.close();

The call returns the page as Markdown, and the content check confirms real text came back.

markdown chars: 4308
contains a quote: true

That is the shape a model gets back from the same tool: page content it can reason over. The AI SDK MCP tools documentation covers the transport options and the client.close() you should call when the work is done.

Let a model call the tools

Spread the tools into generateText and the model calls them when the task needs them. Multi-step tool use needs a stop condition — stepCountIs lets the model call a tool, read the result, and answer. This is the step that needs a model-provider key.

Note: this block needs the @ai-sdk/openai provider package and an OPENAI_API_KEY, neither of which is set here. Loading the 21 tools and the direct scrape_markdown call above run without them. The block is shown with its exact shape; only the model round-trip is a prerequisite gap.

import { createMCPClient } from "@ai-sdk/mcp";
import { generateText, stepCountIs } from "ai";
import { openai } from "@ai-sdk/openai";

const client = await createMCPClient({
  transport: {
    type: "http",
    url: "https://api.scrapeless.com/mcp",
    headers: { "x-api-token": process.env.SCRAPELESS_API_KEY! },
  },
});

const tools = await client.tools();
const { text } = await generateText({
  model: openai("gpt-4o"),
  tools,
  stopWhen: stepCountIs(5),
  prompt:
    "Use scrape_markdown to fetch https://quotes.toscrape.com/ and list the first three quotes with authors.",
});
console.log(text);

await client.close();

At run time the model reads the prompt, calls scrape_markdown with the URL, receives the Markdown the direct call already returned, and writes the answer. The tools are the same objects whether the model calls them or you do.

Conclusion

The Vercel AI SDK plus the Scrapeless MCP Server is a short path from a bare model to one that reads the live web. createMCPClient opens the connection, client.tools() returns all 21 tools, execute proves one works, and spreading tools into generateText hands the set to the model. Only the generation step needs a model key, so you can wire and test the whole tool surface first. Start from the scripts above, scope the tools to what the task needs, and let the model drive.

Create a free Scrapeless account to get an API key, and check Scrapeless pricing when you plan a recurring agent.

FAQ

Q: Does the Vercel AI SDK need a model key to load MCP tools?

No. createMCPClient runs the handshake and client.tools() returns the tools with only the Scrapeless API key set, and each tool's execute method calls it directly. A model-provider key is required only when you spread the tools into generateText or streamText, because that is when the model decides which tools to call.

Q: Which import do I use — createMCPClient or experimental_createMCPClient?

Use createMCPClient from @ai-sdk/mcp. Older tutorials import experimental_createMCPClient from the ai package; the MCP client moved into its own @ai-sdk/mcp package, and the ai re-export was removed. If an example fails to resolve the import, this is usually why.

Q: How do I call one MCP tool without a model?

Call await client.tools() and then tools.<name>.execute(args, { toolCallId, messages: [] }). It returns a result whose content is a list of blocks; read the text off the text blocks. This is the fastest way to confirm the connection and inspect a tool's output before wiring in a model.

Q: How do I connect to a local MCP server instead?

Pass a transport instance for stdio or SSE instead of the http transport object, then call client.tools() the same way. The Scrapeless MCP Server is a hosted HTTP endpoint, so this guide uses the http transport.

Q: Is scraping through the tools bound by the target's rules?

Yes. The tools fetch public pages, and you remain responsible for honoring each target's terms and its Robots Exclusion Protocol directives. Keep the volume bounded, the data public, and the model scoped to the tools the task actually needs.