如何在Chrome Extension V3中检测标签页URL是否包含指定字符串？

核心差异说明 #

Chrome Extension V3 已将 V2 中的 pageAction 和 browserAction 统一合并为 chrome.action，同时 declarativeContent API 的动作类型也对应调整，这是你原来的 V2 代码失效的核心原因。

实现步骤 #

1. 配置 manifest.json（V3 格式）

需要声明 declarativeContent 权限，同时指定扩展版本为 3，定义基础的 action 配置：

{
  "manifest_version": 3,
  "name": "FTP URL Detector",
  "version": "1.0",
  "permissions": ["declarativeContent"],
  "background": {
    "service_worker": "background.js"
  },
  "action": {
    "default_icon": {
      "16": "icon16.png",
      "48": "icon48.png"
    },
    "default_title": "FTP URL Detected"
  }
}

2. 编写 background.js 逻辑

替换 V2 中的 ShowPageAction 为 V3 对应的 ShowAction，并将 URL 匹配规则改为检测包含 ftp:// 的地址：

chrome.runtime.onInstalled.addListener(() => {
  // 清除旧规则（可选，首次安装可省略）
  chrome.declarativeContent.onPageChanged.removeRules(undefined, () => {
    // 添加新规则
    chrome.declarativeContent.onPageChanged.addRules([
      {
        conditions: [
          new chrome.declarativeContent.PageStateMatcher({
            pageUrl: { urlContains: 'ftp://' }
            // 若需精准匹配以ftp://开头的URL，可替换为：
            // pageUrl: { urlPrefix: 'ftp://' }
          })
        ],
        actions: [new chrome.declarativeContent.ShowAction()]
      }
    ]);
  });
});

3. 扩展功能扩展

如果需要在检测到 FTP URL 时执行更多自定义动作（而非仅显示图标），可以结合 chrome.tabs.onUpdated 监听事件：

chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
  if (changeInfo.status === 'complete' && tab.url.includes('ftp://')) {
    // 这里添加你的自定义动作，比如弹出通知、注入脚本等
    chrome.notifications.create({
      type: 'basic',
      iconUrl: 'icon48.png',
      title: 'FTP URL 检测到',
      message: `当前标签页URL: ${tab.url}`
    });
  }
});

使用这种方式时，需要在 manifest.json 中额外添加对应权限（如 notifications 或 scripting）。

调试与验证 #

• 在 Chrome 浏览器中打开 chrome://extensions/，开启「开发者模式」，点击「加载已解压的扩展程序」选择你的扩展目录即可测试。
• 当标签页加载包含 ftp:// 的 URL 时，扩展图标会自动显示在工具栏，或触发你定义的自定义动作。

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