Chrome riêng cho chrome-devtools-mcp: đăng nhập được và không đụng Chrome chính

Khi để chrome-devtools-mcp (server MCP điều khiển trình duyệt cho Claude Code, Cursor, VS Code...) tự mở Chrome, bạn gặp ba vấn đề: Google và Cloudflare chặn đăng nhập, hai project mở trình duyệt cùng lúc thì lỗi, và agent có thể nhìn thấy mọi tab trong Chrome cá nhân của bạn. Bài này dựng một hồ sơ Chrome riêng cho từng project để MCP chỉ gắn vào đúng trình duyệt đó, vẫn đăng nhập được và giữ phiên, chạy song song nhiều project.

Trong bài, <profiles-root> là thư mục bạn chứa các hồ sơ (ví dụ %USERPROFILE%\chrome-mcp-profiles), <project-slug> là tên ngắn của một project (chữ thường, số, gạch ngang). Hướng dẫn kiểm chứng trên Windows 11 + Chrome stable 153 + chrome-devtools-mcp 1.9.0; ý tưởng áp dụng được cho các client MCP khác.

Vấn đề với cấu hình mặc định

Khi .mcp.json khai chrome-devtools-mcp không kèm cờ nào, MCP tự mở Chrome bằng Puppeteer với một hồ sơ dùng chung cho mọi project. Bốn hệ quả:

So sánh các cách khởi động

Điểm mấu chốt: MCP tự mở Chrome thì luôn kèm cờ tự động hóa (bị chặn đăng nhập); còn bạn tự mở Chrome rồi MCP chỉ CONNECT vào thì không có cờ đó.

Cách cuối là mục tiêu của bài. Bạn mở Chrome bằng một launcher (không cờ tự động hóa), MCP chỉ đọc cổng debug của đúng thư mục đó và gắn vào.

Vì sao Chrome cho phép mở cổng debug trên hồ sơ riêng

Từ Chrome 136, cờ --remote-debugging-port và --remote-debugging-pipe bị bỏ qua trên thư mục dữ liệu mặc định; muốn dùng thì phải kèm --user-data-dir trỏ tới một thư mục khác. Lý do: kể từ khi bật App-Bound Encryption, kẻ tấn công lợi dụng remote-debugging để rút cookie, nên Chrome khóa đường này trên hồ sơ mặc định.

Vì sao đăng nhập bị chặn, và cách né hợp lệ

Google/Cloudflare chặn khi thấy navigator.webdriver === true. Thuộc tính này bật true khi có bất kỳ dấu hiệu điều khiển nào:

Hệ quả: không thể đăng nhập trong lúc cổng debug đang mở. Cách né hợp lệ (không dùng mẹo giả mạo) là tách hai chế độ trên cùng một thư mục dữ liệu:

• Chế độ đăng nhập: mở Chrome KHÔNG cổng debug, không cờ tự động hóa. Bạn đăng nhập Google/Cloudflare như trình duyệt thường. Cookie lưu vào thư mục hồ sơ.
• Chế độ làm việc: đóng hẳn Chrome trên, mở lại VỚI --remote-debugging-port=0. MCP gắn vào. Cookie từ lần đăng nhập vẫn còn, nên các trang vẫn nhận phiên - mà lúc này không cần đăng nhập lại nữa.

Cách hoạt động

Chrome chính của bạn            Chrome riêng project A            Chrome riêng project B
(hồ sơ mặc định, không cổng)    <profiles-root>\A                 <profiles-root>\B
        ^                       --remote-debugging-port=0         --remote-debugging-port=0
        |                              | ghi                             | ghi
  không MCP nào nối vào         A\DevToolsActivePort (cổng ngẫu nhiên)   B\DevToolsActivePort
                                       ^ đọc                            ^ đọc
                               MCP project A                     MCP project B
                               --autoConnect                     --autoConnect
                               --userDataDir=<...>\A             --userDataDir=<...>\B

Luồng chi tiết:

1. Launcher chạy chrome.exe --user-data-dir="<profiles-root>\<slug>" --no-first-run --no-default-browser-check --remote-debugging-port=0.
2. Chrome chọn một cổng trống, ghi file <thư mục>\DevToolsActivePort gồm 2 dòng: số cổng và đường dẫn /devtools/browser/<uuid>. Cổng chỉ nghe trên 127.0.0.1.
3. Có --autoConnect, MCP đọc DevToolsActivePort trong đúng thư mục --userDataDir, dựng ws://127.0.0.1:<port><path> rồi kết nối. Không có file hoặc cổng không trả lời thì MCP báo Could not connect to Chrome in <thư mục> và KHÔNG tự mở Chrome.
4. Khi phiên MCP kết thúc, MCP chỉ ngắt kết nối - Chrome vẫn mở.

Setup cho một project

1. Tạo thư mục gốc <profiles-root> (ví dụ %USERPROFILE%\chrome-mcp-profiles) và đặt launcher open-chrome-mcp.ps1 (mã ở dưới) vào đó.
2. Chọn <project-slug> khớp regex ^[a-z0-9][a-z0-9-]*$, mỗi project một slug riêng.
3. Tạo 2 file .cmd ở thư mục gốc của project (mã ở dưới), thay <project-slug> và đường dẫn launcher.
4. Sửa .mcp.json của project: mục chrome-devtools trỏ --autoConnect --userDataDir tới <profiles-root>\<project-slug>.
5. Đăng nhập (nếu project cần tài khoản): chạy chế độ đăng nhập, đăng nhập, đóng hẳn.
6. Mở chế độ làm việc, rồi restart client MCP để nạp .mcp.json mới.

Mã nguồn

Launcher open-chrome-mcp.ps1

Đặt ở <profiles-root>. Lưu UTF-8 có BOM (PowerShell 5.1 đọc file không BOM theo ANSI, chữ tiếng Việt sẽ lỗi). Script tự định vị thư mục hồ sơ theo vị trí của chính nó, nên không chứa đường dẫn tuyệt đối.

param(
    [Parameter(Mandatory = $true)]
    [ValidatePattern('^[a-z0-9][a-z0-9-]*$')]
    [string]$Project,
    [switch]$Login
)

$ErrorActionPreference = 'Stop'
$profileDir = Join-Path $PSScriptRoot $Project     # <profiles-root>\<Project>
$portFile   = Join-Path $profileDir 'DevToolsActivePort'

$chrome = @(
    "$env:ProgramFiles\Google\Chrome\Application\chrome.exe",
    "${env:ProgramFiles(x86)}\Google\Chrome\Application\chrome.exe",
    "$env:LOCALAPPDATA\Google\Chrome\Application\chrome.exe"
) | Where-Object { Test-Path $_ } | Select-Object -First 1
if (-not $chrome) { Write-Host 'Không tìm thấy Google Chrome.' -ForegroundColor Red; exit 1 }

