Question

我在网页上加载了iframe。可以从扩展名调用父网页的iframe中的函数吗？

已完成所有帧：在manifest.json

中为true

iframe.html如下：

<body>
    <div class="row">                       
        <button type="button" class="btn btn-primary" id="manual-dial" onclick="dial()";>DIAL</button>
    </div>
</body>

content.js如下：

/* cnt access frame id */
chrome.runtime.sendMessage(window.parent.frames[1].document.id);
window.parent.frames[1].document.id.onload = function() {
    // want to call dial() of iframe
    chrome.runtime.sendMessage("this is my response");
}

background.js

chrome.runtime.onMessage.addListener(function(response,sender,sendResponse)   {
    alert(response);
});

Answer 1

您可以尝试以下操作：

iframe.html

<body> 
   <div class="row"> 
    <button type="button" class="btn btn-primary" id="manual-dial" onclick="dial()";>DIAL</button>
   </div> 
</body> 

<script type="text/javascript"> 
   function dial(){ 
      var portName = "dialPort" 
      var port = chrome.runtime.connect({name: portName}); 
      
      //this postMessage is just to stimulate the listener in the background.js 
      port.postMessage({any: "anyThing"});

      // You can recive the reponse 
      port.onMessage.addListener(function(msg) {
           /** Here you can exec any function **/ 
      });

</script>

background.js

chrome.runtime.onConnect.addListener(function(port) {

if(port.name == "dialPort"){

    port.onMessage.addListener(function(msg) {
        /**
          Here you can exec any function 
        **/

        //And also, you can send the response to the iframe
        port.postMessage({response: "Any Thing..."});
     
    });     
}});

您还可以查看Chrome文档，在这里您将找到更多实现https://developer.chrome.com/apps/messaging#connect

我希望对您有帮助

是否可以从扩展名调用父网页的iframe中的函数

1 个答案: