使用脚本注入打开的窗口 [英] Inject an opened window with script

问题描述

这个问题要求使用 window.open 打开一个新窗口，然后用脚本注入它。由于跨域安全问题，这是不可能的。

This question asks for a way to open a new window using window.open and then inject it with a script. It was not possible because of cross-domain security issues.

然而，我的问题是我想做同样的事情，除了从同一个域到同一个域域。这可能吗？

However, my problem is that I want to do the exact same thing, except from the same domain to the same domain. Is this possible?

请注意 .write 无法解决此问题，因为它会擦除页面中的所有html首先。

Note that .write does not solve this problem because it wipes all the html from the page first.

推荐答案

你可以这样做：

var theWindow = window.open('http://stackoverflow.com'),
    theDoc = theWindow.document,
    theScript = document.createElement('script');
function injectThis() {
    // The code you want to inject goes here
    alert(document.body.innerHTML);
}
theScript.innerHTML = 'window.onload = ' + injectThis.toString() + ';';
theDoc.body.appendChild(theScript);

这似乎也有效：

var theWindow = window.open('http://stackoverflow.com'),
    theScript = document.createElement('script');
function injectThis() {
    // The code you want to inject goes here
    alert(document.body.innerHTML);
}
// Self executing function
theScript.innerHTML = '(' + injectThis.toString() + '());';
theWindow.onload = function () {
    // Append the script to the new window's body.
    // Only seems to work with `this`
    this.document.body.appendChild(theScript);
};

如果由于某种原因你想使用eval：

var theWindow = window.open('http://stackoverflow.com'),
    theScript;
function injectThis() {
    // The code you want to inject goes here
    alert(document.body.innerHTML);
}
// Self executing function
theScript = '(' + injectThis.toString() + '());';
theWindow.onload = function () {
    this.eval(theScript);
};

这是做什么的（第一位代码的解释。所有例子都非常相似） ：

• 打开新窗口


• 获取对新窗口的引用 document


• 创建一个脚本元素


• 将所有想要注入的代码放入函数


• 更改脚本的 innerHTML 以在加载窗口
  时加载所述函数，并使用 window.onload 事件（您也可以使用 addEventListener ）。为方便起见，我使用了 toString（），因此您不必连接一堆字符串。 toString 基本上将整个 injectThis 函数作为字符串返回。


• 附加脚本到新窗口的 document.body ，它实际上不会将它附加到加载的文档中，它会在加载之前附加它（到空体），并且这就是为什么你必须使用 window.onload ，以便你的脚本可以操作新文件。

• Opens the new window
• Gets a reference to the new window's document
• Creates a script element
• Places all the code you want to 'inject' into a function
• Changes the script's innerHTML to load said function when the window loads, with the window.onload event (you can also use addEventListener). I used toString() for convenience, so you don't have to concatenate a bunch of strings. toString basically returns the whole injectThis function as a string.
• Appends the script to the new window's document.body, it won't actually append it to the document that is loaded, it appends it before it loads (to an empty body), and that's why you have to use window.onload, so that your script can manipulate the new document.

使用 window.addEventListener（'load'，injectThis.toString（））; 而不是窗口可能是个好主意.onload ，万一你的新页面中已经有一个使用 window.onload 事件的脚本（它会覆盖注入脚本） 。

It's probably a good idea to use window.addEventListener('load', injectThis.toString()); instead of window.onload, in case you already have a script within your new page that uses the window.onload event (it'd overwrite the injection script).

请注意，您可以在 injectThis 函数内执行任何操作：追加DIV，执行DOM查询，添加偶数更多脚本等...

Note that you can do anything inside of the injectThis function: append DIVs, do DOM queries, add even more scripts, etc...

另请注意，您可以在 theWindow.onload e发泄，使用此。

Also note that you can manipulate the new window's DOM inside of the theWindow.onload event, using this.

这篇关于使用脚本注入打开的窗口的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！