Chrome扩展程序中的不可见标签 [英] Invisible tabs in chrome extension
问题描述
我基本上想通过使用Chrome扩展程序来自动化网站.但是该网站有很多客户端代码，因此很难找出我需要提出哪个请求才能获得所需的信息.
I basically want to automate a website by using a Chrome extension. But this website has extremely much client-side code, so it's really hard to find out which request I need to make in order to get the needed information.
我能想到的最简单的方法是使用内容脚本在输入元素和单击按钮中输入文本，像这样(在这种情况下为jQuery):
The easiest way I can think of would be to use a content script to enter text in input elements and click buttons, like this (with jQuery in this case):
$.ready(function(){
$("#input").val("foo");
$("#submit").click();
});
非常类似于此问题:将输入注入Chrome扩展程序打开的标签页，但与该网站的互动不可见.
Quite similar to this question: Injecting input into a tab opened by a Chrome Extension, but the interaction with that website should not be visible.
所以:我可以从扩展程序中打开Chrome中用户看不到的页面，并使用它们与网站进行交互吗?
So: Can I open pages in chrome from an extension, that are not visible to the user and use them to interact with websites?
推荐答案
如果您希望页面完全不可见，我相信唯一的选择是将其加载到后台页面的iframe中.然后，您可以使用内容脚本访问iframe中的页面，就像访问任何常规可见页面一样.
If you want the page to be completely invisible, I believe that the only option is to load it into an iframe on the background page. You can then access the page within the iframe using content scripts, just as you would access any normal visible page.
由于许多网站都使用X-Frame-Options标头限制嵌入，因此在将页面加载到iframe中之前，您可能必须使用webRequest API删除该标头.某些页面还使用其他技术来防止嵌入，这可能会使情况进一步复杂化.
Since many sites limit embedding using the X-Frame-Options header, you will likely have to use the webRequest API to remove that header before loading the page into an iframe. Some pages also use other techniques to prevent embedding that might further complicate this.
示例代码:
manifest.json
manifest.json
{
"manifest_version": 2,
"name": "Hidden page in background",
"description": "Interact with a hidden page in background",
"version": "1.0",
"background": {
"page": "background.html",
"persistent": true
},
"content_scripts": [
{
"matches": ["*://*.google.fr/*"],
"js": ["contentscript.js"],
"all_frames": true
}
],
"permissions": ["*://*.google.fr/*", "webRequest", "webRequestBlocking"]
}
background.html
background.html
<!DOCTYPE html>
<html>
<head>
<script src="background.js"></script>
</head>
<body>
<iframe id="iframe1" width="1000 px" height="600 px" src="http://www.google.fr"></iframe>
</body>
</html>
background.js
background.js
// This is to remove X-Frame-Options header, if present
chrome.webRequest.onHeadersReceived.addListener(
function(info) {
var headers = info.responseHeaders;
var index = headers.findIndex(x=>x.name.toLowerCase() == "x-frame-options");
if (index !=-1) {
headers.splice(index, 1);
}
return {responseHeaders: headers};
},
{
urls: ['*://*.google.fr/*'], //
types: ['sub_frame']
},
['blocking', 'responseHeaders']
);
contentscript.js
contentscript.js
var elementToInsert = document.createElement("h1");
elementToInsert.textContent = "This text comes from my content script.";
document.body.insertBefore(elementToInsert, document.body.firstChild);
注释对:
-
X-Frame-Options标头的删除不限于此处的后台页面.它将允许将相关页面也嵌入到其他任何页面的iframe中.不幸的是，Chrome似乎不支持ALLOW-FROM uri值，该值只能用于限制嵌入到您的扩展程序中. - 内容脚本将注入到此处的所有页面.您可以仅以编程方式将其注入到后台页面上的iframe中，但这会变得更加复杂.
- 我以
www.google.fr为例，因为它使用了X-Frame-Options，但没有使用任何其他技术来防止嵌入.我使用的是法国域名，因为google.com往往会自动重定向到本地国家/地区级域名.
- The removal of
X-Frame-Optionsheader is not limited to the background page here. It would allow embedding of the relevant page in iframes on any other page as well. Unfortunately, Chrome does not seem to support theALLOW-FROM urivalue that could be used to limit embedding to your extension only. - Content script is being injected to all pages here. You could inject it programmatically only to the iframe on the background page, but that gets a bit more complicated.
- I used
www.google.fras an example, because it usesX-Frame-Options, but does not use any other techniques to prevent embedding. I used the French domain becausegoogle.comtends to redirect to local country-level domains automatically.
这篇关于Chrome扩展程序中的不可见标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
