如何使WebRequest Header修改扩展拦截其他扩展发起的请求？

要让你的扩展拦截Raindrop.io侧边栏这类扩展发起的请求，核心是利用webRequest API提供的details.initiator字段识别请求来源，并调整监听逻辑：

关键技术点 #

扩展发起的请求会在details.initiator字段中携带特定前缀：

• Firefox：moz-extension://<扩展ID>
• Chrome/Edge：chrome-extension://<扩展ID>

你可以通过这个字段判断请求是否来自扩展，甚至精准匹配Raindrop.io的扩展ID，避免处理无关请求。

修改后的实现代码 #

manifest.json（无需大幅改动） #

{
    "manifest_version": 2,
    "name": "Referer Modifier",
    "version": "1.0",
    "permissions": [
        "webRequest",
        "webRequestBlocking",
        "<all_urls>"
    ],
    "background": {
        "scripts": ["background.js"]
    },
    "applications": {
        "gecko": {
            "id": "referer-modifier@extension.com"
        }
    }
}

background.js（更新监听逻辑） #

browser.webRequest.onBeforeSendHeaders.addListener(
    function(details) {
        const headers = details.requestHeaders;
        
        // 处理扩展发起的请求（比如Raindrop侧边栏）
        if (details.initiator?.startsWith('moz-extension://')) {
            // 可选：精准匹配Raindrop扩展ID，替换为实际的Raindrop扩展ID
            // const raindropExtId = "raindrop-extension-id-here";
            // if (details.initiator === `moz-extension://${raindropExtId}`) {
                // 执行你的请求头修改逻辑，示例：添加目标主机要求的字段
                headers.push({name: "X-Required-Header", value: "your-value"});
            // }
        }
        // 保留原主框架请求的处理逻辑
        else if (details.frameId === 0) {
            // 原主框架下的请求头修改逻辑
        }

        return {requestHeaders: headers};
    },
    {urls: ["<all_urls>"]},
    ["blocking", "requestHeaders"]
);

注意事项 #

1. 获取Raindrop扩展ID：在Firefox的附加组件管理页面，找到Raindrop.io扩展，查看其详细信息即可获取ID；也可以通过browser.management.getAll() API在扩展中动态获取。
2. 权限验证：现有的webRequest、webRequestBlocking和<all_urls>权限已经足够监听扩展发起的请求，无需额外添加权限。
3. 跨浏览器兼容：如果需要适配Chrome，只需将moz-extension://替换为chrome-extension://即可。

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