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

# Integration

> Mount the Inspector in a mcp-use or Hono application.

The Inspector is built-in local development tooling. `mcp-use` installs its prebuilt package, and `mcp-use dev` mounts it on the development listener at `/mcp/inspector`.

## Auto-Mounting with mcp-use

When using a generated `mcp-use` project, run `npm run dev`. The CLI loads the Inspector supplied by `mcp-use`, serves its bundled UI locally, and opens `/mcp/inspector`. No extra dependency or CDN is involved. Production stays Inspector-free by default; use `mcp-use start --with-inspector` to mount it on the built server's existing listener.

### Example

Generated and existing projects receive the Inspector through `mcp-use`. Add `@mcp-use/inspector` directly only when overriding the framework-supplied version or mounting it without `mcp-use`.

```typescript theme={null}
import { MCPServer } from "mcp-use/server";

const server = new MCPServer({
  name: "my-server",
  version: "1.0.0",
});

// Add your tools, resources, prompts...
server.tool(/* ... */);

export default server;
```

Then run `mcp-use dev`; the Inspector is available at `http://localhost:3000/mcp/inspector`. Use `--no-inspector` for a headless development run.

To inspect the production build locally, build once and opt in when starting it:

```bash theme={null}
mcp-use build
mcp-use start --with-inspector
```

This changes neither the build output nor its manifest. Treat a production Inspector as an internal tool: it can invoke MCP tools and proxy OAuth flows.

## Manual Integration

For custom development servers, `mountInspector()` from `@mcp-use/inspector` provides the complete local Inspector: packaged UI, proxy, OAuth BFF, and callbacks. It can register on Hono/Express or return a framework-neutral Fetch handler.

```typescript theme={null}
import { mountInspector } from "@mcp-use/inspector";

const inspect = mountInspector({
  basePath: "/mcp",
  autoConnectUrl: "http://localhost:3000/mcp",
});

const response = await inspect(request);
```

### Hono Integration

Mount the Inspector on a Hono application:

```typescript theme={null}
import { Hono } from "hono";
import { mountInspector } from "@mcp-use/inspector";

const app = new Hono();

// Your Hono routes
app.get("/api/health", (c) => {
  return c.json({ status: "ok" });
});

// Mount inspector at /mcp/inspector
mountInspector(app, { basePath: "/mcp" });

// Start server with your Hono adapter
export default app;
```

## Path Customization

`basePath` defaults to `/mcp`, so the Inspector lives at `/mcp/inspector`. Set `basePath: ''` for `/inspector`, or use another MCP prefix.

### Hono with Custom Path

```typescript theme={null}
import { Hono } from "hono";
import { mountInspector } from "@mcp-use/inspector";

const app = new Hono();

mountInspector(app, { basePath: "/debug" });
// Inspector now available at http://localhost:3000/debug/inspector
```

## Configuration Options

### `mountInspector` Options

Pass options only when the default mount behavior is not enough.

```typescript theme={null}
import { mountInspector } from "@mcp-use/inspector";

mountInspector(app, {
  basePath: "/mcp",
  autoConnectUrl: "http://localhost:3000/mcp",
  sandboxOrigin: "https://sandbox.example.com",
});
```

| Option                    | Type             | Default                             | Description                                             |
| ------------------------- | ---------------- | ----------------------------------- | ------------------------------------------------------- |
| `basePath`                | `string`         | `'/mcp'`                            | MCP prefix; Inspector mounts at `${basePath}/inspector` |
| `autoConnectUrl`          | `string \| null` | Current request origin + `basePath` | MCP server URL to auto-connect on load; `null` disables |
| `devMode`                 | `boolean`        | `true`                              | Enables same-origin sandbox for MCP Apps widgets        |
| `sandboxOrigin`           | `string \| null` | `undefined`                         | Override the sandbox origin for MCP Apps widgets        |
| `oauthProxyAllowLoopback` | `boolean`        | `true`                              | Permit local proxy/OAuth access to loopback targets     |

## Protect mounted Inspector routes

The Inspector can call tools, read resources, and inspect prompts on any connected server. Keep it in local development. If a custom integration exposes it on a network, disable loopback proxying and put it behind the same access controls as other internal tools.

Each mounted Inspector also applies process-local limits of 120 proxy/OAuth
requests and 600 asset requests per minute. Exhausted routes return `429 Too
Many Requests` with `Retry-After`; these limits complement, rather than replace,
network-edge authentication and rate limiting.

## Related Documentation

* [Getting Started](/inspector/index) - Basic inspector usage
* [CLI Usage](/inspector/cli) - Standalone inspector usage
* [Inspector chat components](/typescript/api-reference/client/inspector-chat-components) - API reference for exported chat UI
* [Debug widgets in the Inspector](/inspector/debugging-chatgpt-apps) - Test widget rendering and host behavior