如何从主选项卡在新选项卡上运行功能？（谷歌浏览器）答案

【问题标题】：How to run function on new tab from main tab? (Google Chrome)如何从主选项卡在新选项卡上运行功能？（谷歌浏览器）
【发布时间】：2016-07-05 22:18:07
【问题描述】：

我需要打开控制台并在新选项卡上运行一个功能，该功能是我使用 javascrip 打开的。打开部分很简单，但是如何在其他选项卡上运行功能？

var google = window.open("http://google.com")

【问题讨论】：

我不相信这是可能的...如果网站可以访问其他网站并在其他网站上运行功能，这将构成安全漏洞...请考虑以下情况：网站要求您登录 Google ，打开一个弹出窗口进行登录。该网页在 Google 页面上运行一项功能，以从输入字段中获取您的密码并将其发送到服务器。我想这个场景在设计弹出系统时一定是经过了他们的思考。我能想到的唯一方法是，并且只有当弹出窗口在同一个域中时，才使用 localStorage 来存储函数，并让弹出页面自己运行函数。

标签： javascript google-chrome tabs

【解决方案1】：

阅读您的问题后，您似乎希望打开开发控制台以显示弹出窗口？假设这是您要查找的内容，您应该能够右键单击弹出窗口并点击“检查元素”。然后从那里转到控制台。

如果您尝试以编程方式从父级运行一个函数到弹出窗口，这里有一个想法。

假设新窗口与您的域位于同一域中，则此解决方案可能适合您。（浏览器支持有限）

在父页面上：

//store the function in localStorage
localStorage.runThis = function(){ alert("Hello world"); }
//open the popup window
newWindow = window.open("http://your-domain.com/your-page");

在弹出的页面上打开：

//check if the function has been stored
if(typeof localStorage.runThis === "function"){
    //run the function in localStorage
    localStorage.runThis();
}

一个问题是此方法依赖于满足以下条件：

浏览器支持本地存储
父页面和弹出页面来自同一来源
弹出页面必须实际查找相关函数并执行函数本身

这样做的一个缺点是，如果有人去 Javascript 控制台并将他们自己的函数设置到 localStorage，弹出页面会看到他们的函数并运行潜在的危险代码 - 一个安全漏洞。

【讨论】：

感谢您的回答，但我需要打开新标签，按子标签上的按钮，然后在几秒钟后关闭子标签。我在打开和关闭子选项卡时没有问题，但我不知道如何从父选项卡在子选项卡上运行函数或命令，因为脚本在父选项卡上运行，它应该重复打开同一页面，按下一个按钮并关闭它。
也许在子页面上按下按钮时，您可以在从该按钮关闭子页面之前将选择保存在 localStorage 中，然后当父母看到子页面已通过按下按钮关闭时，它检查 localStorage 的选择？例如，在子页面上有按钮 do:localStorage.choice = (whateverTheChoiceIs); window.close();，在父页面上有 child.onclose 的脚本检查 localStorage.choice 值？

【解决方案2】：

一个常见的解决方案是使用localstorage。

if (typeof(Storage) !== "undefined") {
  // Code for localStorage/sessionStorage.
  localStorage.setItem("lastname", "Smith");
  var lastname = localStorage.getItem("lastname");
} else {
    // Sorry! No Web Storage support..
}

【讨论】：