NWJS通过window.location.href跳转后菜单失效问题求助

我来帮你分析下这个问题的根源，再给你几个可行的解决方案：

问题本质 #

当你用window.location.href跳转到外部URL时，当前NWJS渲染进程的整个上下文都被替换了——原来的本地页面（拥有NWJS API访问权限）被外部站点完全覆盖。外部站点无法访问NWJS的nw.Menu这类API，而且你最初绑定菜单时依赖的是旧的window对象，跳转后这个上下文已经不存在了，菜单自然就失效了。

可行解决方案 #

方案1：用新窗口打开外部链接（最推荐） #

修改菜单的点击事件，改用nw.Window.open来打开外部URL，这样原窗口的菜单始终处于NWJS的合法上下文里，不会受跳转影响：

var menu = new nw.Menu({ type: 'menubar' });
var menuItems = new nw.Menu();

menuItems.append( new nw.MenuItem({
  label: 'Surf Google',
  click: function() {
    nw.Window.open('https://google.com', {
      // 可根据需求配置窗口参数，比如尺寸、是否显示菜单栏等
      width: 800,
      height: 600,
      frame: true
    });
  }
}) );

menuItems.append( new nw.MenuItem({
  label: 'Surf Github',
  click: function() {
    nw.Window.open('https://github.com', {
      width: 800,
      height: 600,
      frame: true
    });
  }
}) );

menu.append( new nw.MenuItem({ label: "The Menu", submenu: menuItems }) );
var w = nw.Window.get();
w.menu = menu;

方案2：用<webview>标签在当前窗口加载外部内容 #

如果需要在原窗口内展示外部内容，同时保留菜单功能，可以用NWJS的<webview>标签来隔离外部内容。

首先在你的主页面添加webview容器：

<webview id="external-view" style="width: 100vw; height: 100vh; border: none;"></webview>

然后修改菜单点击事件来控制webview的加载：

var menu = new nw.Menu({ type: 'menubar' });
var menuItems = new nw.Menu();
const webview = document.getElementById('external-view');

menuItems.append( new nw.MenuItem({
  label: 'Surf Google',
  click: function() {
    webview.src = 'https://google.com';
  }
}) );

menuItems.append( new nw.MenuItem({
  label: 'Surf Github',
  click: function() {
    webview.src = 'https://github.com';
  }
}) );

menu.append( new nw.MenuItem({ label: "The Menu", submenu: menuItems }) );
var w = nw.Window.get();
w.menu = menu;

这种方式下，主页面始终保留NWJS的上下文，菜单功能完全不受影响，外部内容在webview中安全隔离加载。

方案3：跳转后重新绑定菜单（不推荐） #

如果一定要用window.location.href跳转，理论上可以在页面加载完成后重新初始化菜单，但外部站点通常有内容安全策略（CSP）限制，而且这种方式非常不稳定，只有当你完全控制目标页面时才有可能实现，所以不推荐使用。

验证问题 #

按照你提供的复现步骤：

• 克隆仓库并切换到tested-menu分支
• 执行npm run build后启动应用
• 点击Google菜单项后，原窗口被替换为谷歌站点，此时菜单点击事件失效，因为当前页面已经不是NWJS的本地页面，无法访问NWJS API。

用方案1或2修改代码后，就能解决菜单失效的问题，保持菜单的正常功能。

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