javascript 在Chrome扩展中绕过X框架选项DENY?

yhived7q  于 2022-12-17  发布在  Java
关注(0)|答案(3)|浏览(185)

我是Intab的作者,这是一个Chrome扩展程序,可以让你查看内联链接,而不是新标签页。幕后没有太多花哨的东西,它只是一个加载用户点击的URL的iframe。
除了将X-Frame-Options头设置为DENY或SAMEORIGIN的网站外,它工作得很好。一些真正的大网站,如Google和Facebook都使用它,这使得体验有点不稳定。
有什么办法可以解决这个问题吗?因为我使用的是Chrome扩展,有没有浏览器级别的东西可以帮助我?寻找任何想法或帮助!

fykwrbwg

fykwrbwg1#

Chrome提供了webRequest API来拦截和修改HTTP请求,您可以删除X-Frame-Options头文件以允许在iframe中内联页面。

chrome.webRequest.onHeadersReceived.addListener(
    function(info) {
        var headers = info.responseHeaders;
        for (var i=headers.length-1; i>=0; --i) {
            var header = headers[i].name.toLowerCase();
            if (header == 'x-frame-options' || header == 'frame-options') {
                headers.splice(i, 1); // Remove header
            }
        }
        return {responseHeaders: headers};
    }, {
        urls: [
            '*://*/*', // Pattern to match all http(s) pages
            // '*://*.example.org/*', // Pattern to match one http(s) site
        ], 
        types: [ 'sub_frame' ]
    }, [
        'blocking',
        'responseHeaders',
        // Modern Chrome needs 'extraHeaders' to see and change this header,
        // so the following code evaluates to 'extraHeaders' only in modern Chrome.
        chrome.webRequest.OnHeadersReceivedOptions.EXTRA_HEADERS,
    ].filter(Boolean)
);

在清单中,您需要指定webRequestwebRequestBlocking权限,以及您打算拦截的URLs patterns,即上面示例中的"*://*/*""*://www.example.org/*"

kq0g1dla

kq0g1dla2#

使用declarativeNetRequest的清单V3示例

另请参见本答案末尾的警告!

manifest.json适用于Chrome 96及更新版本

在安装过程中不显示“阻止页面内容”的单独权限

"minimum_chrome_version": "96",
  "permissions": ["declarativeNetRequestWithHostAccess"],
  "host_permissions": ["*://*.example.com/"],
  "background": {"service_worker": "bg.js"},

bg.js适用于使用initiatorDomainsrequestDomains的Chrome 101及更新版本

(don'不要忘记在manifest.json中添加"minimum_chrome_version": "101"

const iframeHosts = [
  'example.com',
];
chrome.runtime.onInstalled.addListener(() => {
  const RULE = {
    id: 1,
    condition: {
      initiatorDomains: [chrome.runtime.id],
      requestDomains: iframeHosts,
      resourceTypes: ['sub_frame'],
    },
    action: {
      type: 'modifyHeaders',
      responseHeaders: [
        {header: 'X-Frame-Options', operation: 'remove'},
        {header: 'Frame-Options', operation: 'remove'},
      ],
    },
  };
  chrome.declarativeNetRequest.updateDynamicRules({
    removeRuleIds: [RULE.id],
    addRules: [RULE],
  });
});

旧 chrome 84-100

如果您的扩展应该与这些旧版本兼容,请使用以下代码。

manifest.json适用于Chrome 84及更新版本

显示了在安装过程中对“阻止页面内容”的单独权限

"permissions": ["declarativeNetRequest"],
  "host_permissions": ["*://*.example.com/"],
  "background": {"service_worker": "bg.js"},

bg.js适用于Chrome 84及更新版本,使用现已弃用的domains

const iframeHosts = [
  'example.com',
];
chrome.runtime.onInstalled.addListener(() => {
  chrome.declarativeNetRequest.updateDynamicRules({
    removeRuleIds: iframeHosts.map((h, i) => i + 1),
    addRules: iframeHosts.map((h, i) => ({
      id: i + 1,
      condition: {
        domains: [chrome.runtime.id],
        urlFilter: `||${h}/`,
        resourceTypes: ['sub_frame'],
      },
      action: {
        type: 'modifyHeaders',
        responseHeaders: [
          {header: 'X-Frame-Options', operation: 'remove'},
          {header: 'Frame-Options', operation: 'remove'},
        ],
      },
    })),
  });
});

警告:当心现场服务人员

在添加iframe或打开扩展页面之前,您可能需要删除站点的service worker并清除其缓存,因为许多现代站点使用service worker来创建页面,而无需进行网络请求,从而忽略了我们的头剥离规则。
1.将"browsingData"添加到清单. json中的"permissions"
1.清除软件:

function removeSW(url) {
  return chrome.browsingData.remove({
    origins: [new URL(url).origin],
  }, {
    cacheStorage: true,
    serviceWorkers: true,
  });
}

//如果在DOM中添加iframe元素:

async function addIframe(url, parent = document.body) {
  await removeSW(url);
  const el = document.createElement('iframe');
  parent.appendChild(el);
  el.src = url;
  return el;
}

//如果打开HTML中包含<iframe>元素的扩展页面:

async function openPage(url) {
  await removeSW('https://example.com/');
  return chrome.tabs.create({url});
}
juud5qan

juud5qan3#

您可以尝试使用Frame扩展,该扩展允许用户丢弃X-Frame-Options和Content-Security-Policy HTTP响应头,从而允许对页面进行iframe。
该代码在github上提供
它基于ManifestV 3,并与谷歌和Facebook完美配合.

相关问题