Puppeteer连接Chrome远程调试（localhost:9222）报404的排查与解决

404错误原因 #

直接使用ws://localhost:9222作为WebSocket端点是错误的——Chrome的远程调试端口9222提供的是HTTP管理接口，根路径/并非WebSocket服务入口，因此Puppeteer尝试连接时会返回404。正确的做法是获取Chrome生成的专属WebSocket调试地址。

解决步骤 #

1. 正确启动Chrome调试模式 #

先结束所有Chrome进程（通过任务管理器），再用以下命令启动，建议指定独立的用户数据目录避免与默认配置冲突：

"C:\Program Files\Google\Chrome\Application\chrome.exe" -remote-debugging-port=9222 --user-data-dir="C:\temp\chrome-debug-profile"

2. 获取正确的WebSocket端点 #

打开浏览器访问http://localhost:9222/json/version，返回的JSON数据中，webSocketDebuggerUrl字段就是完整的WebSocket地址，格式类似：

ws://localhost:9222/devtools/browser/abc123def456...

3. 修改Puppeteer代码连接 #

方式一：手动复制地址

直接将获取到的地址填入代码：

const browser = await puppeteer.connect({
  browserWSEndpoint: 'ws://localhost:9222/devtools/browser/abc123def456...'
});

方式二：代码动态获取（推荐）

通过HTTP接口自动获取WebSocket地址，避免手动复制：

const puppeteer = require('puppeteer');
const http = require('http');

async function connectToChrome() {
  // 从调试接口获取WebSocket地址
  const getWsEndpoint = () => new Promise((resolve, reject) => {
    http.get('http://localhost:9222/json/version', (res) => {
      let data = '';
      res.on('data', chunk => data += chunk);
      res.on('end', () => {
        try {
          const { webSocketDebuggerUrl } = JSON.parse(data);
          resolve(webSocketDebuggerUrl);
        } catch (err) {
          reject(err);
        }
      });
    }).on('error', reject);
  });

  const browserWSEndpoint = await getWsEndpoint();
  const browser = await puppeteer.connect({ browserWSEndpoint });

  // 验证连接
  const pages = await browser.pages();
  console.log(`已成功连接，当前页面数量：${pages.length}`);

  // 后续业务逻辑...
}

connectToChrome().catch(console.error);

额外注意事项 #

• 确保Puppeteer版本与Chrome版本兼容（Puppeteer 22.8.0对应Chrome 120.x版本，版本差异过大可能引发兼容性问题）。
• 若仍无法连接，检查防火墙是否拦截了9222端口的通信。

内容的提问来源于stack exchange，提问作者InfiniteLadder