# Chrome chỉ cho một tiến trình trên mỗi thư mục dữ liệu. Nếu đã có Chrome chạy trên thư
# mục này, lần mở mới BỎ QUA các cờ truyền vào -> phải kiểm tra trước để không mở nhầm chế độ.
function Test-ProfileChromeRunning {
    $needle = "--user-data-dir=`"$profileDir`"".ToLowerInvariant()
    [bool](Get-CimInstance Win32_Process -Filter "Name='chrome.exe'" |
        Where-Object { $_.CommandLine -and $_.CommandLine.ToLowerInvariant().Contains($needle) })
}

# Trả về số cổng nếu cổng debug trong DevToolsActivePort đang trả lời, ngược lại $null.
function Get-LiveDebugPort {
    try {
        if (-not (Test-Path $portFile)) { return $null }
        $port = (Get-Content $portFile -TotalCount 1).Trim()
        if (-not $port) { return $null }
        Invoke-RestMethod "http://127.0.0.1:$port/json/version" -TimeoutSec 2 | Out-Null
        return $port
    } catch { return $null }
}

if (Test-ProfileChromeRunning) {
    $port = Get-LiveDebugPort
    if ($Login) {
        if ($port) { Write-Host "Đang mở ở chế độ làm việc (cổng $port). Đóng hẳn rồi chạy lại." -ForegroundColor Yellow; exit 1 }
        Write-Host 'Đang mở ở chế độ đăng nhập rồi.' -ForegroundColor Green; exit 0
    }
    if ($port) { Write-Host "Đã sẵn sàng cho MCP (cổng $port)." -ForegroundColor Green; exit 0 }
    Write-Host 'Đang mở nhưng không có cổng debug (chế độ đăng nhập). Đóng hẳn rồi chạy lại.' -ForegroundColor Yellow
    exit 1
}

New-Item -ItemType Directory -Force $profileDir | Out-Null
$chromeArgs = @("--user-data-dir=`"$profileDir`"", '--no-first-run', '--no-default-browser-check')
if (-not $Login) {
    Remove-Item $portFile -Force -ErrorAction SilentlyContinue  # xóa cổng cũ của lần chạy trước
    $chromeArgs += '--remote-debugging-port=0'
}
Start-Process -FilePath $chrome -ArgumentList $chromeArgs

if ($Login) {
    Write-Host 'Đã mở ở chế độ đăng nhập. Đăng nhập xong thì đóng hẳn, rồi mở lại chế độ làm việc.' -ForegroundColor Green
    exit 0
}

for ($i = 0; $i -lt 40; $i++) {
    $port = Get-LiveDebugPort
    if ($port) { Write-Host "Đã mở cho MCP (cổng $port, chỉ trong máy)." -ForegroundColor Green; exit 0 }
    Start-Sleep -Milliseconds 250
}
Write-Host 'Đã mở nhưng sau 10 giây chưa thấy cổng debug.' -ForegroundColor Red
exit 1

Hai file bấm đúp của project

Đặt ở thư mục gốc project, giữ nội dung ASCII (cmd đọc file batch theo bảng mã OEM). Thay <project-slug> và đường dẫn launcher.

open-chrome-for-mcp.cmd (chế độ làm việc):

@echo off
rem Mo Chrome rieng cua project o che do lam viec (co cong remote-debugging ngau nhien)
rem de chrome-devtools-mcp (--autoConnect --userDataDir) gan vao.
powershell -NoProfile -ExecutionPolicy Bypass -File "%USERPROFILE%\chrome-mcp-profiles\open-chrome-mcp.ps1" -Project <project-slug>
if errorlevel 1 (pause) else (timeout /t 4 >nul)

open-chrome-for-mcp-login.cmd (chế độ đăng nhập):

@echo off
rem Mo Chrome rieng o che do dang nhap (KHONG cong debug) de Google / Cloudflare dang nhap
rem nhu trinh duyet thuong. Dang nhap, dong han Chrome do, roi chay open-chrome-for-mcp.cmd.
powershell -NoProfile -ExecutionPolicy Bypass -File "%USERPROFILE%\chrome-mcp-profiles\open-chrome-mcp.ps1" -Project <project-slug> -Login
if errorlevel 1 (pause) else (timeout /t 6 >nul)

-ExecutionPolicy Bypass chỉ áp cho đúng tiến trình PowerShell đó, không đổi cài đặt hệ thống.

Mục chrome-devtools trong .mcp.json

JSON không giãn biến môi trường, nên điền đường dẫn tuyệt đối. Trong JSON, \ viết \\.

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "cmd",
      "args": [
        "/c", "npx", "-y", "[email protected]",
        "--autoConnect",
        "--userDataDir=<profiles-root>\\<project-slug>"
      ]
    }
  }
}

Dùng hằng ngày

Trong lúc agent làm việc, bạn vẫn dùng Chrome chính bình thường. Nên chọn một màu theme riêng cho Chrome này để dễ phân biệt.

Bảo mật

• Khi Chrome riêng mở ở chế độ làm việc, mọi chương trình trên máy đều nối được vào cổng debug (cổng chỉ nghe 127.0.0.1, không lộ ra mạng) và điều khiển Chrome đó, kể cả đọc cookie. Vì vậy: chỉ đăng nhập các tài khoản thật sự cần; xong việc thì đóng Chrome riêng.
• Giữ TẮT chrome://inspect/#remote-debugging trên Chrome chính - đó là đường duy nhất còn lại để mở cổng debug trên hồ sơ mặc định.
• Thư mục <profiles-root>\<slug> chứa cookie đăng nhập. Không commit, không đồng bộ cloud, không chia sẻ.
• Cân nhắc thêm cờ: --redactNetworkHeaders (ẩn header nhạy cảm khi đọc network), --allowedUrlPattern / --blockedUrlPattern (giới hạn trang MCP được vào).

Xử lý sự cố

Tham khảo

• Chrome for Developers - Changes to remote debugging switches (Chrome 136): https://developer.chrome.com/blog/remote-debugging-port
• chrome-devtools-mcp - Advanced usage (--autoConnect, --browser-url, cảnh báo bảo mật cổng debug): https://github.com/ChromeDevTools/chrome-devtools-mcp/blob/main/docs/advanced-usage.md
• Connect your AI agent to your personal browser with auto-connect (Chrome 144+): https://developer.chrome.com/docs/devtools/agents/use-cases/auto-connect
• MDN - Navigator: webdriver property: https://developer.mozilla.org/en-US/docs/Web/API/Navigator/webdriver