嘿，我刚好折腾过类似的需求，给你分享几个落地性强的思路，完全适配Chrome和Firefox的扩展开发：

核心前提：为每个标签页维护独立的历史栈

首先得搞个全局对象来存每个标签页的历史状态，这样才能区分开不同标签页的操作，比如：

// 存储每个标签页的历史栈 + 当前位置索引
const tabHistoryTrackers = {};

// 初始化单个标签页的历史记录
function initTabHistory(tabId, url) {
  tabHistoryTrackers[tabId] = {
    stack: [url],
    currentIndex: 0
  };
}

方法一：用webNavigation事件（推荐，精准度拉满）

这个API就是专门用来追踪导航行为的，能直接区分「前进/后退」和「新页面跳转」，只需要在manifest.json里多加个webNavigation权限就行，和你现有的tabs、history权限完全兼容。

1. 监听新页面加载（视为「前进」操作）
   当用户输入URL、点击链接打开新页面时，onCompleted事件会触发，这时候把新URL推入栈就行：

// Chrome用chrome，Firefox换成browser就行，后面可以加兼容层统一调用
chrome.webNavigation.onCompleted.addListener((details) => {
  const { tabId, url, transitionType } = details;
  // 标签页第一次加载，先初始化历史栈
  if (!tabHistoryTrackers[tabId]) {
    initTabHistory(tabId, url);
    return;
  }
  const tracker = tabHistoryTrackers[tabId];
  // 排除前进/后退的历史导航，只处理新页面跳转
  if (transitionType !== 'forward' && transitionType !== 'backward') {
    // 清除当前索引之后的栈（比如用户在中间页面跳新链接，之前的前进记录要清空）
    tracker.stack = tracker.stack.slice(0, tracker.currentIndex + 1);
    tracker.stack.push(url);
    tracker.currentIndex += 1;
    console.log(`标签页${tabId}：前进操作，当前栈：`, tracker.stack);
  }
}, { url: [{ schemes: ['http', 'https'] }] }); // 只监听网页，排除chrome://这类内部页面

2. 监听历史前进/后退操作
   用户点浏览器的前进/后退按钮时，onHistoryStateUpdated会触发，通过transitionType就能直接判断方向：

chrome.webNavigation.onHistoryStateUpdated.addListener((details) => {
  const { tabId, transitionType, url } = details;
  if (!tabHistoryTrackers[tabId]) return;
  const tracker = tabHistoryTrackers[tabId];
  
  if (transitionType === 'backward') {
    // 后退操作，索引减1
    if (tracker.currentIndex > 0) {
      tracker.currentIndex -= 1;
      console.log(`标签页${tabId}：后退到`, url);
      // 这里可以执行你需要的pop栈逻辑
    }
  } else if (transitionType === 'forward') {
    // 前进操作，索引加1
    if (tracker.currentIndex < tracker.stack.length - 1) {
      tracker.currentIndex += 1;
      console.log(`标签页${tabId}：前进到`, url);
    }
  }
}, { url: [{ schemes: ['http', 'https'] }] });

方法二：仅用tabs权限的替代方案（适合不想加额外权限的情况）

如果不想加webNavigation权限，也可以用chrome.tabs.onUpdated结合URL对比来判断，缺点是精准度稍差，但胜在轻量化：

// 记录每个标签页上一次的URL
const lastTabUrls = {};

chrome.tabs.onUpdated.addListener((tabId, changeInfo, tab) => {
  // 只处理页面加载完成的情况，排除chrome://这类内部页面
  if (changeInfo.status !== 'complete' || !tab.url.startsWith('http')) return;
  
  const currentUrl = tab.url;
  // 初始化标签页历史
  if (!tabHistoryTrackers[tabId]) {
    initTabHistory(tabId, currentUrl);
    lastTabUrls[tabId] = currentUrl;
    return;
  }
  
  const tracker = tabHistoryTrackers[tabId];
  const lastUrl = lastTabUrls[tabId];
  
  // 检查当前URL是否在历史栈中
  const urlIndex = tracker.stack.indexOf(currentUrl);
  if (urlIndex !== -1) {
    // 是历史记录里的URL，判断前进/后退
    if (urlIndex === tracker.currentIndex - 1) {
      tracker.currentIndex = urlIndex;
      console.log(`标签页${tabId}：后退到`, currentUrl);
    } else if (urlIndex === tracker.currentIndex + 1) {
      tracker.currentIndex = urlIndex;
      console.log(`标签页${tabId}：前进到`, currentUrl);
    }
  } else {
    // 新页面，视为前进操作，更新栈
    tracker.stack = tracker.stack.slice(0, tracker.currentIndex + 1);
    tracker.stack.push(currentUrl);
    tracker.currentIndex += 1;
    console.log(`标签页${tabId}：新页面前进，当前栈：`, tracker.stack);
  }
  
  lastTabUrls[tabId] = currentUrl;
});

兼容Chrome和Firefox的小技巧

Firefox的扩展API用browser代替chrome，你可以加个兼容层统一调用：

const browserAPI = chrome || browser;

之后所有API调用都换成browserAPI，比如browserAPI.webNavigation.onCompleted.addListener(...)就行。

最后别忘了处理标签页关闭的情况，清理对应的记录：

browserAPI.tabs.onRemoved.addListener((tabId) => {
  delete tabHistoryTrackers[tabId];
  delete lastTabUrls[tabId];
});

备注：内容来源于stack exchange，提问作者terrorrussia-keeps-killing