Selenium 4（Node.js）捕获网络请求时出现TypeError: driver.manage(...).getDevTools is not a function错误

嗨，我一眼就看出来你遇到的问题啦！这是因为你用的Selenium WebDriver 4.28.1属于比较新的版本，里面获取DevTools的API已经做了更新——driver.manage().getDevTools()这个方法在后期的Selenium 4 Node.js绑定中被移除了，所以直接调用就会抛出类型错误。

问题核心原因 #

Selenium 4的Node.js SDK在迭代过程中，对DevTools相关的API做了简化，原来通过manage()间接获取DevTools的方式被废弃，改为直接从driver实例调用getDevTools()方法。

解决方案 #

只需要把报错的那一行代码修改一下，去掉中间的manage()调用即可。另外，我也会帮你优化一下代码里的一些细节，让它更符合新版本的规范。

修正后的完整代码 #

const { Builder, Browser } = require('selenium-webdriver');
const chrome = require('selenium-webdriver/chrome');

async function captureNetworkRequests() {
    // 用ChromeOptions配置浏览器参数（Selenium 4推荐方式，更直观）
    const chromeOptions = new chrome.Options();
    // 如需添加启动参数，直接用addArguments，示例：
    // chromeOptions.addArguments('--headless=new', '--disable-gpu');

    const driver = await new Builder()
        .forBrowser(Browser.CHROME)
        .setChromeOptions(chromeOptions)
        .build();

    // 关键修改：直接调用driver.getDevTools()，不再通过manage()
    const devTools = await driver.getDevTools();

    // 启用Network监控域
    await devTools.send('Network.enable', {});

    // 监听请求发送事件
    devTools.on('Network.requestWillBeSent', (event) => {
        const request = event.request;
        console.log('🔍 即将发送请求:', request.url);
    });

    // 监听响应接收事件，并获取响应体
    devTools.on('Network.responseReceived', async (event) => {
        const response = event.response;
        const requestId = event.requestId;
        const url = response.url;
        const status = response.status;

        if (url.includes('ws_api.php?')) {
            console.log(`📩 收到响应: ${status} ${url}`);
            try {
                // 获取响应体内容
                const responseBody = await devTools.send('Network.getResponseBody', { requestId });
                console.log('响应体:', responseBody.body);

                // 断言状态码
                const assert = require('assert');
                assert.strictEqual(status, 200, `预期状态码200，实际收到${status}（请求URL：${url}）`);
            } catch (error) {
                console.error('获取响应体失败:', error.message);
            }
        }
    });

    try {
        await driver.get('https://weatherstack.com/');
        // 等待10秒让网络请求充分触发
        await new Promise(resolve => setTimeout(resolve, 10000));
    } finally {
        // driver.quit()会自动关闭关联的DevTools会话，无需手动调用devTools.close()
        await driver.quit();
        console.log('✅ 浏览器已关闭');
    }
}

captureNetworkRequests();

补充注意事项 #

1. 版本兼容性：你当前的ChromeDriver（133.0.0）和Chrome浏览器（133.0.6943.60）版本是匹配的，继续保持这个对应关系就不会出问题。
2. DevTools事件规范：Network.requestWillBeSent和Network.responseReceived的参数结构遵循Chrome DevTools Protocol标准，如果后续有字段疑问，可以参考官方文档确认。
3. 资源清理：新版本Selenium中，driver.quit()会自动回收DevTools相关资源，不需要额外调用devTools.close()，避免出现不必要的错误。
4. 配置灵活性：如果你习惯用原来的Capabilities方式配置浏览器，也可以保留，只要确保核心的getDevTools()调用正确即可，两种配置方式在功能上是等价的。

备注：内容来源于stack exchange，提问作者Questions Asked94