如何在我的扩展程序中使用iframe嵌入youtube频道页面？

Question

我正在创建扩展程序以使用标记整理youtube渠道。它有像这样的URL的角度前端

MOZ扩展：//f78b3bd9-a210-41c5-9d8d-9b7ab3717f6e/index.html#/channel/UCtinbF-Q-fVthA0qrFQTgXQ

我想使用iframe嵌入频道的页面，但安全策略不允许我这样做。

X-Frame-Options拒绝加载：https://www.youtube.com/不允许跨源框架。

所以我尝试修改X-Frame-Options，但它不会改变任何东西（不添加标题）。

我做了什么：

1添加了manifest.json的权限：

“webRequest”，“：//。youtube.com /”，“：//www.youtube.com/*”

2在background.js中写了一些代码

function addFramePermissions(e) {
    console.log("Loading url: " + e.url);

    var allowedHeaders = [];

    for (var header of e.responseHeaders) {
        if (header.name.toLowerCase() !== "x-frame-options") {
            allowedHeaders.push(header);
        } else {
            console.log('x-frame-options found!!!');
        }
    }

    e.responseHeaders = allowedHeaders;

    return { responseHeaders: e.responseHeaders };
}


browser.webRequest.onHeadersReceived.addListener(
    addFramePermissions,
    {
        urls: [
            "*://*.youtube.com/*",
            "*://youtube.com/*"
        ]
    },
    ["blocking", "responseHeaders"]
);

代码达到功能，我可以看到“x-frame-options found !!!”在控制台中，但是firefox的网络监视器显示x-frame-options存在且值为SAMEORIGIN

Answer 1

我在Chrome中运行了我的扩展程序，Chrome说我忘了在权限中添加“webRequestBlocking”。谢谢，Chrome！