Documentation Index Fetch the complete documentation index at: https://docs.atxp.ai/llms.txt
Use this file to discover all available pages before exploring further.
Overview
Cloudflare Agents provides a platform for building AI-powered chat agents that run on Cloudflare’s edge network. By combining Cloudflare Agents with ATXP’s pay-per-use MCP tools, you can create AI applications that can generate images, search the web, browse websites, and more - all with usage-based pricing and seamless deployment.
This guide will show you how to integrate ATXP’s MCP tools with Cloudflare Agents to build a chat agent with image generation capabilities. You can find a full working example at atxp-cloudflare-agent-example .
Setup
Create ATXP account
If you don’t have an ATXP account yet, create one and copy your ATXP connection string. It should look something like this:
https://accounts.atxp.ai?connection_token = <random_string>
If you’ve already created an ATXP account, you can visit the ATXP account dashboard to get your connection string.
Create your project
Create a new Cloudflare Agent project: npx create-cloudflare@latest --template cloudflare/agents-starter my-atxp-agent
cd my-atxp-agent
Install ATXP client
Add the ATXP client to your project: The @atxp/client package provides the MCP transport that allows you to use ATXP’s MCP tools in your Cloudflare Agent.
Configure environment
Create a .dev.vars file in your project root: OPENAI_API_KEY = your_openai_api_key_here
ATXP_CONNECTION_STRING = https://accounts.atxp.ai? connection_token =< your_token >
Never commit your .dev.vars file to version control. Make sure it’s included in your .gitignore file.
Basic integration
Here’s how to add ATXP image generation to your Cloudflare Agent:
src/tools/imageGeneration.ts
src/tools.ts
src/server.ts
import { tool } from "agents" ;
import { z } from "zod" ;
import { ATXPAccount , buildStreamableTransport , createMCPClient } from "@atxp/client" ;
export const generateImage = tool ({
description: "Generate an image from a text prompt using ATXP" ,
parameters: z . object ({
prompt: z . string (). describe ( "The text prompt to generate an image from" ),
}),
execute : async ({ prompt }, { env , agent }) => {
try {
// Initialize ATXP account
const account = new ATXPAccount ( env . ATXP_CONNECTION_STRING );
// Create transport for ATXP image server
const transport = buildStreamableTransport ({
mcpServer: 'https://image.mcp.atxp.ai' ,
account ,
});
// Create MCP client
const client = await createMCPClient ({ transport });
// Generate the image
const result = await client . callTool ( 'generate_image' , {
prompt: prompt ,
size: '1024x1024'
});
if ( result . toolResult . content [ 0 ]. type === 'text' ) {
const response = JSON . parse ( result . toolResult . content [ 0 ]. text );
if ( response . image_url ) {
return `Image generated successfully! Here's your image: ` ;
} else {
return `Image generation started. Task ID: ${ response . task_id } ` ;
}
}
return "Image generation request submitted successfully." ;
} catch ( error ) {
console . error ( 'Image generation error:' , error );
return `Failed to generate image: ${ error . message } ` ;
}
},
});
Deploy your agent
Set production secrets
Configure your production environment variables: wrangler secret put OPENAI_API_KEY
wrangler secret put ATXP_CONNECTION_STRING
Deploy to Cloudflare
Deploy your agent: Your agent will be available at your Cloudflare Workers subdomain.
Test your agent
Once deployed, you can test your agent by asking it to generate images:
User: "Generate an image of a sunset over mountains"
Agent: "I'll generate an image of a sunset over mountains for you..."
[Image appears in the chat when complete]
Next steps
Now that you have a working Cloudflare Agent with ATXP integration, you can explore more:
MCP server documentation Learn about other ATXP tools like web search and file storage.
Build a CLI agent Try building a CLI agent.