页面加载方式不同引发JavaScript执行行为异常：跳转失效问题

问题根源 #

浏览器对window.close()的执行有严格的权限规则：

• 只有由脚本（如window.open()）或用户点击页面内链接触发打开的窗口，当前页面脚本才能调用window.close()关闭它。
• 直接在新标签页粘贴链接打开的窗口，属于浏览器主动创建的独立上下文，window.close()会被浏览器拦截，无法执行，因此跳转代码location.href能正常完成。
• 通过其他页面链接打开的新标签，属于原页面交互触发的窗口，window.close()可正常执行，导致跳转操作还未完成，标签页就被关闭。

解决方案（无需修改外部库代码） #

1. 用用户脚本拦截window.close() #

使用Tampermonkey等用户脚本工具，给目标页面注入代码覆盖window.close()：

// ==UserScript==
// @name        Block Close for Target Page
// @match       https://your-target-domain.com/*
// @grant       none
// ==/UserScript==

// 覆盖close方法，阻止标签页关闭
window.close = () => {};

2. 修改跳转来源的链接属性 #

如果能控制触发跳转的原页面链接，添加rel="noopener"属性：

<a href="https://your-target-domain.com" target="_blank" rel="noopener">打开页面</a>

添加该属性后，新标签页会脱离原页面的控制上下文，window.opener变为null，浏览器会拦截window.close()的执行。

3. 自建中转页面中转跳转 #

创建一个中转页面，先覆盖window.close()再跳转到目标页面：

<html>
<head>
  <script>
    // 提前覆盖close方法
    window.close = () => {};
    // 延迟跳转确保覆盖生效
    setTimeout(() => location.href = "https://your-target-domain.com", 50);
  </script>
</head>
</html>

让用户通过这个中转页面访问目标页面，即可避免标签页被关闭。

内容的提问来源于stack exchange，提问作者swaters095