Chrome中调用window.opener.location.reload(true)无法刷新父窗口问题

已花费数日调试并搜索解决方案，对这个曾正常运行的Bug感到困惑。contact.php通过按钮打开新子窗口，代码如下：

<form action="sendcontact.php" id="sendcontact" method="post">
  <input type="hidden" name="csrftoken" value="ABCD1234">
</form>   
<button formtarget="_blank" form="sendcontact" name="accountid" id="accountid" value="contact">Submit</button>

子窗口sendcontact.php的表单会自提交至自身，提交后希望刷新父窗口contact.php，但调用window.opener.location.reload(true);无效，控制台提示空引用。尝试alert(window.opener)返回NULL，即使子窗口首次加载时也是如此。window.parent和window.top同样无效。浏览器为Chrome 110.0.5481.180（官方版本，64位）。

原因分析及解决办法 #

1. 浏览器隐私策略限制 #

Chrome等现代浏览器会限制window.opener的访问权限，尤其是当子窗口并非由父窗口主动调用window.open()创建时，浏览器会默认切断opener关联，防止滥用。

解决办法：
改用JS主动打开子窗口并提交表单，确保opener被正确关联：

<form action="sendcontact.php" id="sendcontact" method="post">
  <input type="hidden" name="csrftoken" value="ABCD1234">
  <input type="hidden" name="accountid" value="contact">
</form>   
<button id="accountid">Submit</button>

<script>
document.getElementById('accountid').addEventListener('click', function(e) {
  e.preventDefault();
  // 主动创建子窗口
  const childWindow = window.open('', '_blank');
  // 将表单目标指向新窗口并提交
  const form = document.getElementById('sendcontact');
  form.target = '_blank';
  form.submit();
});
</script>

2. 子窗口自提交导致opener丢失 #

当sendcontact.php整页刷新自提交时，浏览器可能会重置窗口上下文，导致原有的opener引用失效。

解决办法：
避免子窗口整页刷新，改用AJAX提交表单后直接操作父窗口：

<!-- sendcontact.php 中的表单 -->
<form id="selfSubmitForm" method="post">
  <!-- 现有表单字段 -->
  <button type="submit">提交</button>
</form>

<script>
document.getElementById('selfSubmitForm').addEventListener('submit', function(e) {
  e.preventDefault();
  // 用AJAX提交表单
  fetch(window.location.href, {
    method: 'POST',
    body: new FormData(this)
  }).then(res => {
    if (res.ok && window.opener) {
      window.opener.location.reload(true);
      window.close(); // 可选：提交完成后关闭子窗口
    }
  });
});
</script>

3. 同源策略限制 #

如果contact.php和sendcontact.php不在同一同源环境（协议、域名、端口任一不同），浏览器会完全阻止window.opener的访问。

解决办法：

• 优先确保两个页面处于同一同源环境。
• 若必须跨域，使用postMessage实现父子窗口通信：
  父窗口（contact.php）添加监听：

  window.addEventListener('message', function(event) {
    // 验证消息来源，防止恶意请求
    if (event.origin === 'https://your-child-domain.com') {
      if (event.data === 'refreshParent') {
        window.location.reload(true);
      }
    }
  });
  

  子窗口（sendcontact.php）提交完成后发送消息：

  window.opener.postMessage('refreshParent', 'https://your-parent-domain.com');
  window.close();
  

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