Chrome扩展onUpdated触发过晚，无法提前移除页面脚本求助

我太懂你这个困扰了——本来想赶在页面脚本跑起来之前把它们删掉，结果用chrome.tabs.onUpdated加executeScript的方式总是慢半拍，等你的脚本注入进去，目标脚本早都执行完了对吧？这核心问题就是注入时机太晚，咱们换几个思路来解决：

1. 用Content Script的run_at配置（最推荐，稳定可靠） #

Chrome扩展的Content Script支持通过manifest.json指定注入时机，其中"run_at": "document_start"是能拿到的最早时机——这时候DOM还没开始构建，页面的所有脚本都还没开始执行。

第一步：配置manifest.json #

把你的脚本配置成在document_start时机自动注入到目标页面：

{
  "manifest_version": 3,
  "name": "页面脚本拦截器",
  "version": "1.0",
  "content_scripts": [
    {
      "matches": ["*://你的目标域名/*"], // 替换成你要处理的页面域名，比如"*://example.com/*"
      "js": ["test.js"],
      "run_at": "document_start",
      "all_frames": true // 如果页面有子框架需要处理，加上这个
    }
  ]
}

第二步：修改test.js，用MutationObserver拦截脚本 #

因为document_start时document.body还不存在，直接查元素肯定找不到，咱们用MutationObserver监听DOM的变化，一旦有新的<script>元素被添加进来，立刻移除它：

// test.js - 在document_start时机注入
const scriptObserver = new MutationObserver((mutations) => {
  mutations.forEach(mutation => {
    // 遍历所有新增的节点
    mutation.addedNodes.forEach(node => {
      // 判断是不是脚本元素
      if (node.tagName === 'SCRIPT') {
        // 这里可以加判断条件，比如根据src或者脚本内容过滤
        console.log('抓到一个脚本，已移除:', node.src || '内联脚本');
        node.remove();
      }
    });
  });
});

// 监听整个文档根节点的子节点变化，包括所有子树
scriptObserver.observe(document.documentElement, {
  childList: true,
  subtree: true
});

这样一来，页面的脚本刚被加到DOM里，还没来得及执行就被删掉了，完美解决时机问题。

2. 动态注入时指定runAt参数（适合按需注入场景） #

如果你的扩展需要根据某些条件（比如用户点击按钮）才注入脚本，那可以用chrome.scripting.executeScript时指定runAt: "document_start"，但要注意触发时机要早，别等页面加载到一半才触发：

// background.js
chrome.tabs.onCreated.addListener(async (tab) => {
  // 确保是网页，不是chrome://之类的内部页面
  if (tab.url && tab.url.startsWith('http')) {
    try {
      await chrome.scripting.executeScript({
        target: { tabId: tab.id },
        files: ['test.js'],
        runAt: "document_start" // 关键：指定最早的注入时机
      });
    } catch (err) {
      console.error('脚本注入失败:', err);
    }
  }
});

这里用tabs.onCreated监听标签页创建事件，这时候页面还没开始加载，刚好能赶在document_start时机注入脚本。

3. 拦截网络请求（从源头阻止脚本下载） #

如果不想让目标脚本被下载到本地，还可以用webRequest API直接拦截脚本的请求，彻底阻断它：

// background.js
chrome.webRequest.onBeforeRequest.addListener(
  (details) => {
    // 匹配你要拦截的脚本URL，比如包含特定文件名或路径
    if (details.url.includes('target-script.js')) {
      return { cancel: true }; // 取消这个请求
    }
  },
  { urls: ["*://你的目标域名/*/*.js"] }, // 精准匹配脚本的URL规则
  ["blocking"] // 必须加这个，才能拦截请求
);

别忘了在manifest.json里声明对应的权限：

{
  "permissions": ["webRequest", "webRequestBlocking", "*://你的目标域名/*"]
}

这个方法最彻底，连脚本都不会下载，但需要你精准知道要拦截的脚本URL。

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