如何通过JavaScript获取网页全重定向链路？浏览器扩展开发问询

一、能否复用其他扩展/网页工具的功能？ #

不行。浏览器扩展运行在独立沙箱环境中，没有合法途径直接调用其他扩展的内部逻辑；你提到的网页工具属于普通网页上下文，和浏览器扩展环境完全隔离，更无法复用其功能。

二、可行的实现方案 #

1. 浏览器扩展端（捕获用户浏览时的重定向链） #

利用浏览器原生的webRequest API（Chrome、Firefox等主流浏览器均支持），可以监听页面加载过程中的重定向事件，完整记录URL跳转链条。

实现步骤：

• 在扩展的manifest.json中声明必要权限（以Manifest V3为例）：

{
  "manifest_version": 3,
  "permissions": ["webRequest", "<all_urls>"],
  "background": {
    "service_worker": "background.js"
  }
}

（若使用Manifest V2，可调整为对应格式的背景页配置）

• 在background.js中监听并重定向事件并记录链条：

// 存储每个tab的重定向链，避免跨tab数据干扰
const redirectChains = new Map();

// 监听重定向触发事件
chrome.webRequest.onBeforeRedirect.addListener(
  (details) => {
    const tabId = details.tabId;
    if (!redirectChains.has(tabId)) {
      // 初始化链条，加入当前请求的URL
      redirectChains.set(tabId, [details.url]);
    }
    // 添加重定向目标URL
    redirectChains.get(tabId).push(details.redirectUrl);
  },
  { urls: ["<all_urls>"] },
  ["responseHeaders"]
);

// 页面加载完成后，补充最终页面URL并输出完整链条
chrome.webNavigation.onCompleted.addListener((details) => {
  const tabId = details.tabId;
  const chain = redirectChains.get(tabId);
  if (chain) {
    // 加入最终到达的页面URL
    chain.push(details.url);
    console.log(`Tab ${tabId} 的完整重定向链:`, chain);
    
    // 可将链条发送给content script或popup页面展示
    chrome.tabs.sendMessage(tabId, { 
      type: "REDIRECT_CHAIN_DATA", 
      chain: chain 
    });
    
    // 清理缓存，防止内存泄漏
    redirectChains.delete(tabId);
  }
});

2. Node.js端（主动检测URL重定向链） #

如果需要后端主动检测某个URL的重定向路径，可以使用follow-redirects库，它能自动跟踪HTTP/HTTPS的重定向并返回完整链条。

实现步骤：

• 安装依赖：

npm install follow-redirects

• 示例代码：

const { http, https } = require('follow-redirects');

function fetchRedirectChain(targetUrl) {
  const chain = [targetUrl];
  
  return new Promise((resolve, reject) => {
    // 根据URL协议选择对应的请求模块
    const client = targetUrl.startsWith('https') ? https : http;
    
    client.get(targetUrl, (res) => {
      // 检查是否为重定向状态码
      if (res.statusCode >= 300 && res.statusCode < 400 && res.headers.location) {
        const nextUrl = new URL(res.headers.location, targetUrl).href;
        // 递归获取后续重定向节点
        fetchRedirectChain(nextUrl)
          .then(nextLinks => resolve([...chain, ...nextLinks.slice(1)]))
          .catch(reject);
      } else {
        // 无更多重定向，返回完整链条
        resolve(chain);
      }
    }).on('error', reject);
  });
}

// 使用示例
fetchRedirectChain('https://example.com/test')
  .then(chain => console.log('重定向链:', chain))
  .catch(err => console.error('获取失败:', err));

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