> ## Documentation Index
> Fetch the complete documentation index at: https://docs.civic.com/llms.txt
> Use this file to discover all available pages before exploring further.

# MCP Hub

> Implementation details and integration guides for MCP Hub

## API Endpoint

The MCP Hub endpoint is:

```
https://app.civic.com/hub/mcp
```

## Authentication

The MCP Hub supports multiple authentication methods:

### Bearer Token (Civic Auth)

For user-facing applications using Civic Auth OAuth2 flow:

```javascript theme={null}
headers: {
  'Authorization': `Bearer ${accessToken}`
}
```

### API Key

For server-to-server communication:

```javascript theme={null}
headers: {
  'Authorization': `Bearer ${process.env.MCP_API_KEY}`
}
```

[Contact us](https://civickey.typeform.com/to/uVH7CWJ5) to obtain an API key.

## Integration Methods

### 1. Claude Desktop Integration

Connect Claude Desktop to Civic MCP Hub using the Hub Bridge.

#### Installation (MacOS)

<Tabs>
  <Tab title="npm">
    ```bash theme={null}
      npx @civic/hub-bridge install claude-desktop
    ```
  </Tab>

  <Tab title="homebrew">
    ```bash theme={null}
    brew tap civicteam/tap
    brew install hub-bridge
    hub-bridge install claude-desktop
    ```

    <Note>ARM (M1, M2...) infrastructure supported only. For x86 builds, [contact us](https://civickey.typeform.com/to/uVH7CWJ5)</Note>
  </Tab>
</Tabs>

#### Manual Configuration (PC, Linux etc)

Add the following to your Claude Desktop configuration:

<Tabs>
  <Tab title="macOS">
    ```bash theme={null}
    open "~/Library/Application Support/Claude/claude_desktop_config.json"
    ```
  </Tab>

  <Tab title="Windows">
    ```powershell theme={null}
    notepad %APPDATA%\Claude\claude_desktop_config.json
    ```

    If you need other builds, [contact us](https://civickey.typeform.com/to/uVH7CWJ5).
  </Tab>

  <Tab title="Linux">
    ```bash theme={null}
    open ~/.config/Claude/claude_desktop_config.json
    ```

    If you need other builds, [contact us](https://civickey.typeform.com/to/uVH7CWJ5).
  </Tab>
</Tabs>

Add this configuration:

```json theme={null}
{
  "mcpServers": {
    "civic": {
      "command": "npx",
      "args": ["@civic/hub-bridge"]
    }
  }
}
```

### 2. Vercel AI SDK Integration

Use the MCP Hub with Vercel AI SDK for building AI applications.

```typescript theme={null}
import { StreamableHTTPClientTransport } from '@modelcontextprotocol/sdk/client/streamableHttp.js';
import { Client } from '@modelcontextprotocol/sdk/client/index.js';
import { getTokens } from "@civic/auth/nextjs";

const createMCPClient = async () => {
  // Get access token
  const { accessToken } = await getTokens();
  
  if (!accessToken) {
    throw new Error('No access token available. User needs to authenticate.');
  }

  // Create transport with authentication
  const transport = new StreamableHTTPClientTransport(
    'https://app.civic.com/hub/mcp',
    {
      requestInit: {
        headers: {
          Authorization: `Bearer ${accessToken}`,
          'Content-Type': 'application/json'
        }
      }
    }
  );

  // Initialize MCP client
  const client = new Client({
    name: 'my-app',
    version: '1.0.0'
  }, {
    capabilities: {}
  });

  await client.connect(transport);
  return client;
};
```

For complete Vercel AI SDK integration examples, see our [detailed Vercel AI SDK guide](/civic/recipes/vercel-ai-sdk).

### 3. n8n Workflow Integration

Build AI-powered workflows with n8n and Civic Labs.

#### Prerequisites

1. [Import the example workflow](https://github.com/civicteam/docs.civic.com/blob/main/labs/n8n_sample_api-key-flow.json) into your n8n instance
2. Configure your AWS Bedrock credentials in n8n (or use another AI model)
3. [Contact us](https://civickey.typeform.com/to/uVH7CWJ5) to obtain an API key for the MCP Hub

#### Setup

Add your MCP Hub API key as a Header Auth credential in n8n:

```json theme={null}
{
  "name": "Authorization",
  "value": "Bearer YOUR_API_KEY"
}
```

The workflow demonstrates:

* Calling MCP Hub API endpoints
* Integrating with AI models
* Building conversational agents with MCP tools
* Error handling and retries

### 4. Direct API Integration

For custom integrations, use the MCP Hub API directly:

```javascript theme={null}
// List available MCP servers
const response = await fetch('https://app.civic.com/hub/mcp', {
  method: 'POST',
  headers: {
    'Authorization': `Bearer ${apiKey}`,
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    jsonrpc: '2.0',
    method: 'tools/list',
    params: {},
    id: 1,
  }),
});

const result = await response.json();
console.log('Available tools:', result.result.tools);
```

## Additional Resources

* [MCP Protocol Documentation](https://modelcontextprotocol.io)
* [API Reference](https://civickey.typeform.com/to/uVH7CWJ5) (request access)

[Contact us](https://civickey.typeform.com/to/uVH7CWJ5) for detailed API documentation and support.