chrome.declarativeContent的RequestContentScript权限浏览器重启后不生效问题

核心原因 #

chrome.declarativeContent 注册的页面规则不会被浏览器持久化存储，浏览器重启、扩展重载后所有已注册的规则会被清空。你的代码仅在用户主动触发权限申请的回调中执行规则注册逻辑，扩展后台脚本在重启后重新加载时，没有触发规则重新注册的逻辑，因此即使权限仍处于授权状态，也没有匹配的规则执行脚本注入。

排查验证步骤 #

• 打开扩展的后台服务 worker 控制台，执行以下代码查看当前注册的规则：
  chrome.declarativeContent.onPageChanged.getRules(console.log)
  如果重启浏览器后输出为空数组，即可确认是规则丢失导致的问题。
• 执行以下代码确认权限仍在有效期：
  chrome.permissions.getAll(console.log)
  确认返回结果中包含 declarativeContent 权限和对应站点的origin权限。

修复方案 #

将规则注册逻辑抽离为公共函数，在两个时机触发注册：1. 首次权限申请成功时；2. 后台脚本初始化、检测到已有对应权限时。

修改后的示例代码如下：

// 抽离公共的规则注册函数
function registerInjectRules() {
  const conditions = [
    new chrome.declarativeContent.PageStateMatcher({
      pageUrl: { hostEquals: 'www.amazon.fr', schemes: ['https'] },
      css: ['div'],
    })
  ]
  const injectRule = {
    conditions,
    actions: [
      new chrome.declarativeContent.RequestContentScript({ 
        js: ['page_injects/index.js'], 
        css: ['page_injects/index.css'] 
      })
    ]
  }
  chrome.declarativeContent.onPageChanged.removeRules(undefined, () => {
    chrome.declarativeContent.onPageChanged.addRules([injectRule], () => {
      console.log('注入规则注册完成')
    })
  })
}

// 后台脚本初始化时检查已有权限，存在则直接注册规则
chrome.permissions.contains({
  permissions: ['declarativeContent'],
  origins: ['https://www.amazon.fr/']
}, (hasPermission) => {
  if (hasPermission) {
    registerInjectRules()
  }
})

// 原有的权限申请逻辑，申请成功后调用注册函数
function requestAmazonPermission() {
  chrome.permissions.request({
    permissions: ['declarativeContent'],
    origins:['https://www.amazon.fr/'],
  }, (granted) => {
    console.log({ granted })
    if (granted) {
      registerInjectRules()
    }
  })
}

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