通过 Chrome 扩展避免跨源策略
Avoid cross-origin policy via Chrome extension
站点 A 是一个 <iframe>
包含站点 B 的网站。在带有扩展名的 chrome 浏览器上,这是 运行。
我可以控制扩展程序。我想做的是让用户控制编辑网站 B 的部分内容。
当用户按下扩展程序上的按钮时将调用以下内容。目的是加载 jQuery 以便我可以使用它,定位页面上的 iframe,进入 iframe 然后更改其主体颜色。
chrome.tabs.executeScript(null, {file: 'assets/jquery.min.js'}, function () {
chrome.tabs.executeScript({
code: "jQuery('iframe').contents().find('body').css('backgroundColor', 'red');"
});
});
站点 A 和站点 B 在不同的域中,因此同源策略生效。还值得注意的是,站点 B 没有授予站点 A 的跨源访问权限。我也不是站点 A 的所有者或站点 B 因此无法修改其跨源策略。
我希望当 运行 从扩展中获得用户的更多同意时,我能够绕过同源策略并执行上述操作。
如果您希望将脚本注入到框架中,您可以使用 allFrames
选项将代码注入到页面的所有框架中。
在 运行 代码之前,您必须检查您是否在 A 或 B 内:您可以通过比较 window.self
和 window.parent
来完成此操作。在顶部框架 (A) 中,它们将是相同的对象,但在 <iframe>
(如 B)中,它们将不同。
这里是:
chrome.tabs.executeScript(null, {file: 'assets/jquery.min.js', allFrames: true}, function () {
chrome.tabs.executeScript({
code: "if (self != parent) jQuery('body').css('backgroundColor', 'red');",
allFrames: true
});
});
注意:自 2021 年 1 月起,对于 Manivest V3,请改用 chrome.scripting.executeScript()
。
上面的代码会同时注入A和B,但只会在B中执行。如果A中有多个帧,你还必须检查帧是否正确,例如window.location.hostname
.
站点 A 是一个 <iframe>
包含站点 B 的网站。在带有扩展名的 chrome 浏览器上,这是 运行。
我可以控制扩展程序。我想做的是让用户控制编辑网站 B 的部分内容。
当用户按下扩展程序上的按钮时将调用以下内容。目的是加载 jQuery 以便我可以使用它,定位页面上的 iframe,进入 iframe 然后更改其主体颜色。
chrome.tabs.executeScript(null, {file: 'assets/jquery.min.js'}, function () {
chrome.tabs.executeScript({
code: "jQuery('iframe').contents().find('body').css('backgroundColor', 'red');"
});
});
站点 A 和站点 B 在不同的域中,因此同源策略生效。还值得注意的是,站点 B 没有授予站点 A 的跨源访问权限。我也不是站点 A 的所有者或站点 B 因此无法修改其跨源策略。
我希望当 运行 从扩展中获得用户的更多同意时,我能够绕过同源策略并执行上述操作。
如果您希望将脚本注入到框架中,您可以使用 allFrames
选项将代码注入到页面的所有框架中。
在 运行 代码之前,您必须检查您是否在 A 或 B 内:您可以通过比较 window.self
和 window.parent
来完成此操作。在顶部框架 (A) 中,它们将是相同的对象,但在 <iframe>
(如 B)中,它们将不同。
这里是:
chrome.tabs.executeScript(null, {file: 'assets/jquery.min.js', allFrames: true}, function () {
chrome.tabs.executeScript({
code: "if (self != parent) jQuery('body').css('backgroundColor', 'red');",
allFrames: true
});
});
注意:自 2021 年 1 月起,对于 Manivest V3,请改用 chrome.scripting.executeScript()
。
上面的代码会同时注入A和B,但只会在B中执行。如果A中有多个帧,你还必须检查帧是否正确,例如window.location.hostname
.