PageWebPro Documentation
Documentation AI agents (MCP)

AI agents (MCP)

Connect VS Code and CLI agents

intermediate

Last updated Aug 23, 2026

Editors and terminal agents connect differently from Claude and ChatGPT: you create an access token in PageWebPro and give it to the tool, instead of signing in through a browser.

Why sign-in is not offered here

The browser sign-in flow only accepts a return address on a small list of known AI providers. Editors and terminal tools return to a local address on your own machine instead, and those are not on the list — so registration is refused before you ever reach the login screen.

This is a deliberate setting, not a bug: the registration step is open to anyone by design, so the list of addresses it will hand a login back to is kept short. Tokens are the supported path for these clients, and they are in some ways better suited — you can make one read-only, and give it an expiry date.

If you try anyway, you will see an invalid_redirect_uri error. That is this, and no amount of retrying will change it.

Create a token

  1. In PageWebPro, go to Account → Settings → Connected AI agents → Change.
  2. Under Create a token, give it a name that says where it will live — laptop-vscode, ci-agent — so you know what you are revoking later.
  3. Choose the access level:
    • Read & write — the agent can edit pages. Use this if you want it to do work.
    • Read-only — the agent can only inspect. Genuinely read-only: the editing tools are not just refused, they are not offered to it at all. Good for a first look, or for anything automated that only needs to report.
  4. Optionally set an expiry between 1 and 365 days. Leave it empty for a token that does not expire.
  5. Choose Create token and copy it. It is shown once. If you lose it, revoke it and make another.

Treat it like a password. It carries your account's permissions.

VS Code

VS Code reads MCP servers from an mcp.json file — per project in .vscode/mcp.json, or for all projects via the Command Palette and MCP: Open User Configuration.

Use an input prompt rather than writing the token into the file:

{
  "inputs": [
    {
      "type": "promptString",
      "id": "editor-token",
      "description": "PageWebPro agent token",
      "password": true
    }
  ],
  "servers": {
    "website-editor": {
      "type": "http",
      "url": "https://app.pagewebpro.com/mcp/editor",
      "headers": {
        "Authorization": "Bearer ${input:editor-token}"
      }
    }
  }
}

VS Code asks for the token the first time the server starts and stores it in your system keychain from then on. The file itself stays safe to commit.

Then open Chat, switch to agent mode, and check the tools list shows the PageWebPro tools.

Claude Code

One command:

claude mcp add --transport http website-editor https://app.pagewebpro.com/mcp/editor \
  --header "Authorization: Bearer YOUR_TOKEN_HERE"

Run /mcp inside Claude Code to confirm the server is connected, then ask it to run whoami.

Cursor and other editors

Most editors use the same shape — an HTTP MCP server with an Authorization header. For Cursor, in ~/.cursor/mcp.json:

{
  "mcpServers": {
    "website-editor": {
      "url": "https://app.pagewebpro.com/mcp/editor",
      "headers": {
        "Authorization": "Bearer YOUR_TOKEN_HERE"
      }
    }
  }
}

Keep the token out of your repository

A token committed to a repository is a leaked credential, and it does not stop being one when you delete the file — it stays in the history.

  • In VS Code, use the ${input:…} prompt shown above.
  • Elsewhere, read it from an environment variable if the tool supports it, or put the config in a user-level location outside the project.
  • If a token does get committed, revoke it. Do not try to scrub the history and keep using it.

Revoking is immediate: Account → Settings → Connected AI agents → Change, find the token by the name you gave it, choose Revoke. The panel also shows each token's access level and when it was last used, which is how you spot one you have forgotten about.

Next