如何用JavaScript关闭通过POST方式打开的浏览器标签页

你当前的代码通过创建表单提交打开新标签页，但这种方式无法获取新窗口的引用，所以没法直接在原页面调用close()关闭它。下面提供两种可行的解决方案：

方案一：修改打开逻辑，获取新窗口引用 #

直接用window.open()先打开空白窗口，再在新窗口内创建表单提交，这样就能拿到窗口引用，后续随时可以关闭：

function openNewWindowWithPost(url, params) {
  // 打开空白窗口并保存引用
  const newWindow = window.open('', '_blank');
  if (!newWindow) {
    alert('浏览器弹窗被拦截，请允许弹窗后重试');
    return null;
  }

  // 在新窗口中创建POST表单
  const form = newWindow.document.createElement('form');
  form.method = 'POST';
  form.action = url;
  
  // 添加参数
  for (const key in params) {
    if (params.hasOwnProperty(key)) {
      const input = newWindow.document.createElement('input');
      input.type = 'hidden';
      input.name = key;
      input.value = params[key];
      form.appendChild(input);
    }
  }

  newWindow.document.body.appendChild(form);
  form.submit();

  // 返回窗口引用，供后续关闭使用
  return newWindow;
}

// 使用示例
const targetWindow = openNewWindowWithPost('你的目标URL', { param1: '值1', param2: '值2' });

// 需要关闭时调用
// targetWindow.close();

方案二：新页面配合，通过消息通信关闭 #

如果无法修改打开窗口的逻辑，可让新页面监听消息事件，原页面通过postMessage触发关闭（要求新页面与原页面同域，或新页面允许跨域消息）：

步骤1：在新页面添加监听代码 #

// 新页面的JS代码
window.addEventListener('message', (event) => {
  // 验证消息来源，避免恶意调用
  if (event.origin === '原页面的域名' && event.data === 'closeTab') {
    window.close();
  }
});

步骤2：原页面发送关闭指令 #

如果原页面能通过方案一的方式获取新窗口引用，直接发送消息：

targetWindow.postMessage('closeTab', '新页面的域名');

如果原页面没有窗口引用，可遍历window.frames查找（仅同域有效）：

for (const frame of window.frames) {
  try {
    frame.postMessage('closeTab', '*'); // 同域下建议指定具体域名，提升安全性
  } catch (e) {
    // 跨域会报错，直接跳过
  }
}

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