如何创建可通过浏览器返回按钮访问历史记录的标签页？

数据老陈

2026-7-13

可行解决方案

方案1：等待初始页面加载完成后再跳转

用chrome.tabs.create打开URL1后，不要立刻调用chrome.tabs.update，而是监听标签页的加载状态，等页面加载完成（status变为complete）后再导航到URL2。此时浏览器会自动将URL1存入标签页的会话历史栈，用户就能通过返回按钮回到URL1。

示例代码：

chrome.tabs.create({url: URL1}, (tab) => {
  const loadListener = (tabId, changeInfo) => {
    if (tabId === tab.id && changeInfo.status === 'complete') {
      chrome.tabs.update(tab.id, {url: URL2});
      chrome.tabs.onUpdated.removeListener(loadListener);
    }
  };
  chrome.tabs.onUpdated.addListener(loadListener);
});

方案2：通过内容脚本触发跨域跳转

在URL1页面加载完成后，注入内容脚本，用window.location.href = URL2触发跳转。这种原生跳转方式不受同源限制，会自动把URL1加入标签页的历史栈，支持返回操作。

示例代码：

chrome.tabs.create({url: URL1}, (tab) => {
  const loadListener = (tabId, changeInfo) => {
    if (tabId === tab.id && changeInfo.status === 'complete') {
      chrome.scripting.executeScript({
        target: {tabId: tab.id},
        func: (targetUrl) => {
          window.location.href = targetUrl;
        },
        args: [URL2]
      });
      chrome.tabs.onUpdated.removeListener(loadListener);
    }
  };
  chrome.tabs.onUpdated.addListener(loadListener);
});