这个问题我之前也碰到过，核心原因是Electron对height参数的默认行为和你预期的可能不一样，下面给你几个针对性的解决方案：

先搞清楚问题根源 #

默认情况下，Electron的height参数指的是**整个窗口（包括标题栏、边框等框架元素）**的总高度。如果你测量的是网页内容区域的高度，那肯定会比设置的702px小——因为框架部分占用了一部分高度（不同系统的框架高度不一样，一般在20-30px左右，你这里差22px刚好符合这个范围）。

如果你的需求是让内容区域严格为702px，或者让整个窗口总高度严格为702px，对应不同的解决方法：

方案1：让内容区域高度严格为702px（最常用） #

添加useContentSize: true配置项，这样你设置的height就专门指内容区域的高度，Electron会自动加上框架的高度来计算整个窗口的总大小：

mainWindow = new BrowserWindow({ 
  width: 1024, 
  height: 702, 
  title: "Home",
  useContentSize: true
});

方案2：让整个窗口总高度严格为702px（隐藏框架） #

如果你就是想要整个窗口（包括边框标题栏）的总高度是702px，但框架占用了部分空间导致实际显示不够，那可以隐藏窗口框架（设置frame: false），这样窗口就没有额外的框架元素，设置的height就是整个窗口的高度：

mainWindow = new BrowserWindow({ 
  width: 1024, 
  height: 702, 
  title: "Home",
  frame: false
});

⚠️ 注意：隐藏框架后，你需要自己实现窗口拖动、最小化/最大化/关闭这些功能，比如通过添加自定义标题栏组件来实现。

方案3：手动校准窗口大小（兜底方案） #

如果上面的方法都没生效，可以在窗口加载完成后手动调整大小，确保高度符合预期：

mainWindow = new BrowserWindow({ 
  width: 1024, 
  height: 702, 
  title: "Home"
});

// 窗口准备好显示时调整大小
mainWindow.on('ready-to-show', () => {
  const currentContentBounds = mainWindow.getContentBounds();
  // 计算需要调整的高度差
  const heightDelta = 702 - currentContentBounds.height;
  const currentWindowBounds = mainWindow.getBounds();
  // 设置新的窗口大小
  mainWindow.setBounds({
    width: currentWindowBounds.width,
    height: currentWindowBounds.height + heightDelta
  });
});

额外检查：系统缩放设置 #

有时候系统的显示缩放（比如Windows的125%缩放、Mac的缩放设置）会影响Electron窗口的实际显示大小，可以强制关闭缩放来避免这个问题：

mainWindow = new BrowserWindow({ 
  width: 1024, 
  height: 702, 
  title: "Home",
  webPreferences: {
    zoomFactor: 1.0 // 强制缩放比例为100%
  }
});

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