Firefox扩展内容脚本能否使用onHistoryStateUpdated事件？

你猜的没错——webNavigation API确实只能在扩展的后台上下文（比如背景脚本、弹出页脚本）中使用，内容脚本里是完全访问不到的。这不是你的操作问题，而是Firefox WebExtension的权限隔离机制导致的：

内容脚本运行在网页的独立上下文里，只能访问有限的WebExtension API（比如runtime、storage的部分方法），而webNavigation属于需要监听浏览器全局导航行为的高权限API，只能被扩展的后台环境调用，哪怕你在manifest里声明了权限也没用。

针对你的需求（监听history.pushState触发的URL更新），这里有两种可行的解决方案：

方案1：在内容脚本中直接拦截pushState/replaceState调用 #

因为原生的pushState和replaceState不会触发popstate事件，我们可以通过重写这两个方法来捕获URL变化：

// 保存原始的历史记录方法
const originalPushState = history.pushState;
const originalReplaceState = history.replaceState;

// 重写pushState，触发自定义事件
history.pushState = function(...args) {
  window.dispatchEvent(new CustomEvent('historyStateChanged', {
    detail: {
      url: window.location.href,
      method: 'pushState',
      state: args[0]
    }
  }));
  return originalPushState.apply(this, args);
};

// 重写replaceState，同样触发自定义事件
history.replaceState = function(...args) {
  window.dispatchEvent(new CustomEvent('historyStateChanged', {
    detail: {
      url: window.location.href,
      method: 'replaceState',
      state: args[0]
    }
  }));
  return originalReplaceState.apply(this, args);
};

// 监听自定义事件，处理URL更新逻辑
window.addEventListener('historyStateChanged', (event) => {
  console.log('URL updated via', event.detail.method, ':', event.detail.url);
  // 这里添加你的业务逻辑
});

方案2：后台监听+消息传递给内容脚本 #

如果你更倾向于使用webNavigation.onHistoryStateUpdated，可以把监听逻辑放在后台脚本里，再通过消息传递把更新信息发送给内容脚本：

后台脚本代码 #

function handleHistoryUpdate(details) {
  // 向对应标签页的内容脚本发送消息
  browser.tabs.sendMessage(details.tabId, {
    type: 'history_updated',
    url: details.url,
    transitionType: details.transitionType,
    transitionQualifiers: details.transitionQualifiers
  });
}

browser.webNavigation.onHistoryStateUpdated.addListener(handleHistoryUpdate);

内容脚本代码 #

// 监听来自后台的消息
browser.runtime.onMessage.addListener((message) => {
  if (message.type === 'history_updated') {
    console.log('onHistoryStateUpdated:', message.url);
    console.log('Transition type:', message.transitionType);
    console.log('Transition qualifiers:', message.transitionQualifiers);
    // 处理URL更新的逻辑
  }
});

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