如何通过JavaScript实现Selenium正则过滤并阻止下载指定网页资源？

我之前做网页抓取时遇到过完全一样的需求——用Selenium爬取时要限制不必要的资源加载来省流量，用JavaScript结合Chrome DevTools Protocol（CDP）就能完美解决，下面是具体的实现方案：

核心思路 #

通过Selenium调用Chrome DevTools的Network.setRequestInterception API，在每个网络请求发送前触发JavaScript逻辑，用正则表达式匹配请求URL，直接取消符合规则的请求（比如MP4、CSS、广告域名），从源头阻止资源下载。

具体实现步骤 #

• 启用网络拦截：先通过CDP命令开启请求拦截功能，让所有请求都进入拦截队列
• 编写过滤规则：用JavaScript定义正则匹配规则，覆盖你需要拦截的文件类型和域名
• 绑定拦截回调：把过滤逻辑绑定到拦截事件上，对命中规则的请求直接取消，允许其他请求正常执行

完整代码示例（以Chromium系浏览器为例） #

这里以Python的Selenium绑定为例，但核心的过滤逻辑是纯JavaScript编写的，你可以轻松适配到Java、JavaScript等其他语言的Selenium环境：

from selenium import webdriver
from selenium.webdriver.chrome.options import Options

# 初始化Chrome浏览器
chrome_options = Options()
chrome_options.add_argument("--headless=new")  # 可选，无头模式更省资源
driver = webdriver.Chrome(options=chrome_options)

# 1. 启用网络监控和请求拦截
driver.execute_cdp_cmd("Network.enable", {})
driver.execute_cdp_cmd("Network.setRequestInterception", {
    "patterns": [{"urlPattern": "*", "resourceType": "*", "interceptionStage": "Request"}]
})

# 2. 编写JavaScript过滤逻辑并绑定拦截回调
filter_logic = """
// 定义需要拦截的正则规则，可根据需求自由扩展
const blockRules = [
    /\\.mp4$/i,          // 拦截所有MP4视频文件（不区分大小写）
    /\\.css$/i,          // 拦截所有CSS样式文件
    /ads\\.google\\.com/i // 拦截来自ads.google.com的所有请求
];

// 监听请求拦截事件
driver.on('Network.requestIntercepted', async (event) => {
    const requestUrl = event.request.url;
    let shouldBlock = false;

    // 检查当前请求是否命中拦截规则
    for (const rule of blockRules) {
        if (rule.test(requestUrl)) {
            shouldBlock = true;
            console.log(`已拦截请求: ${requestUrl}`);
            break;
        }
    }

    // 发送处理指令：拦截则取消请求，否则继续
    await driver.send('Network.continueInterceptedRequest', {
        interceptionId: event.interceptionId,
        ...(shouldBlock ? {cancel: true} : {})
    });
});
"""

# 执行JavaScript脚本，绑定拦截逻辑
driver.execute_script(filter_logic)

# 3. 访问目标页面，此时会自动拦截指定资源
driver.get("https://your-target-url.com")

# 后续的爬取逻辑...

关键细节优化 #

• 规则扩展：你可以随时修改blockRules里的正则，比如添加/\\.png$/i拦截图片，或者/advertisement/i拦截包含广告关键词的请求
• 资源类型精准控制：如果需要更细粒度的控制，可以结合event.resourceType（比如Stylesheet对应CSS、Media对应视频）来辅助判断，避免误拦截
• 调试方便：开启浏览器的开发者工具（F12），在Network标签页可以看到被拦截的请求会标记为(canceled)，方便验证拦截效果

注意事项 #

这个方案仅适用于Chromium内核的浏览器（Chrome、Edge等），Firefox也支持类似的CDP API，但语法略有差异，需要调整对应的命令名称。

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