55

我是Intab的作者，这是一个 Chrome 扩展程序，可让您查看内联链接而不是新选项卡。幕后没有太多花哨的东西，它只是一个 iframe 加载用户单击的 URL。

除了将 X-Frame-Options 标头设置为 DENY 或 SAMEORIGIN 的网站外，它的效果很好。一些非常大的网站，如谷歌和 Facebook 都使用它，这使得体验有点糟糕。

有没有办法解决这个问题？由于我使用的是 Chrome 扩展程序，是否有任何我可以访问的浏览器级别的东西可能会有所帮助？寻找任何想法或帮助！

4

2 回答 2

78

Chrome 提供webRequestAPI 来拦截和修改 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)
);

在清单中，您需要指定webRequest和webRequestBlocking权限，以及您打算拦截的URL 模式"*://*/*"，即"*://www.example.org/*"上面的示例。

于 2013-03-20T21:12:47.153 回答
3

使用 declarativeNetRequest 的 ManifestV3 示例

让我们使用新的declarativeNetRequest API 仅当 iframe 嵌入到我们扩展的页面中时才剥离标头。

清单.json：

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

该declarativeNetRequest权限在安装对话框中添加一个条目，您的扩展程序可以“阻止页面内容”，因此您可以使用declarativeNetRequestWithHostAccess：

manifest.json适用于 Chrome 96 及更高版本，没有安装警告：

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

bg.js：

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'},
        ],
      },
    })),
  });
});
于 2021-09-14T12:28:56.680 回答