简体   繁体   English

如何从用户脚本访问iframe的javascript?

[英]How do I access an iframe's javascript from a userscript?

I'm trying to use a Chrome userscript or a Tampermonkey script to modify a page with this structure: 我正在尝试使用Chrome用户脚本或Tampermonkey脚本来修改具有以下结构的页面:

<body>
content up here

<iframe id="main" src="foo.dat"></iframe>
</body>

The iframe is same-origin. iframe是同源的。

I need to access a function that's in iframe#main . 我需要访问iframe#main的函数。 I thought I could use unsafeWindow to get it but I keep getting nothing or undefined returned. 以为我可以使用unsafeWindow来获取它,但我一直没有得到任何东西或者undefined返回。

I've tried a slew of things: 我尝试了很多东西:

  • Tried creating a new script element in the iframe , but it attaches to the parent even with $('frame#main').contents().append(script) or $('frame#main').contents()[0].createElement('script') 尝试在iframe创建一个新的脚本元素,但它连接到父级,即使是$('frame#main').contents().append(script)$('frame#main').contents()[0].createElement('script')

  • window.frames["#main"].contentWindow returns undefined. window.frames["#main"].contentWindow返回undefined。

I have tried many other things I can't recall at the moment, but I have exhausted all my ideas and feel that I'm typing rubbish more than anything that counts. 我已经尝试了许多其他我不记得的事情,但是我已经用尽了所有的想法,觉得我输入的垃圾比任何重要的垃圾都要多。
I can't figure out how to play with the unsafeWindow of the iFrame. 我无法弄清楚如何使用iFrame的unsafeWindow

  1. unsafeWindow doesn't play nice with frames/iframes on Chrome, Tampermonkey, or Firefox. unsafeWindow与Chrome,Tampermonkey或Firefox上的frame / iframe不相称。
  2. Trying to access global (to the frame) JS with jQuery, like that, will not work. 尝试使用jQuery访问全局(到框架)JS,就像这样,将无法工作。
  3. userscripts will run on iframes that meet the @include , @exclude , and/or @match requirements. userscripts将在满足I帧运行@include@exclude ,和/或@match要求。

So, you need to account for the multiple script runs and then you have two basic approaches, depending on what you are trying to accomplish. 因此,您需要考虑多个脚本运行,然后您有两种基本方法,具体取决于您要完成的操作。 You can: 您可以:

(A) Tailor the script to specific frame(s), as in this answer . (A)将脚本定制到特定的框架,如本答案所示

or (B) inject your JS and use the special frames object to grab the specific function you want. 或者(B)注入你的JS并使用特殊的frames对象来获取你想要的特定功能。

The following script demonstrates both. 以下脚本演示了两者。 Install it in Tampermonkey 1 (or Firefox Greasemonkey), and then visit this test page at jsBin . 将其安装在Tampermonkey 1 (或Firefox Greasemonkey)中,然后在jsBin上访问此测试页

// ==UserScript==
// @name        _Calling iframe functions
// @namespace   _pc
// @include     http://jsbin.com/ugoruz/*
// @include     http://jsbin.com/okequw/*
// ==/UserScript==

console.log ("Script start...");

/*--- This next function call will work in Firefox or Tampermonkey ONLY,
    not pure Chrome userscript.
*/
console.log ("calling functionOfInterest ()...");
unsafeWindow.functionOfInterest ();


if (window.top === window.self) {
    //--- Code to run when page is the main site...
    console.log ("Userscript is in the MAIN page.");

    //--- The frames object does not play nice with unsafeWindow.
    /*--- These next three work in Firefox, but not Tampermonkey, nor pure Chrome.
    console.log ("1", frames[1].variableOfInterest);                // undefined
    console.log ("2", unsafeWindow.frames[1].variableOfInterest);   // undefined
    console.log ("3", frames[1].unsafeWindow);                      // undefined
    */
    /*--- This next would cause a silent crash, all browsers...
    console.log ("4", unsafeWindow.frames[1].unsafeWindow.variableOfInterest);
    */

    //--- To get at iFramed JS, we must inject our JS.
    withPages_jQuery (demoAccessToFramedJS);
}
else {
    //--- Code to run when page is in an iframe...
    console.log ("Userscript is in the FRAMED page.");
    console.log ("The frame's ID is:", window.self.frameElement.id);
}


function demoAccessToFramedJS ($) {
    $("body").prepend (
          '<button id="gmMain">Run JS on main window</button>'
        + '<button id="gmFrame">Run JS on iframe</button>'
    );

    $("#gmMain, #gmFrame").click ( function () {
        if (this.id === "gmMain") {
            functionOfInterest ();
        }
        else {
            frames[1].functionOfInterest ();
        }
        console.log (this.id + "was clicked.");
    } );
}

function withPages_jQuery (NAMED_FunctionToRun) {
    //--- Use named functions for clarity and debugging...
    var funcText        = NAMED_FunctionToRun.toString ();
    var funcName        = funcText.replace (/^function\s+(\w+)\s*\((.|\n|\r)+$/, "$1");
    var script          = document.createElement ("script");
    script.textContent  = funcText + "\n\n";
    script.textContent += 'jQuery(document).ready(function() {'+funcName+'(jQuery);});';
    document.body.appendChild (script);
};

console.log ("Script end");



You will see that the script runs a function from both the main page and from the iframe. 您将看到该脚本从主页面和iframe运行一个函数。 The console output (Tampermonkey) will be: 控制台输出(Tampermonkey)将是:

Tampermonkey started
Script start...
calling functionOfInterest ()...
Userscript is in the MAIN page.
Script end
Tampermonkey started
Script start...
calling functionOfInterest ()...
Userscript is in the FRAMED page.
The frame's ID is: iframe2
Script end

1 It will also work as a straight-up Chrome userscript if you remove the unsafeWindow line(s). 1如果删除unsafeWindow行,它也可以作为直接的Chrome用户脚本。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM