javascript - 书签打开 URL 窗口，等待加载，关闭窗口

Question

免责声明:由于安全问题，我实际上并不认为这是可能的，但在我完全放弃之前我不得不问:是否有可能使用 Javascript 小书签打开一个 URL 窗口并让它自动运行在该内容加载后关闭？

我的用法是暂时禁用Pi-hole使用它的 API。我的当前代码适用于一个简单的超时，但我想让它确保在关闭窗口之前加载页面。

这是我目前的(扩展的)代码:

(() => {
    t = prompt('Disable time (seconds)',30);
    if (t) {
        w = window.open(`http://___IP___/admin/api.php?disable=${t}&auth=___APIKEY___`,'pi-disable','left=20,top=20,width=300,height=200');
        setTimeout(() => w.close(), 1000);
    }
})()

如果它不明显，我不控制 URL 输出，所以我不能在那里添加脚本来关闭它，否则这将不是问题。作为引用，输出只是一个 JSON 字符串:{"status":"disabled"}

只是为了好玩，我尝试使用 fetch() 或添加 iframe，但正如预期的那样，这些出现了其他问题(混合内容、CORS 政策等)。

Answer 1

我认为这对于小书签是不可能的，因为它只能在您按下小书签按钮的页面上运行其代码。如果您打开新域的窗口，小书签将无法影响它或观察它的加载。

您可以另一个在新窗口打开时按下的小书签，但那样会破坏自动化的意义

但是，您可以使用用户脚本执行此操作，它可以在打开页面时自动运行。当 API 站点打开时，让用户脚本监视页面加载，然后发布一条消息告诉您的小书签页面已完成加载，可以关闭了。类似的东西:

(() => {
    const t = prompt('Disable time (seconds)',30);
    if (!t) return;
    const w = window.open(`http://___IP___/admin/api.php?disable=${t}&auth=___APIKEY___`,'pi-disable','left=20,top=20,width=300,height=200');
    window.addEventListener('message', (messageEvent) => {
        if (messageEvent.data === 'api page loaded') w.close();
    });
})()

并且，使用像 Tampermonkey 这样的用户脚本管理器:

// ==UserScript==
// @name         Watch for API pageload
// @match        http://___IP___/*
// @grant        none
// ==/UserScript==

window.addEventListener('DOMContentLoaded', () => {
  window.opener.postMessage('api page loaded', '*');
});