Electron中window.open打开URL时加载屏实现及Cookie丢失问题

1. 修复Cookie/会话丢失问题 #

你的代码丢失Cookie的核心原因是：手动创建BrowserWindow时默认会生成全新的会话实例，无法继承父窗口的Cookie、会话存储等数据。只需在创建新窗口时指定复用父窗口的会话即可解决：

window.webContents.on("new-window", (event, url) => {
  event.preventDefault();

  // 创建加载屏窗口，绑定父窗口确保层级关联
  const loading = new BrowserWindow({ 
    width: 300, 
    height: 300, 
    transparent: true, 
    frame: false, 
    alwaysOnTop: true,
    parent: window
  });
  loading.loadURL(`file://${__dirname}/splash.html`);
  loading.show();

  // 创建新窗口，关键：复用父窗口会话以保留Cookie
  const win = new BrowserWindow({ 
    show: false, 
    width: 1200, 
    height: 1000,
    webPreferences: {
      session: window.webContents.session
    }
  });

  // 监听页面加载完成事件，切换显示状态
  win.webContents.once("dom-ready", () => {
    win.show();
    loading.hide();
  });

  // 新窗口关闭时销毁加载屏，避免内存泄漏
  win.on("closed", () => {
    loading.destroy();
  });

  win.loadURL(url);
  event.newGuest = win; // 让window.open返回的代理对象关联到新窗口，保留原生行为
});

2. 关于直接获取window.open的dom-ready回调 #

Electron中window.open()返回的是BrowserWindowProxy对象，它没有直接暴露dom-ready事件的监听接口。因此仍需通过主进程的new-window事件拦截处理——这种方式既能完整保留window.open的原生行为（比如返回的代理对象可控制窗口），又能插入加载屏逻辑，是当前最可靠的实现方式。

可选优化 #

• 若需要等待页面所有资源加载完成再隐藏加载屏，可将dom-ready替换为did-finish-load事件
• 可给加载屏添加动画过渡，提升用户体验

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