Tutorial

How to useMCPs for custom actions

HyperAgent follows the standard format used by MCP clients like Claude Desktop, Cursor, Windsurf and others.

Additionally, HyperAgent supports both the SSE and STDIO MCP servers

Setting up your MCP

Here's an example that performs reverse geocoding on a location, and then gets me the news for that city.

This MCP uses the STDIO protocol to communicate between the server and client.

import HyperAgent from "@hyperbrowser/agent";

...
async function main(llm){
  const agent = new HyperAgent({
    llm: llm,
  });
  
  await agent.initializeMCPClient({
    servers: [
      {
        command: "npx",
        args: ["-y", "@modelcontextprotocol/server-google-maps"],
        env: {
          GOOGLE_MAPS_API_KEY: process.env.GOOGLE_MAPS_API_KEY,
        },
      },
    ],
  });
  
  const TASK = "Get me the city corresponding to the location 40.7128° N, 74.0060° W. Then get me news for that place."
  
  const result = await agent.executeTask(TASK)
  
  await agent.closeAgent();
  console.log(chalk.green.bold("\nResult:"));
  console.log(chalk.white(result.output));
}

To configure it, we have to

• Create a new agent with HyperAgent

• Call the initializeMCPClient method on the agent

• For stdio, specify the

  • command: The base command to execute. In this case, we're running the npx command

  • args: Array of parameters to pass to the command.

  • env: Object containing all the environment variables we want to set.

• For sse, specify:

  • sseUrl: The URL to the remote MCP server

  • sseHeaders: Any associated headers required by the remote MCP server.

Other configuration options

• includeTools: Optional array of strings specifying the tools that should be included.

• excludeTools: Optional array of strings specifying the tools that should be excluded.